From be34db31d260a58acb6e466f90d96ca62de68283 Mon Sep 17 00:00:00 2001 From: Zach Date: Sun, 15 Oct 2023 16:45:32 -0400 Subject: [PATCH 1/4] Homepage looks great on mobile landscape! --- index.html | 10 ++++---- styles.css | 73 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 78 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index 24936cc..87d0614 100644 --- a/index.html +++ b/index.html @@ -37,15 +37,15 @@

DandyHacks ‘23

alt="Major League Hacking 2024 Hackathon Season" style="width: 100%" />
-
-
- The logo of DandyHacks 2023 -
+
+
+ The logo of DandyHacks 2023 +

DandyHacks ‘23

November 3-5

-
+ diff --git a/styles.css b/styles.css index d3ab597..4c9f3a7 100644 --- a/styles.css +++ b/styles.css @@ -2745,6 +2745,79 @@ canvas { } } +@media (min-width: 768px) { + .md\:flex { + display: flex; + } + + .md\:h-fit { + height: -moz-fit-content; + height: fit-content; + } + + .md\:flex-row { + flex-direction: row; + } + + .md\:items-start { + align-items: flex-start; + } + + .md\:justify-center { + justify-content: center; + } + + .md\:gap-2 { + gap: 0.5rem; + } + + .md\:gap-2\.5 { + gap: 0.625rem; + } + + .md\:gap-0 { + gap: 0px; + } + + @media not all and (min-width: 1024px) { + .md\:max-lg\:relative { + position: relative; + } + + .md\:max-lg\:top-0 { + top: 0px; + } + + .md\:max-lg\:top-full { + top: 100%; + } + + .md\:max-lg\:bottom-16 { + bottom: 4rem; + } + + .md\:max-lg\:bottom-12 { + bottom: 3rem; + } + + .md\:max-lg\:bottom-14 { + bottom: 3.5rem; + } + + .md\:max-lg\:h-3\/6 { + height: 50%; + } + + .md\:max-lg\:h-2\/3 { + height: 66.666667%; + } + + .md\:max-lg\:h-1\/2 { + height: 50%; + } + } +} + @media (min-width: 1024px) { .lg\:relative { position: relative; From c2797a05f1091c5275b5a47ea54ba2ae7acefa62 Mon Sep 17 00:00:00 2001 From: Zach Date: Sun, 15 Oct 2023 16:51:05 -0400 Subject: [PATCH 2/4] Make DandyHacks text in navbar a navigation link --- index.html | 6 +++--- styles.css | 57 ++++++------------------------------------------------ 2 files changed, 9 insertions(+), 54 deletions(-) diff --git a/index.html b/index.html index 87d0614..a8faea7 100644 --- a/index.html +++ b/index.html @@ -10,10 +10,10 @@ -
+
The logo of DandyHacks 2023 diff --git a/styles.css b/styles.css index 4c9f3a7..7210a66 100644 --- a/styles.css +++ b/styles.css @@ -2730,6 +2730,10 @@ canvas { text-align: center; } +.peer:checked ~ .peer-checked\:pointer-events-auto { + pointer-events: auto; +} + .peer:checked ~ .peer-checked\: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)); @@ -2746,15 +2750,6 @@ canvas { } @media (min-width: 768px) { - .md\:flex { - display: flex; - } - - .md\:h-fit { - height: -moz-fit-content; - height: fit-content; - } - .md\:flex-row { flex-direction: row; } @@ -2763,8 +2758,8 @@ canvas { align-items: flex-start; } - .md\:justify-center { - justify-content: center; + .md\:gap-0 { + gap: 0px; } .md\:gap-2 { @@ -2775,43 +2770,15 @@ canvas { gap: 0.625rem; } - .md\:gap-0 { - gap: 0px; - } - @media not all and (min-width: 1024px) { .md\:max-lg\:relative { position: relative; } - .md\:max-lg\:top-0 { - top: 0px; - } - - .md\:max-lg\:top-full { - top: 100%; - } - - .md\:max-lg\:bottom-16 { - bottom: 4rem; - } - - .md\:max-lg\:bottom-12 { - bottom: 3rem; - } - .md\:max-lg\:bottom-14 { bottom: 3.5rem; } - .md\:max-lg\:h-3\/6 { - height: 50%; - } - - .md\:max-lg\:h-2\/3 { - height: 66.666667%; - } - .md\:max-lg\:h-1\/2 { height: 50%; } @@ -2874,10 +2841,6 @@ canvas { flex-direction: row; } - .lg\:items-start { - align-items: flex-start; - } - .lg\:gap-0 { gap: 0px; } @@ -2890,14 +2853,6 @@ canvas { gap: 4rem; } - .lg\:gap-2 { - gap: 0.5rem; - } - - .lg\:gap-2\.5 { - gap: 0.625rem; - } - .lg\:gap-20 { gap: 5rem; } From 45cb83be239dff7e5791c7526d6e76bc3cb8e1e2 Mon Sep 17 00:00:00 2001 From: Zach Date: Sun, 15 Oct 2023 16:56:38 -0400 Subject: [PATCH 3/4] Close navigation menu when dark overlay is clicked on --- script.js | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) diff --git a/script.js b/script.js index edaa3c7..103ac97 100644 --- a/script.js +++ b/script.js @@ -11,8 +11,7 @@ document.addEventListener('DOMContentLoaded', () => { navigationLinks.forEach(navigationLink => { navigationLink.addEventListener('click', () => { - document.body.classList.remove('overflow-hidden'); - hamburgerCheckbox.checked = false; + closeNavigationMenu(); }); }); @@ -43,6 +42,19 @@ document.addEventListener('DOMContentLoaded', () => { } }); + // Close navigation menu when the dark overlay is clicked on + + const darkOverlay = navBar.querySelector('.bg-black'); + + darkOverlay.addEventListener('click', () => { + closeNavigationMenu(); + }); + + function closeNavigationMenu() { + document.body.classList.remove('overflow-hidden'); + hamburgerCheckbox.checked = false; + } + // particles.js particlesJS.load('faq', 'assets/particlesjs-config.json'); From 2e079debb014401e687a9ee1913bdcc3103e7063 Mon Sep 17 00:00:00 2001 From: Zach Date: Sun, 15 Oct 2023 17:02:57 -0400 Subject: [PATCH 4/4] Make nav items visible without hamburger menu from md screen --- index.html | 10 +++--- styles.css | 90 +++++++++++++++++++++++++++++++++++------------------- 2 files changed, 63 insertions(+), 37 deletions(-) diff --git a/index.html b/index.html index a8faea7..53b835c 100644 --- a/index.html +++ b/index.html @@ -9,13 +9,13 @@ -