Skip to content

Commit 47d6553

Browse files
authored
Merge pull request #9 from Skyhawkbotics/newboard
Update nonprofit page for new board members
2 parents 5c87532 + 82b0c84 commit 47d6553

5 files changed

Lines changed: 113 additions & 17 deletions

File tree

src/assets/css/main.css

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4142,6 +4142,55 @@ input, select, textarea {
41424142
padding: 0.5em 0.5em;
41434143
}
41444144

4145+
.flip-card {
4146+
background-color: transparent;
4147+
width: 100%;
4148+
aspect-ratio: 1 / 1;
4149+
min-height: fit-content;
4150+
box-shadow: 0 8px 16px 0 #db201e;
4151+
perspective: 1000px; /* Remove this if you don't want the 3D effect */
4152+
}
4153+
4154+
/* This container is needed to position the front and back side */
4155+
.flip-card-inner {
4156+
position: relative;
4157+
width: 100%;
4158+
height: 100%;
4159+
text-align: center;
4160+
transition: transform 0.8s;
4161+
transform-style: preserve-3d;
4162+
}
4163+
4164+
/* Do an horizontal flip when you move the mouse over the flip box container */
4165+
.flip-card:hover .flip-card-inner {
4166+
transform: rotateY(180deg);
4167+
}
4168+
4169+
/* Position the front and back side */
4170+
.flip-card-front, .flip-card-back {
4171+
position: absolute;
4172+
width: 100%;
4173+
height: 100%;
4174+
-webkit-backface-visibility: hidden; /* Safari */
4175+
backface-visibility: hidden;
4176+
}
4177+
4178+
/* Style the front side (fallback if image is missing) */
4179+
.flip-card-front {
4180+
background-color: #000;
4181+
color: white;
4182+
}
4183+
4184+
/* Style the back side */
4185+
.flip-card-back {
4186+
background-color: #000;
4187+
height:fit-content;
4188+
min-height: 100%;
4189+
transform: rotateY(180deg);
4190+
padding: 0.5em 0.5em;
4191+
box-shadow: 0 16px 32px 0 #db201e;
4192+
}
4193+
41454194
/* Flexbox layout for sticky footer */
41464195
html, body {
41474196
height: 100%;

src/images/people/devsahay.jpg

1.21 MB
Loading

src/images/people/eric.jpg

1.37 MB
Loading

src/images/people/tymen.jpg

-757 KB
Loading

src/nonprofit/index.html

Lines changed: 64 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -58,50 +58,97 @@ <h3> Our Mission Statement</h3>
5858
</section>
5959

6060
<h3>Our Board Members</h3>
61+
<h4>Current Board Members</h4>
6162
<section>
6263
<div class="box alt">
6364
<div class="row gtr-uniform">
64-
<section class="col-12 col-12-medium col-12-xsmall">
65+
<section class="col-6 col-6-medium col-12-xsmall">
6566
<div class="card">
66-
<img src="images/people/ruben.jpg" alt="Avatar" style="width:100%">
67+
<img src="images/people/eric.jpg" alt="Avatar" style="width:100%">
6768
<div class="container">
68-
<h4><b>Ruben Yoder</b></h4>
69-
<p><strong>Nonprofit President</strong>,<br> Hardware Mechanic, Software Developer</p>
70-
<p>August 2023 - June 2025</p>
71-
<p><blockquote>No program better prepares students from all backgrounds for success in the real world as the <em>FIRST<sup>®</sup></em> Tech Challenge. I’ve had uncountable inspirational moments over the last 4 years, and the skills I’ve learned are invaluable.”</blockquote>
69+
<h4><b>Eric Cheng</b></h4>
70+
<p><strong>Nonprofit President</strong>,<br> Hardware Mechanic, Software Developer, Social Media</p>
71+
<p>May 2025 - May 2027</p>
72+
<p><blockquote>My body will fail before the auto does.”</blockquote>
7273
</p>
7374
</div>
7475
</div>
7576
</section>
7677
<section class="col-6 col-6-medium col-12-xsmall">
7778
<div class="card">
78-
<img src="images/people/xandur.png" alt="Avatar" style="width:100%">
79+
<img src="images/people/tymen.jpg" alt="Avatar" style="width:100%">
7980
<div class="container">
80-
<h4><b>Xandur Grantt-Martin</b></h4>
81-
<p><strong>Nonprofit Vice President</strong>,<br> Club President, Drive Team, Computer Assisted Design</p>
82-
<p>August 2023 - May 2025</p>
83-
<p><blockquote>“As the Hawbot1cs President, I am proud to be a part of this amazing team through all our struggles and our breakthroughs.”
81+
<h4><b>Tymen Yoder</b></h4>
82+
<p><strong>Nonprofit Vice President</strong>,<br> Club President, Drive Team, Computer Assisted Design, Hardware Mechanic</p>
83+
<p>May 2025 - May 2027</p>
84+
<p><blockquote>When I joined this team, I felt motivated to learn. I have learned many things, such as CAD and design. I even did a little coding once. I think FTC is an opportunity for anyone to learn and enjoy engineering.
8485
</blockquote>
8586
</p>
8687
</div>
8788
</div>
8889
</section>
8990
<section class="col-6 col-6-medium col-12-xsmall">
9091
<div class="card">
91-
<img src="images/people/ray.jpg" alt="Avatar" style="width:100%">
92+
<img src="images/people/devsahay.jpg" alt="Avatar" style="width:100%">
9293
<div class="container">
93-
<h4><b>Ray Lara</b></h4>
94-
<p><strong>Nonprofit Secretary</strong>,<br> Drive Team, Hardware Mechanic</p>
95-
<p>May 2024 - May 2025</p>
96-
<p><blockquote>Hawkbot1cs is one of the cores of my life. We fly high and swoop down for the win; through all circumstances.”
94+
<h4><b>Dev Sahay</b></h4>
95+
<p><strong>Nonprofit Secretary</strong>,<br> Computer Assisted Design, Social Media</p>
96+
<p>June 2025 - May 2026</p>
97+
<p><blockquote>Although I’ve only been a part of Hawkbot1cs for a short amount of time, I have learned a great deal about FTC and robotics overall. I am very thankful for the chance to learn and to gain real-world experience.”
9798
</blockquote>
9899
</p>
99100
</div>
100101
</div>
101102
</section>
102103
</div>
103104
</section>
104-
105+
<h4>Former Board Members</h4>
106+
<div class="box alt">
107+
<div class="row gtr-uniform">
108+
<section class="col-6 col-12-small col-12-xsmall">
109+
<div class="flip-card">
110+
<div class="flip-card-inner">
111+
<div class="flip-card-front">
112+
<img src="images/people/ruben.jpg" alt="Avatar" style="width:100%">
113+
</div>
114+
<div class="flip-card-back">
115+
<h4>Ruben Yoder</h4>
116+
<p>1st Nonprofit President</p>
117+
<blockquote>“No program better prepares students from all backgrounds for success in the real world as the <em>FIRST<sup>®</sup></em> Tech Challenge. I’ve had uncountable inspirational moments over the last 4 years, and the skills I’ve learned are invaluable.”</blockquote>
118+
</div>
119+
</div>
120+
</div>
121+
</section>
122+
<section class="col-6 col-12-small col-12-xsmall">
123+
<div class="flip-card">
124+
<div class="flip-card-inner">
125+
<div class="flip-card-front">
126+
<img src="images/people/xandur.png" alt="Avatar" style="width:100%">
127+
</div>
128+
<div class="flip-card-back">
129+
<h4>Xandur Grantt-Martin</h4>
130+
<p>1st Nonprofit Vice President</p>
131+
<blockquote>“As the Hawbot1cs President, I am proud to be a part of this amazing team through all our struggles and our breakthroughs.”</blockquote>
132+
</div>
133+
</div>
134+
</div>
135+
</section>
136+
<section class="col-6 col-12-small col-12-xsmall">
137+
<div class="flip-card">
138+
<div class="flip-card-inner">
139+
<div class="flip-card-front">
140+
<img src="images/people/ray.jpg" alt="Avatar" style="width:100%">
141+
</div>
142+
<div class="flip-card-back">
143+
<h4>Ray Lara</h4>
144+
<p>1st Nonprofit Secretary</p>
145+
<blockquote>“Hawkbot1cs is one of the cores of my life. We fly high and swoop down for the win; through all circumstances.”</blockquote>
146+
</div>
147+
</div>
148+
</div>
149+
</section>
150+
</div>
151+
</div>
105152
</div>
106153
<div class="col-4 col-12-medium">
107154

0 commit comments

Comments
 (0)