Skip to content

Update workshop cards to reflect paused status for Grub and Slushies #19

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
hippogriff101 wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Update workshop cards to reflect paused status for Grub and Slushies #19

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
87 changes: 44 additions & 43 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -124,27 +124,6 @@ <h2 class="card-title">Waffles</h2>
</div>
</article>

<div class="connector"><span>↓</span><p>if you want a CSS framework</p></div>

<article class="card" style="--card-bg: #c10007; --card-accent: #ffdf20; --card-text: #fff;">
<img class="card-media" src="./imgs/grub.png" alt="Grub illustration" />
<div class="card-body">
<div>
<p class="card-label">Framework track</p>
<h2 class="card-title">Grub</h2>
<p class="card-copy"><strong>Build a website using the Tailwind CSS framework, and get free junk food!</strong></p>
<p class="card-meta">Estimated time: 1-2 hours</p>
</div>
<div class="card-badges">
<span class="reward-tag">$6-10</span>
</div>
</div>
<div class="card-actions">
<a class="button button-primary" href="https://grub.hackclub.com" target="_blank" rel="noreferrer">Check it out</a>
<a class="button button-secondary" href="https://forms.hackclub.com/grubworkshop" target="_blank" rel="noreferrer">Run a workshop</a>
</div>
</article>

<div class="connector"><span>↓</span><p>if you want a modern framework</p></div>

<article class="card" style="--card-bg: #112a4f; --card-accent: #61DBFB; --card-text: #fff;">
Expand All @@ -166,26 +145,6 @@ <h2 class="card-title">Reactive</h2>
</div>
</article>

<div class="connector"><span>↓</span><p>if you want backend</p></div>

<article class="card" style="--card-bg: #4E9CDB; --card-accent: #fff; --card-text: #fff;">
<img class="card-media" src="./imgs/slushies.png" alt="Slushies illustration" />
<div class="card-body">
<div>
<p class="card-label">Backend track</p>
<h2 class="card-title">Slushies</h2>
<p class="card-copy"><strong>Make a web app using the Flask backend framework, and get a slushie or any food item!</strong></p>
<p class="card-meta">Estimated time: 1-3 hours</p>
</div>
<div class="card-badges">
<span class="reward-tag">$5-10</span>
</div>
</div>
<div class="card-actions">
<a class="button button-primary" href="https://slushies.hackclub.com" target="_blank" rel="noreferrer">Check it out</a>
<a class="button button-secondary" href="https://forms.hackclub.com/t/7NNfphNi8sus" target="_blank" rel="noreferrer">Run a workshop</a>
</div>
</article>
<div class="connector"><span>↓</span><p>3D track</p></div>

<article class="card" style="--card-bg: #c70014; --card-accent: #fff; --card-text: #fff;">
Expand All @@ -212,10 +171,31 @@ <h2 class="card-title">Polygon</h2>

<div class="notice">
<h3>Old events</h3>
<p><strong>Zoo, Boba Olympics</strong> are currently not running. Stay tuned for updates about Zoo, Boba Olympics.</p>
<p><strong>Zoo, Boba Olympics, Grub and Slushies</strong> are currently not running. Stay tuned for updates.</p>
</div>

<div class="connector"><span>↓</span><p>these are paused for now</p></div>
<div class="connector"><span>↓</span><p>if you want a CSS framework</p></div>

<article class="card card-muted" style="--card-bg: #c10007; --card-accent: #ffdf20; --card-text: #fff;">
<img class="card-media card-media-muted" src="./imgs/grub.png" alt="Grub illustration" />
<div class="card-body">
<div>
<p class="card-label">Paused</p>
<h2 class="card-title">Grub</h2>
<p class="card-copy"><strong>Build a website using the Tailwind CSS framework, and get free junk food!</strong></p>
<p class="card-meta">Estimated time: 1-2 hours</p>
</div>
<div class="card-badges">
<span class="reward-tag">$6-10</span>
</div>
</div>
<div class="card-actions">
<a class="button button-primary button-disabled" aria-disabled="true" href="https://grub.hackclub.com" target="_blank" rel="noreferrer">Check it out</a>
<a class="button button-secondary button-disabled" aria-disabled="true" href="https://forms.hackclub.com/grubworkshop" target="_blank" rel="noreferrer">Run a workshop</a>
</div>
</article>

<div class="connector"><span>↓</span><p>if you want to take trip to the zoo, try</p></div>

<article class="card card-muted" style="--card-bg: #103D10; --card-accent: #408000; --card-text: #fff;">
<img class="card-media card-media-muted" src="./imgs/zoo.png" alt="Zoo logo" />
Expand Down Expand Up @@ -255,6 +235,27 @@ <h2 class="card-title">Boba Olympics</h2>
</div>
</article>
</section>

<div class="connector"><span>↓</span><p>if you want backend</p></div>

<article class="card card-muted" style="--card-bg: #4E9CDB; --card-accent: #fff; --card-text: #fff;">
<img class="card-media card-media-muted" src="./imgs/slushies.png" alt="Slushies illustration" />
<div class="card-body">
<div>
<p class="card-label">Paused</p>
<h2 class="card-title">Slushies</h2>
<p class="card-copy"><strong>Make a web app using the Flask backend framework, and get a slushie or any food item!</strong></p>
<p class="card-meta">Estimated time: 1-3 hours</p>
</div>
<div class="card-badges">
<span class="reward-tag">$5-10</span>
</div>
</div>
<div class="card-actions">
<a class="button button-disabled" aria-disabled="true" href="https://slushies.hackclub.com" target="_blank" rel="noreferrer">Check it out</a>
<a class="button button-disabled" aria-disabled="true" href="https://forms.hackclub.com/t/7NNfphNi8sus" target="_blank" rel="noreferrer">Run a workshop</a>
</div>
</article>

<section class="fulfillment" aria-labelledby="fulfillment-title">
<h2 id="fulfillment-title">How do I receive my grant?</h2>
Expand Down