+
What does a sponsor do?
Sponsors enable us to:
@@ -230,23 +250,24 @@ What does a sponsor do?
from our hackers
-
+
Why sponsor?
As a sponsor, you will be able to:
-
- Connect with top students, and get early access to resumes and
- portfolios.
+ Connect with top students, and get early access to
+ resumes and portfolios.
-
- Showcase your products and see talented students make cool hacks
- with them.
+ Showcase your products and see talented students make
+ cool hacks with them.
-
- Inspire the next generation of developers to find pride and joy in
- building awesome things.
+ Inspire the next generation of developers to find pride
+ and joy in building awesome things.
- - Attract next generation talent for tech development programs.
+ - Attract next generation talent for tech development
+ programs.
@@ -256,10 +277,10 @@
Why sponsor?
diff --git a/main.css b/main.css
index 6f4e729..d128dc8 100644
--- a/main.css
+++ b/main.css
@@ -45,11 +45,15 @@
left: 0;
}
- #faq > div > * {
+ #particles-js > div > * {
position: relative;
z-index: 10;
}
+ .hover-scale, details {
+ @apply hover:scale-105 transition-transform origin-center;
+ }
+
/* Parallax effect */
.wrapper {
diff --git a/script.js b/script.js
index b2b6c16..0ddaf4e 100644
--- a/script.js
+++ b/script.js
@@ -41,5 +41,5 @@ document.addEventListener('DOMContentLoaded', () => {
// particles.js
- particlesJS.load('faq', 'assets/particlesjs-config.json');
+ particlesJS.load('particles-js', 'assets/particlesjs-config.json');
});
diff --git a/styles.css b/styles.css
index 0915fb3..584d7b1 100644
--- a/styles.css
+++ b/styles.css
@@ -844,6 +844,10 @@ h1, h2, h3, h4, h5, h6 {
display: none;
}
+.h-28 {
+ height: 7rem;
+}
+
.h-8 {
height: 2rem;
}
@@ -888,6 +892,10 @@ h1, h2, h3, h4, h5, h6 {
width: 100vw;
}
+.max-w-7xl {
+ max-width: 80rem;
+}
+
.flex-none {
flex: none;
}
@@ -936,6 +944,10 @@ h1, h2, h3, h4, h5, h6 {
border-collapse: separate;
}
+.origin-center {
+ transform-origin: center;
+}
+
.-translate-y-full {
--tw-translate-y: -100%;
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));
@@ -1427,6 +1439,10 @@ h1, h2, h3, h4, h5, h6 {
justify-items: stretch;
}
+.gap-10 {
+ gap: 2.5rem;
+}
+
.gap-12 {
gap: 3rem;
}
@@ -1771,6 +1787,10 @@ h1, h2, h3, h4, h5, h6 {
border-radius: 0.25rem;
}
+.rounded-2xl {
+ border-radius: 1rem;
+}
+
.rounded-3xl {
border-radius: 1.5rem;
}
@@ -1949,6 +1969,38 @@ h1, h2, h3, h4, h5, h6 {
background-image: url('img/hero-bg/layer4.svg');
}
+.bg-prize-acer-nitro-monitor {
+ background-image: url('img/prizes/acer_nitro_monitor.png');
+}
+
+.bg-prize-airtag {
+ background-image: url('img/prizes/airtag.png');
+}
+
+.bg-prize-amazon-fire-stick {
+ background-image: url('img/prizes/amazon_fire_stick.png');
+}
+
+.bg-prize-desk-lamp {
+ background-image: url('img/prizes/desk_lamp.png');
+}
+
+.bg-prize-echo-dot {
+ background-image: url('img/prizes/echo_dot.png');
+}
+
+.bg-prize-jbl-flip-5 {
+ background-image: url('img/prizes/jbl_flip_5.png');
+}
+
+.bg-prize-razer-blackwidow {
+ background-image: url('img/prizes/razer_blackwidow.png');
+}
+
+.bg-prize-wireless-photo-printer {
+ background-image: url('img/prizes/wireless_photo_printer.png');
+}
+
.decoration-slice {
-webkit-box-decoration-break: slice;
box-decoration-break: slice;
@@ -1969,6 +2021,10 @@ h1, h2, h3, h4, h5, h6 {
box-decoration-break: clone;
}
+.bg-contain {
+ background-size: contain;
+}
+
.bg-cover {
background-size: cover;
}
@@ -2002,6 +2058,22 @@ h1, h2, h3, h4, h5, h6 {
background-clip: text;
}
+.bg-\[bottom_-12px_right_-16px\] {
+ background-position: bottom -12px right -16px;
+}
+
+.bg-\[bottom_-16px_right_-16px\] {
+ background-position: bottom -16px right -16px;
+}
+
+.bg-\[bottom_-16px_right_0px\] {
+ background-position: bottom -16px right 0px;
+}
+
+.bg-\[bottom_-8px_right_0px\] {
+ background-position: bottom -8px right 0px;
+}
+
.bg-center-bottom {
background-position: center bottom;
}
@@ -2075,6 +2147,10 @@ h1, h2, h3, h4, h5, h6 {
padding: 1.5rem;
}
+.p-8 {
+ padding: 2rem;
+}
+
.px-10 {
padding-left: 2.5rem;
padding-right: 2.5rem;
@@ -2095,6 +2171,11 @@ 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;
@@ -2114,10 +2195,22 @@ h1, h2, h3, h4, h5, h6 {
padding-bottom: 1.75rem;
}
+.pt-16 {
+ padding-top: 4rem;
+}
+
.pt-32 {
padding-top: 8rem;
}
+.pb-12 {
+ padding-bottom: 3rem;
+}
+
+.pt-5 {
+ padding-top: 1.25rem;
+}
+
.text-left {
text-align: left;
}
@@ -2706,11 +2799,24 @@ canvas {
left: 0;
}
-#faq > div > * {
+#particles-js > div > * {
position: relative;
z-index: 10;
}
+.hover-scale, details {
+ transform-origin: center;
+ transition-property: transform;
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+ transition-duration: 150ms;
+}
+
+.hover-scale:hover, details:hover {
+ --tw-scale-x: 1.05;
+ --tw-scale-y: 1.05;
+ 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));
+}
+
/* Parallax effect */
.wrapper {
@@ -2801,6 +2907,12 @@ canvas {
}
}
+.hover\:scale-110:hover {
+ --tw-scale-x: 1.1;
+ --tw-scale-y: 1.1;
+ 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));
+}
+
.hover\:font-bold:hover {
font-weight: 700;
}
@@ -2856,6 +2968,10 @@ canvas {
height: fit-content;
}
+ .md\:w-80 {
+ width: 20rem;
+ }
+
.md\:w-fit {
width: -moz-fit-content;
width: fit-content;
@@ -2953,6 +3069,10 @@ canvas {
display: flex;
}
+ .lg\:w-96 {
+ width: 24rem;
+ }
+
.lg\:w-\[999px\] {
width: 999px;
}
@@ -3031,6 +3151,10 @@ canvas {
padding-bottom: 1.25rem;
}
+ .lg\:pt-1 {
+ padding-top: 0.25rem;
+ }
+
.lg\:text-2xl {
font-size: 1.5rem;
line-height: 2rem;
@@ -3065,6 +3189,20 @@ canvas {
}
}
+@media (min-width: 1280px) {
+ .xl\:relative {
+ position: relative;
+ }
+
+ .xl\:block {
+ display: block;
+ }
+
+ .xl\:self-start {
+ align-self: flex-start;
+ }
+}
+
@media (min-width: 768px) {
@media not all and (min-width: 1024px) {
@media (orientation: portrait) {
diff --git a/tailwind.config.js b/tailwind.config.js
index 03ce118..34de4c1 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -15,6 +15,14 @@ module.exports = {
'enchanted-forest-layer-2': "url('img/hero-bg/layer2.svg')",
'enchanted-forest-layer-3': "url('img/hero-bg/layer3.svg')",
'enchanted-forest-layer-4': "url('img/hero-bg/layer4.svg')",
+ 'prize-acer-nitro-monitor': "url('img/prizes/acer_nitro_monitor.png')",
+ 'prize-airtag': "url('img/prizes/airtag.png')",
+ 'prize-amazon-fire-stick': "url('img/prizes/amazon_fire_stick.png')",
+ 'prize-desk-lamp': "url('img/prizes/desk_lamp.png')",
+ 'prize-echo-dot': "url('img/prizes/echo_dot.png')",
+ 'prize-jbl-flip-5': "url('img/prizes/jbl_flip_5.png')",
+ 'prize-razer-blackwidow': "url('img/prizes/razer_blackwidow.png')",
+ 'prize-wireless-photo-printer': "url('img/prizes/wireless_photo_printer.png')",
},
extend: {
backgroundPosition: {