Skip to content

Commit

Permalink
Merge pull request #47 from UR-dandyhacks/dev
Browse files Browse the repository at this point in the history 
Add the Past Projects section
  • Loading branch information
@cszach
cszach authored Oct 20, 2023
2 parents 970caa7 + 6ff1d71 commit 1d4f76e
Show file tree
Hide file tree
Showing 2 changed files with 102 additions and 72 deletions.
46 changes: 39 additions & 7 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,14 @@
<nav class="fixed z-30 flex flex-row items-center justify-between flex-none w-full px-5 py-5 transition-transform md:px-12 bg-deep-purple translate-y-0">
<h3 class="text-2xl"><a href="#hero">DandyHacks &OpenCurlyQuote;23</a></h3>
<div>
<input class="absolute z-50 w-8 h-8 opacity-0 peer md:hidden" type="checkbox" />
<div class="fixed top-0 left-0 w-screen h-screen bg-black opacity-0 pointer-events-none peer-checked:pointer-events-auto transition-opacity peer-checked:opacity-50 md:hidden"></div>
<img class="relative z-40 md:hidden" src="img/icons/hamburger.png" />
<ul class="fixed top-0 right-0 z-30 flex flex-col h-screen pt-32 text-3xl font-bold transition-transform gap-8 md:flex-row md:text-xl px-9 md:p-0 w-72 bg-violet peer-checked:translate-x-0 translate-x-72 md:bg-deep-purple md:translate-x-0 md:w-fit md:h-fit md:relative md:gap-16 md:transition-none">
<input class="absolute z-50 w-8 h-8 opacity-0 peer lg:hidden" type="checkbox" />
<div class="fixed top-0 left-0 w-screen h-screen bg-black opacity-0 pointer-events-none peer-checked:pointer-events-auto transition-opacity peer-checked:opacity-50 lg:hidden"></div>
<img class="relative z-40 lg:hidden" src="img/icons/hamburger.png" />
<ul class="fixed top-0 right-0 z-30 flex flex-col h-screen pt-32 pb-16 text-3xl font-bold landscape:max-lg:overflow-auto transition-transform gap-8 lg:flex-row lg:text-xl px-9 lg:p-0 w-72 bg-violet peer-checked:translate-x-0 translate-x-72 lg:bg-deep-purple lg:translate-x-0 lg:w-fit lg:h-fit lg:relative lg:gap-10 lg:transition-none">
<li class="text-right hover:scale-110 transition-transform origin-center"><a href="#about">About</a></li>
<li class="text-right hover:scale-110 transition-transform origin-center"><a href="#tracks">Tracks</a></li>
<li class="text-right hover:scale-110 transition-transform origin-center"><a href="#prizes">Prizes</a></li>
<li class="text-right hover:scale-110 transition-transform origin-center"><a href="#past-projects">Past projects</a></li>
<li class="text-right hover:scale-110 transition-transform origin-center"><a href="#faq">FAQ</a></li>
<li class="hidden text-right hover:scale-110 transition-transform origin-center lg:block"><a href="#sponsoring">Sponsoring</a></li>
</ul>
Expand Down Expand Up @@ -126,8 +127,8 @@ <h3 class="mb-4 text-2xl text-center font-display">Emerging Tech</h3>
</div>
</div>
</div>
<div id="particles-js" class="relative px-5 bg-deep-purple">
<div class="flex flex-col items-center justify-center pt-16 gap-10 bg-deep-purple">
<div id="particles-js" class="relative flex flex-col items-center px-5 bg-deep-purple">
<div class="flex flex-col items-center justify-center py-16 gap-10 bg-deep-purple">
<h2 class="text-5xl">
<div id="prizes" class="absolute -top-20"></div>
Prizes
Expand All @@ -143,7 +144,38 @@ <h2 class="text-5xl">
<div class="hover-scale pointer-events-auto flex items-center h-28 p-8 bg-no-repeat bg-contain w-72 md:w-80 lg:w-96 grow-0 rounded-2xl bg-prize-amazon-fire-stick bg-violet bg-[bottom_-16px_right_0px]"><h3>Amazon Fire Stick</h3></div>
</div>
</div>
<div class="flex flex-col items-center py-24 box-border gap-12 lg:gap-20">
<div class="flex flex-col grow-0 items-center w-full gap-7 lg:gap-11 px-9 lg:px-0 lg:w-[999px] box-border text-base lg:text-xl">
<h2 class="text-5xl text-center">
<div id="past-projects" class="absolute -top-20"></div>
Past projects
</h2>
<div class="flex flex-row flex-wrap justify-center pt-5 pb-12 lg:pt-1 gap-12">
<a href="https://devpost.com/software/goodsoup" target="_blank" class="w-[298px] h-[448px] rounded-3xl bg-violet hover-scale overflow-hidden">
<img class="w-full mx-auto mb-9" src="img/projects/goodsoup.png" />
<h3 class="mb-4 text-2xl text-center font-display">GoodSoup</h3>
<p class="px-6 text-center">
The dining hall recipe allergen analysis.
</p>
</a>
<a href="https://devpost.com/software/project-eleos" target="_blank" class="w-[298px] h-[448px] rounded-3xl bg-violet hover-scale overflow-hidden">
<img class="w-full mx-auto mb-9" src="img/projects/project-eleos.png" />
<h3 class="mb-4 text-2xl text-center font-display">Project Eleos</h3>
<p class="px-6 text-center">
Project Eleos is our attempt at solving the issue of computational
power and its availability to the average person.
</p>
</a>
<a href="https://devpost.com/software/2-tris" target="_blank" class="w-[298px] h-[448px] rounded-3xl bg-violet hover-scale overflow-hidden">
<img class="w-full mx-auto mb-9" src="img/projects/2-tris.jpg" />
<h3 class="mb-4 text-2xl text-center font-display">2-Tris</h3>
<p class="px-6 text-center">
A 2d co-op shooter version of Tetris featuring 3 classically
composed pieces.
</p>
</a>
</div>
</div>
<div class="flex flex-col items-center pb-24 pt-11 box-border gap-12 lg:gap-20">
<h2 class="text-5xl">
<div id="faq" class="absolute -top-20"></div>
FAQS
Expand Down
128 changes: 63 additions & 65 deletions styles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -741,6 +741,10 @@ h1, h2, h3, h4, h5, h6 {
margin-bottom: 1.25rem;
}

