fix conflict

This commit is contained in:
Shing Hung 2025-01-27 12:48:59 -08:00
commit b8e8f7b432
8 changed files with 24 additions and 20 deletions

View file

@ -7,13 +7,13 @@ import qp from "../../images/qp2.jpg";
<div class="flex flex-col items-center pb-[5%]">
<Subtitle title="We Are Excited To See You Here!" />
<p class="w-1/2 text-center text-[1.2vw] pb-[5%]">
<p class="w-1/3 text-center md:text-[1.2vw] text-[1.6vw] pb-[5%]">
If you have further questions about QP, please to reach out to the QP chairs or Vice Chair Projects through the Board page!
</p>
<Image
src={qp}
alt="qp photos"
class="w-1/2 rounded-[2vw] object-cover aspect-[2/1] opacity-85"
alt="board group photos"
class="md:w-1/2 w-[65vw] rounded-[2vw] object-cover aspect-[2/1] opacity-85"
/>
</div>

View file

@ -7,20 +7,24 @@ import join from "../../images/join.png";
---
<div class="flex justify-center mb-[10%]">
<div class="flex w-[70%] items-center">
<div class="flex md:w-[70%] w-[80%] items-center">
<div class="w-1/2 flex justify-center h-full relative">
<Image src={mentorship} alt="blue background" class="mr-[20%]" />
<Image
src={join}
alt="blue background"
<<<<<<< HEAD
class="absolute rounded-full object-cover aspect-[262/433] w-[54%] top-[5%] left-0 opacity-80"
=======
class="absolute rounded-full object-cover aspect-[262/433] w-[54%] md:top-[5%] top-[9%] left-0"
>>>>>>> 08bcf09f9c08053ec40f1c3ae02bbed3a374fb83
/>
</div>
<div class="w-1/2 font-light text-[1.2vw]">
<div class="flex items-center text-[2.3vw] mb-[5%]">
<div class="w-1/2 font-light md:text-[1.2vw] text-[1.6vw]">
<div class="flex items-center md:text-[2.3vw] text-[4vw] mb-[5%]">
<LiaDotCircle className=" mr-[1vw] pt-[0.5%]" />
<p
class="text-[2.3vw] font-bold text-transparent bg-clip-text bg-gradient-to-r from-white to-ieee-yellow"
class="md:text-[2.3vw] text-[4vw] font-bold text-transparent bg-clip-text bg-gradient-to-r from-white to-ieee-yellow"
>
How to join
</p>
@ -37,7 +41,7 @@ import join from "../../images/join.png";
<Link
href="https://tinyurl.com/20242025QPApps"
target="_blank"
className="py-[2%] px-[15%] text-[1.2vw] border-[0.1vw] border-white rounded-[0.5vw] hover:text-ieee-yellow hover:border-ieee-yellow duration-300 font-light"
className="py-[2%] px-[15%] md:text-[1.2vw] text-[1.6vw] border-[0.1vw] border-white rounded-[0.5vw] hover:text-ieee-yellow hover:border-ieee-yellow duration-300 font-light"
>
JOIN
</Link>

View file

@ -7,12 +7,12 @@ import jonathan from "../../images/about3.webp";
---
<div class="flex justify-center mt-[10%] mb-[3%]">
<div class="flex w-[70%] items-center">
<div class="w-1/2 font-light text-[1.2vw]">
<div class="flex items-center text-[2.3vw] mb-[5%]">
<div class="flex md:w-[70%] w-[80%] items-center">
<div class="md:w-1/2 w-[60%] font-light md:text-[1.2vw] text-[1.6vw]">
<div class="flex items-center md:text-[2.3vw] text-[4vw] mb-[5%]">
<LiaDotCircle className=" mr-[1vw] pt-[0.5%]" />
<p
class="text-[2.3vw] font-bold text-transparent bg-clip-text bg-gradient-to-l from-white to-ieee-yellow"
class="md:text-[2.3vw] text-[4vw] font-bold text-transparent bg-clip-text bg-gradient-to-l from-white to-ieee-yellow"
>
Mentorship
</p>
@ -33,7 +33,7 @@ import jonathan from "../../images/about3.webp";
<Link
href="https://tinyurl.com/20242025QPMentors"
target="_blank"
className="p-[2%] text-[1.2vw] border-[0.1vw] border-white rounded-[0.5vw] hover:text-ieee-yellow hover:border-ieee-yellow duration-300 font-light"
className="p-[2%] md:text-[1.2vw] text-[1.6vw] border-[0.1vw] border-white rounded-[0.5vw] hover:text-ieee-yellow hover:border-ieee-yellow duration-300 font-light"
>
BECOME A MENTOR
</Link>
@ -45,7 +45,7 @@ import jonathan from "../../images/about3.webp";
<Image
src={jonathan}
alt="blue background"
class="absolute rounded-full object-cover aspect-[262/433] w-[54%] top-[5%] right-[10%]"
class="absolute rounded-full object-cover aspect-[262/433] w-[54%] md:top-[5%] top-[15%] right-[10%]"
/>
</div>
</div>

