added a committee's page
This commit is contained in:
chark1es
parent
193691c29a
commit
4d93e3c7b5
1 changed files with 156 additions and 0 deletions
156
src/pages/committees.astro
Normal file
156
src/pages/committees.astro
Normal file
|
|
@ -0,0 +1,156 @@
|
|||
---
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
---
|
||||
|
||||
<Layout>
|
||||
<div class="flex flex-col">
|
||||
<div
|
||||
class="bg-ieee h-[35em] rounded-b-[10%] my-auto flex flex-col items-center justify-center bg-blend-overlay bg-no-repeat bg-cover align-center bg-center"
|
||||
style="background-image: url('/backgrounds/robocar.png');"
|
||||
>
|
||||
<!-- BLUE BG -->
|
||||
<div class="flex flex-col items-center justify-center text-center">
|
||||
<div class="text-[3.2em] text-white font-bold mb-4 w-[11em]">
|
||||
The backbone of IEEE. Come help make a difference!
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col justify-center items-center">
|
||||
<div
|
||||
class="flex items-center justify-center mt-12 text-ieee font-bold text-[3em]"
|
||||
>
|
||||
Quarterly Projects
|
||||
</div>
|
||||
<div
|
||||
class="flex items-center justify-center max-w-3xl text-center font-bold text-[1.8em]"
|
||||
>
|
||||
Interested in gaining experience in event planning and
|
||||
development, meeting new friends, and learning more about IEEE?
|
||||
Join one of our committees as an IEEEntern!
|
||||
</div>
|
||||
|
||||
<div class="flex flex-wrap my-12">
|
||||
<div
|
||||
class="flex flex-row flex-wrap justify-center items-center"
|
||||
>
|
||||
<!-- Technical -->
|
||||
<div
|
||||
class="w-[40rem] h-[30rem] rounded-2xl flex flex-col mx-6 my-6 justify-center items-center bg-ieee bg-blend-multiply bg-cover bg-center bg-no-repeat bg-opacity-80 group overflow-hidden p-6"
|
||||
style="background-image: url('/backgrounds/technical.png');"
|
||||
>
|
||||
<div
|
||||
class="absolute text-white font-bold text-[3em] text-center transition-transform duration-500 opacity-100 group-hover:translate-y-[-150%]"
|
||||
>
|
||||
Technical Committee
|
||||
</div>
|
||||
<div
|
||||
class="text-white font-bold text-[1.2em] text-center transition-trasnform duration-700 opacity-0 group-hover:opacity-100 pt-16"
|
||||
>
|
||||
The Technical Committee is responsible for
|
||||
maintaining and improving the organization's
|
||||
technical skills program. Through developing,
|
||||
planning, and executing a minimum of six technical
|
||||
events throughout the year, this chair seeks to
|
||||
improve students' technical skills. Events can
|
||||
include PCB, soldering, hardware, and software. You
|
||||
can build anything with students!
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Social -->
|
||||
|
||||
<div
|
||||
class="w-[40rem] h-[30rem] rounded-2xl flex flex-col mx-6 my-6 justify-center items-center bg-ieee bg-blend-multiply bg-cover bg-center bg-no-repeat bg-opacity-80 group overflow-hidden p-6"
|
||||
style="background-image: url('/backgrounds/social.png');"
|
||||
>
|
||||
<div
|
||||
class="absolute text-white font-bold text-[3em] text-center transition-transform duration-500 opacity-100 group-hover:translate-y-[-125%]"
|
||||
>
|
||||
Social Committee
|
||||
</div>
|
||||
<div
|
||||
class="text-white font-bold text-[1.2em] text-center transition-trasnform duration-700 opacity-0 group-hover:opacity-100 pt-16"
|
||||
>
|
||||
The Social Committee is in charge of planning and
|
||||
executing social events that create bonding
|
||||
opportunities for officers and our student members.
|
||||
Interested in arranging a hike at Torrey Pines?
|
||||
Sharing some free food and drinks in Warren Mall?
|
||||
Going out for an escape room challenge? There are
|
||||
tons of ideas waiting for you to implement!
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Professional -->
|
||||
|
||||
<div
|
||||
class="w-[40rem] h-[30rem] rounded-2xl flex flex-col mx-6 my-6 justify-center items-center bg-ieee bg-blend-multiply bg-cover bg-center bg-no-repeat bg-opacity-80 group overflow-hidden p-6"
|
||||
style="background-image: url('/backgrounds/professional.png');"
|
||||
>
|
||||
<div
|
||||
class="absolute text-white font-bold text-[3em] text-center transition-transform duration-500 opacity-100 group-hover:translate-y-[-175%]"
|
||||
>
|
||||
Professional Committee
|
||||
</div>
|
||||
<div
|
||||
class="text-white font-bold text-[1.2em] text-center transition-trasnform duration-700 opacity-0 group-hover:opacity-100 pt-24"
|
||||
>
|
||||
The Professional Committee is responsible for
|
||||
maintaining and improving the organization's
|
||||
professional development program. Through
|
||||
developing, planning, and executing a minimum of six
|
||||
professional events throughout the year, such as,
|
||||
workshops on developing professional skills, company
|
||||
(sponsor) information sessions, tech talks, tours,
|
||||
and the annual ECE day (partnered with the VC
|
||||
External), this committee seeks to improve students'
|
||||
professional skills.
|
||||
</div>
|
||||
</div>
|
||||
<!-- PR -->
|
||||
|
||||
<div
|
||||
class="w-[40rem] h-[30rem] rounded-2xl flex flex-col mx-6 my-6 justify-center items-center bg-ieee bg-blend-multiply bg-cover bg-center bg-no-repeat bg-opacity-80 group overflow-hidden p-6"
|
||||
style="background-image: url('/backgrounds/professional.png');"
|
||||
>
|
||||
<div
|
||||
class="absolute text-white font-bold text-[3em] text-center transition-transform duration-500 opacity-100 group-hover:translate-y-[-110%]"
|
||||
>
|
||||
PR Committee
|
||||
</div>
|
||||
<div
|
||||
class="text-white font-bold text-[1.2em] text-center transition-trasnform duration-700 opacity-0 group-hover:opacity-100 pt-12"
|
||||
>
|
||||
The PR Comittee is responsible for creating and
|
||||
printing flyers, photographs, and other media. They
|
||||
also aid in managing the Branch's social media
|
||||
presence by distributing the news of the Branch's
|
||||
events, projects, and outreach.
|
||||
</div>
|
||||
</div>
|
||||
<!-- PR -->
|
||||
<div
|
||||
class="w-[40rem] h-[30rem] rounded-2xl flex flex-col mx-6 my-6 justify-center items-center bg-ieee bg-blend-multiply bg-cover bg-center bg-no-repeat bg-opacity-80 group overflow-hidden p-6"
|
||||
style="background-image: url('/backgrounds/professional.png');"
|
||||
>
|
||||
<div
|
||||
class="absolute text-white font-bold text-[3em] text-center transition-transform duration-500 opacity-100 group-hover:translate-y-[-125%]"
|
||||
>
|
||||
Outreach Committee
|
||||
</div>
|
||||
<div
|
||||
class="text-white font-bold text-[1.2em] text-center transition-trasnform duration-700 opacity-0 group-hover:opacity-100 pt-16"
|
||||
>
|
||||
The Outreach Committee is responsible for hosting
|
||||
outreach events that will benefit K-12 students
|
||||
within the STEM fields including the annual Boy
|
||||
Scout STEM Merit Badge Fair, Girls STEM Fair, and
|
||||
Sumobot Robotics Competition. Up for the challenge
|
||||
to explain Ohm's Law to a 10-year-old?
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div></Layout
|
||||
>
|
||||
Loading…
Reference in a new issue