.mb-9 {
margin-bottom: 2.25rem;
}

.mt-2 {
margin-top: 0.5rem;
}
Expand Down Expand Up @@ -2171,14 +2175,9 @@ h1, h2, h3, h4, h5, h6 {
padding-right: 2.25rem;
}

.py-12 {
padding-top: 3rem;
padding-bottom: 3rem;
}

.py-24 {
padding-top: 6rem;
padding-bottom: 6rem;
.py-16 {
padding-top: 4rem;
padding-bottom: 4rem;
}

.py-4 {
Expand All @@ -2191,22 +2190,30 @@ h1, h2, h3, h4, h5, h6 {
padding-bottom: 1.25rem;
}

.pb-12 {
padding-bottom: 3rem;
}

.pb-16 {
padding-bottom: 4rem;
}

.pb-24 {
padding-bottom: 6rem;
}

.pb-7 {
padding-bottom: 1.75rem;
}

.pt-16 {
padding-top: 4rem;
.pt-11 {
padding-top: 2.75rem;
}

.pt-32 {
padding-top: 8rem;
}

.pb-12 {
padding-bottom: 3rem;
}

.pt-5 {
padding-top: 1.25rem;
}
Expand Down Expand Up @@ -2955,33 +2962,10 @@ canvas {
}

@media (min-width: 768px) {
.md\:relative {
position: relative;
}

.md\:hidden {
display: none;
}

.md\:h-fit {
height: -moz-fit-content;
height: fit-content;
}

.md\:w-80 {
width: 20rem;
}

.md\:w-fit {
width: -moz-fit-content;
width: fit-content;
}

.md\:translate-x-0 {
--tw-translate-x: 0px;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.md\:flex-row {
flex-direction: row;
}
Expand All @@ -2994,10 +2978,6 @@ canvas {
gap: 0px;
}

.md\:gap-16 {
gap: 4rem;
}

.md\:gap-2 {
gap: 0.5rem;
}
Expand All @@ -3006,29 +2986,11 @@ canvas {
gap: 0.625rem;
}

.md\:bg-deep-purple {
--tw-bg-opacity: 1;
background-color: rgb(27 0 44 / var(--tw-bg-opacity));
}

.md\:p-0 {
padding: 0px;
}

.md\:px-12 {
padding-left: 3rem;
padding-right: 3rem;
}

.md\:text-xl {
font-size: 1.25rem;
line-height: 1.75rem;
}

.md\:transition-none {
transition-property: none;
}

@media not all and (min-width: 1024px) {
.md\:max-lg\:relative {
position: relative;
Expand Down Expand Up @@ -3069,6 +3031,15 @@ canvas {
display: flex;
}

.lg\:hidden {
display: none;
}

.lg\:h-fit {
height: -moz-fit-content;
height: fit-content;
}

.lg\:w-96 {
width: 24rem;
}
Expand All @@ -3077,10 +3048,20 @@ canvas {
width: 999px;
}

.lg\:w-fit {
width: -moz-fit-content;
width: fit-content;
}

.lg\:flex-\[0_0_454px\] {
flex: 0 0 454px;
}

.lg\:translate-x-0 {
--tw-translate-x: 0px;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.lg\:flex-row {
flex-direction: row;
}
Expand All @@ -3089,6 +3070,10 @@ canvas {
gap: 0px;
}

.lg\:gap-10 {
gap: 2.5rem;
}

.lg\:gap-11 {
gap: 2.75rem;
}
Expand All @@ -3101,8 +3086,9 @@ canvas {
gap: 5rem;
}

.lg\:self-start {
align-self: flex-start;
.lg\:bg-deep-purple {
--tw-bg-opacity: 1;
background-color: rgb(27 0 44 / var(--tw-bg-opacity));
}

.lg\:bg-groundboi {
Expand All @@ -3121,6 +3107,10 @@ canvas {
background-repeat: no-repeat;
}

.lg\:p-0 {
padding: 0px;
}

.lg\:px-0 {
padding-left: 0px;
padding-right: 0px;
Expand Down Expand Up @@ -3179,6 +3169,10 @@ canvas {
font-size: 1.25rem;
line-height: 1.75rem;
}

.lg\:transition-none {
transition-property: none;
}
}

@media (prefers-color-scheme: dark) {
Expand All @@ -3190,10 +3184,6 @@ canvas {
}

@media (min-width: 1280px) {
.xl\:relative {
position: relative;
}

.xl\:block {
display: block;
}
Expand All @@ -3212,3 +3202,11 @@ canvas {
}
}
}

@media (orientation: landscape) {
@media not all and (min-width: 1024px) {
.landscape\:max-lg\:overflow-auto {
overflow: auto;
}
}
}

0 comments on commit 1d4f76e

Please sign in to comment.