View file

@ -5,10 +5,10 @@ import Link from "next/link";
---
<Link href={link} target="_blank" className={`ease-in-out group relative col-span-${col} text-white`}>
<img src={image} alt="past projects image" class="h-[30vh] object-cover w-full rounded-[1.5vw] opacity-80 group-hover:opacity-40 duration-300" />
<img src={image} alt="past projects image" class="md:h-[30vh] h-[15vh] object-cover w-full rounded-[1.5vw] opacity-80 group-hover:opacity-40 duration-300" />
<div class="absolute bottom-0 px-[3%] w-full bg-gradient-to-t from-black via-black to-transparent rounded-b-[1.5vw] pb-[1vw] pt-[5%]">
<div class="text-[1.1vw] flex w-full px-[2%] justify-between items-end">
<div class="text-[1.4vw] md:text-[1.1vw] flex w-full px-[2%] justify-between items-end">
<p class="py-[0.3vw] px-[1vw] border-[0.1vw] text-nowrap border-white rounded-full group-hover:text-ieee-yellow group-hover:border-ieee-yellow duration-300 font-light">
{title}
</p>

View file

@ -6,7 +6,7 @@ import Subtitle from "../core/Subtitle.astro";
<div class="flex flex-col items-center">
<Subtitle title="Past Projects" />
<div class="w-[70%] grid grid-cols-6 gap-[1.5vw]">
<div class="w-[80%] md:w-[70%] grid grid-cols-6 gap-[1.5vw]">
{projects.map((project)=>(
<PastProject
title = {project.title}

View file

@ -3,7 +3,7 @@ const { text, number, col, position, width } = Astro.props;
---
<div
class={`relative col-span-${col} border-[0.1vw] border-white/30 text-[1.2vw] bg-gradient-to-b from-white/10 to-ieee-blue-300/10 px-[1vw] py-[2vw] rounded-[1vw] `}
class={`relative col-span-${col} border-[0.1vw] border-white/30 text-[1.5vw] md:text-[1.2vw] bg-gradient-to-b from-white/10 to-ieee-blue-300/10 px-[1vw] py-[2vw] rounded-[1vw] `}
>
<p
class={`${position} text-[4vw] opacity-10 font-bold absolute leading-tight `}

View file

@ -6,7 +6,7 @@ import Subtitle from "../core/Subtitle.astro";
<div class="flex flex-col items-center mt-[7%] mb-[10%]">
<Subtitle title="How it works:" />
<div class="grid grid-rows-2 w-[70%] gap-[2vw]">
<div class="grid grid-rows-2 md:w-[70%] w-[80%] gap-[2vw]">
<div class="grid grid-cols-4 gap-[1.5vw]">
{
steps

View file

@ -31,7 +31,7 @@ import qpTimeline from "../data/qpTimeline.json"
data-inview
src={qp}
alt="board group photos"
class="in-view:animate-fade w-2/3 rounded-full object-cover aspect-[2.5/1]"
class="in-view:animate-fade md:w-2/3 w-[75vw] rounded-full object-cover aspect-[2.5/1]"
/>
</div>
<About