From 35b4dcaafae8cbc5d42e1492ccd869530329263b Mon Sep 17 00:00:00 2001 From: cxs7700 Date: Thu, 10 Dec 2020 03:59:18 -0500 Subject: [PATCH 01/11] layout and content with some initial styling --- index.html | 69 +++++++++++++++++++++++++++++++++++++++++++++++- sass/main.scss | 71 ++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 139 insertions(+), 1 deletion(-) diff --git a/index.html b/index.html index 3ac3f2d76..7fb95f93a 100644 --- a/index.html +++ b/index.html @@ -135,7 +135,74 @@

What is a Hackathon?

-
+
+
+

Frequently Asked Questions

+
+
+ +
+

+ Anyone currently enrolled as a student can attend! If you don't fit that description, you're + absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older. +

+
+
+ +
+ +
+

+ Anyone currently enrolled as a student can attend! If you don't fit that description, you're + absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older. +

+
+
+ +
+ +
+

+ Anyone currently enrolled as a student can attend! If you don't fit that description, you're + absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older. +

+
+
+ +
+ +
+

+ Anyone currently enrolled as a student can attend! If you don't fit that description, you're + absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older. +

+
+
+ +
+ +
+

+ Anyone currently enrolled as a student can attend! If you don't fit that description, you're + absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older. +

+
+
+ +
+ +
+

+ Anyone currently enrolled as a student can attend! If you don't fit that description, you're + absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older. +

+
+
+
+ +

Don't see your question here? Contact Us

+ +

Leadership Team

diff --git a/sass/main.scss b/sass/main.scss index 193049bf2..74c2c6eea 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -351,6 +351,77 @@ nav { } } +#faq-content { + padding: $section-padding; + background-color: $dark-blue; + #faq-wrapper { + h1 { + font-size: $title-size; + margin-bottom: 4rem; + } + #faq-cards { + display: flex; + flex-flow: row wrap; + justify-content: space-between; + margin: auto; + .card { + width: 49%; + .accordion { + transition: 0.4s; + text-align: left; + cursor: pointer; + padding: 1rem 1.5rem; + background-color: #455296; + border-radius: 7px; + border: 1px solid $light-blue; + align-self: start; + outline: none; + width: 100%; + &::before { + content: '\002B'; + margin-right: 1rem; + } + &:hover { + opacity: 0.8; + } + } + .panel { + display: block; + margin: 0 0 2rem; + background-color: #fff; + overflow: hidden; + border-bottom-left-radius: 7px; + border-bottom-right-radius: 7px; + padding: 0 18px; + p { + color: $dark-blue + } + } + + .active { + background-color: #fff; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; + } + + .active, + .active:before { + content: "\2796"; + margin-right: 1rem; + } + } + } + #contact { + margin: 4rem 0 0; + a { + text-transform: uppercase; + color: $red; + font-weight: $font-bold; + } + } + } +} + #leadership { padding: $section-padding; background-color: $light-blue; From 126c7e68803a4c85cfdaa02ae8766d3196f8fa01 Mon Sep 17 00:00:00 2001 From: cxs7700 Date: Thu, 10 Dec 2020 04:15:23 -0500 Subject: [PATCH 02/11] added js for accordion --- index.html | 26 +++++++++++++------------- index.js | 17 ++++++++++++++++- sass/main.scss | 12 +++++++----- 3 files changed, 36 insertions(+), 19 deletions(-) diff --git a/index.html b/index.html index 7fb95f93a..82b7208d7 100644 --- a/index.html +++ b/index.html @@ -143,65 +143,65 @@

Frequently Asked Questions

- Anyone currently enrolled as a student can attend! If you don't fit that description, you're + Anyone currently enrolled as a student can attend! If you don't fit that description, you're absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

- +

- Anyone currently enrolled as a student can attend! If you don't fit that description, you're + Anyone currently enrolled as a student can attend! If you don't fit that description, you're absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

- +

- Anyone currently enrolled as a student can attend! If you don't fit that description, you're + Anyone currently enrolled as a student can attend! If you don't fit that description, you're absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

- +

- Anyone currently enrolled as a student can attend! If you don't fit that description, you're + Anyone currently enrolled as a student can attend! If you don't fit that description, you're absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

- +

- Anyone currently enrolled as a student can attend! If you don't fit that description, you're + Anyone currently enrolled as a student can attend! If you don't fit that description, you're absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

- +

- Anyone currently enrolled as a student can attend! If you don't fit that description, you're + Anyone currently enrolled as a student can attend! If you don't fit that description, you're absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

- +

Don't see your question here? Contact Us

- +
diff --git a/index.js b/index.js index 12eb33781..d16821b62 100644 --- a/index.js +++ b/index.js @@ -21,4 +21,19 @@ $(document).ready(function() { autoplaySpeed: 2000, speed: 1000, }); -}); \ No newline at end of file +}); + +let acc = document.getElementsByClassName("accordion"); +let i; + +for (i = 0; i < acc.length; i++) { + acc[i].addEventListener("click", function() { + this.classList.toggle("active"); + let panel = this.nextElementSibling; + if (panel.style.display === "block") { + panel.style.display = "none"; + } else { + panel.style.display = "block"; + } + }); +} \ No newline at end of file diff --git a/sass/main.scss b/sass/main.scss index 74c2c6eea..b4fc1b94b 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -377,6 +377,7 @@ nav { align-self: start; outline: none; width: 100%; + margin-bottom: 1rem; &::before { content: '\002B'; margin-right: 1rem; @@ -386,7 +387,7 @@ nav { } } .panel { - display: block; + display: none; margin: 0 0 2rem; background-color: #fff; overflow: hidden; @@ -394,17 +395,18 @@ nav { border-bottom-right-radius: 7px; padding: 0 18px; p { - color: $dark-blue + color: $dark-blue; } } - + .active { background-color: #fff; border-bottom-left-radius: 0; border-bottom-right-radius: 0; + margin-bottom: 0; } - - .active, + + .active, .active:before { content: "\2796"; margin-right: 1rem; From 6dde94bbd068981ddd61ae5f0e7f83a36ed90b52 Mon Sep 17 00:00:00 2001 From: cxs7700 Date: Thu, 10 Dec 2020 05:03:23 -0500 Subject: [PATCH 03/11] finishing touches on icons --- index.html | 13 +++++++------ index.js | 20 +++++++++++--------- sass/main.scss | 28 +++++++++++++++++++--------- 3 files changed, 37 insertions(+), 24 deletions(-) diff --git a/index.html b/index.html index 82b7208d7..d605fda16 100644 --- a/index.html +++ b/index.html @@ -140,7 +140,7 @@

What is a Hackathon?

Frequently Asked Questions

- +

Anyone currently enrolled as a student can attend! If you don't fit that description, you're @@ -150,7 +150,8 @@

Frequently Asked Questions

- + +

Anyone currently enrolled as a student can attend! If you don't fit that description, you're @@ -160,7 +161,7 @@

Frequently Asked Questions

- +

Anyone currently enrolled as a student can attend! If you don't fit that description, you're @@ -170,7 +171,7 @@

Frequently Asked Questions

- +

Anyone currently enrolled as a student can attend! If you don't fit that description, you're @@ -180,7 +181,7 @@

Frequently Asked Questions

- +

Anyone currently enrolled as a student can attend! If you don't fit that description, you're @@ -190,7 +191,7 @@

Frequently Asked Questions

- +

Anyone currently enrolled as a student can attend! If you don't fit that description, you're diff --git a/index.js b/index.js index d16821b62..bac13db2d 100644 --- a/index.js +++ b/index.js @@ -27,13 +27,15 @@ let acc = document.getElementsByClassName("accordion"); let i; for (i = 0; i < acc.length; i++) { - acc[i].addEventListener("click", function() { - this.classList.toggle("active"); - let panel = this.nextElementSibling; - if (panel.style.display === "block") { - panel.style.display = "none"; - } else { - panel.style.display = "block"; - } - }); + acc[i].addEventListener("click", function() { + this.classList.toggle("active"); + let panel = this.nextElementSibling; + if (panel.style.display === "block") { + panel.style.display = "none"; + this.getElementsByTagName("i")[0].style.display = "inline-block"; + } else { + panel.style.display = "block"; + this.getElementsByTagName("i")[0].style.display = "none"; + } + }); } \ No newline at end of file diff --git a/sass/main.scss b/sass/main.scss index b4fc1b94b..be95702ba 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -367,23 +367,32 @@ nav { .card { width: 49%; .accordion { - transition: 0.4s; text-align: left; - cursor: pointer; padding: 1rem 1.5rem; background-color: #455296; border-radius: 7px; - border: 1px solid $light-blue; + border: none; align-self: start; outline: none; width: 100%; margin-bottom: 1rem; - &::before { - content: '\002B'; + .fa-plus { + content: '\02795'; margin-right: 1rem; + &-red { + color: $red; + } + + &-pink { + color: $pink; + } + &-orange { + color: $orange; + } + } &:hover { - opacity: 0.8; + cursor: pointer; } } .panel { @@ -393,9 +402,10 @@ nav { overflow: hidden; border-bottom-left-radius: 7px; border-bottom-right-radius: 7px; - padding: 0 18px; + padding: 0 3.5rem 1rem 3.5rem; p { color: $dark-blue; + line-height: 23px; } } @@ -404,9 +414,9 @@ nav { border-bottom-left-radius: 0; border-bottom-right-radius: 0; margin-bottom: 0; + color: $dark-blue; } - .active, .active:before { content: "\2796"; margin-right: 1rem; @@ -414,7 +424,7 @@ nav { } } #contact { - margin: 4rem 0 0; + margin: 2rem 0 0; a { text-transform: uppercase; color: $red; From d9d2e7697010dc350e810d04bde47830cc831fbf Mon Sep 17 00:00:00 2001 From: cxs7700 Date: Thu, 10 Dec 2020 15:25:59 -0500 Subject: [PATCH 04/11] removed noopener --- index.html | 111 +++++++++++++++++++++++++------------------------ index.js | 6 +-- sass/main.scss | 15 ++++--- 3 files changed, 68 insertions(+), 64 deletions(-) diff --git a/index.html b/index.html index 4fb406464..147bda6b7 100644 --- a/index.html +++ b/index.html @@ -143,70 +143,73 @@

What is a Hackathon?

Frequently Asked Questions

-
- -
-

- Anyone currently enrolled as a student can attend! If you don't fit that description, you're - absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older. -

+
+
+ +
+

Anyone currently enrolled as a student can attend! If you don't fit that description, you're + absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

+
-
- -
- - -
-

- Anyone currently enrolled as a student can attend! If you don't fit that description, you're - absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older. -

+
+ +
+

Anyone currently enrolled as a student can attend! If you don't fit that description, you're + absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

+
-
- -
- -
-

- Anyone currently enrolled as a student can attend! If you don't fit that description, you're - absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older. -

+
+ +
+

Anyone currently enrolled as a student can attend! If you don't fit that description, you're + absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

+
+
-
- -
-

- Anyone currently enrolled as a student can attend! If you don't fit that description, you're - absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older. -

+
+ +
+

Anyone currently enrolled as a student can attend! If you don't fit that description, you're + absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

+
-
- -
- -
-

- Anyone currently enrolled as a student can attend! If you don't fit that description, you're - absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older. -

+
+ +
+

Anyone currently enrolled as a student can attend! If you don't fit that description, you're + absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

+
-
- -
- -
-

- Anyone currently enrolled as a student can attend! If you don't fit that description, you're - absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older. -

+
+ +
+

Anyone currently enrolled as a student can attend! If you don't fit that description, you're + absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

+
- -

Don't see your question here? Contact Us

- +

Don't see your question here? Contact Us

diff --git a/index.js b/index.js index bac13db2d..a7f0b4ee4 100644 --- a/index.js +++ b/index.js @@ -24,9 +24,7 @@ $(document).ready(function() { }); let acc = document.getElementsByClassName("accordion"); -let i; - -for (i = 0; i < acc.length; i++) { +for (let i = 0; i < acc.length; i++) { acc[i].addEventListener("click", function() { this.classList.toggle("active"); let panel = this.nextElementSibling; @@ -38,4 +36,4 @@ for (i = 0; i < acc.length; i++) { this.getElementsByTagName("i")[0].style.display = "none"; } }); -} \ No newline at end of file +} diff --git a/sass/main.scss b/sass/main.scss index fcb3ca912..4ca446b57 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -361,10 +361,16 @@ nav { #faq-cards { display: flex; flex-flow: row wrap; - justify-content: space-between; - margin: auto; - .card { + &-left { + width: 49%; + margin-right: .5rem; + } + &-right { width: 49%; + margin-left: .5rem; + } + .card { + width: 100%; .accordion { text-align: left; padding: 1rem 1.5rem; @@ -388,7 +394,6 @@ nav { &-orange { color: $orange; } - } &:hover { cursor: pointer; @@ -407,7 +412,6 @@ nav { line-height: 23px; } } - .active { background-color: #fff; border-bottom-left-radius: 0; @@ -415,7 +419,6 @@ nav { margin-bottom: 0; color: $dark-blue; } - .active:before { content: "\2796"; margin-right: 1rem; From 688eca24f52d1171c383f3cd80c24d4e869ba3bf Mon Sep 17 00:00:00 2001 From: cxs7700 Date: Thu, 10 Dec 2020 22:00:25 -0500 Subject: [PATCH 05/11] contact url, question and answer styles --- index.html | 2 +- sass/main.scss | 16 ++++++++++++++-- 2 files changed, 15 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index 31724b471..f13d70c30 100644 --- a/index.html +++ b/index.html @@ -273,7 +273,7 @@

Frequently Asked Questions

-

Don't see your question here? Contact Us

+

Don't see your question here? Contact Us

diff --git a/sass/main.scss b/sass/main.scss index fc65f86af..a82491024 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -391,9 +391,9 @@ nav { background-color: #455296; border-radius: 7px; border: none; - align-self: start; outline: none; width: 100%; + font-size: $nav-fontsize; margin-bottom: 1rem; .fa-plus { content: '\02795'; @@ -411,6 +411,13 @@ nav { } &:hover { cursor: pointer; + transition: all 400ms ease; + &:hover { + background-color: lighten($red, 5%); + } + &:active { + transform: translateY(4px); + } } } .panel { @@ -420,10 +427,12 @@ nav { overflow: hidden; border-bottom-left-radius: 7px; border-bottom-right-radius: 7px; - padding: 0 3.5rem 1rem 3.5rem; + padding: 0 3.5rem 1rem 4.1rem; + font-size: 12px; p { color: $dark-blue; line-height: 23px; + transition: top .5s ease-in-out; } } .active { @@ -445,6 +454,9 @@ nav { text-transform: uppercase; color: $red; font-weight: $font-bold; + &:hover { + text-decoration: underline; + } } } } From 052dd87b55baa2aeeda2e140a0cf0e8cb3a33193 Mon Sep 17 00:00:00 2001 From: Peter Kos Date: Thu, 10 Dec 2020 22:46:19 -0500 Subject: [PATCH 06/11] Refactored :) Signed-off-by: Peter Kos --- index.html | 12 ++++----- index.js | 29 +++++++++++++-------- sass/main.scss | 69 ++++++++++++++++++++++++-------------------------- 3 files changed, 58 insertions(+), 52 deletions(-) diff --git a/index.html b/index.html index f13d70c30..45b41380d 100644 --- a/index.html +++ b/index.html @@ -209,7 +209,7 @@

Frequently Asked Questions

- @@ -219,7 +219,7 @@

Frequently Asked Questions

- @@ -229,7 +229,7 @@

Frequently Asked Questions

- @@ -242,7 +242,7 @@

Frequently Asked Questions

- @@ -252,7 +252,7 @@

Frequently Asked Questions

- @@ -262,7 +262,7 @@

Frequently Asked Questions

- diff --git a/index.js b/index.js index 4b5ff4611..e0459d0b3 100644 --- a/index.js +++ b/index.js @@ -23,17 +23,26 @@ $(document).ready(function() { }); }); -let acc = document.getElementsByClassName("accordion"); -for (let i = 0; i < acc.length; i++) { - acc[i].addEventListener("click", function() { - this.classList.toggle("active"); - let panel = this.nextElementSibling; - if (panel.style.display === "block") { - panel.style.display = "none"; - this.getElementsByTagName("i")[0].style.display = "inline-block"; +let card = document.getElementsByClassName("card"); +for (let i = 0; i < card.length; i++) { + let accordion = card[i].getElementsByClassName("accordion-header")[0]; + // Click should only work on accordion-header of each card + accordion.addEventListener("click", function() { + + card[i].classList.toggle("active"); + + let panel = card[i].getElementsByClassName("panel")[0]; + let fa = this.getElementsByTagName("i")[0] + + // Toggle panel and plus/minus on click of header + if ($(panel).css("display") == "none") { + $(panel).show(); + $(fa).removeClass("fa-plus"); + $(fa).addClass("fa-minus"); } else { - panel.style.display = "block"; - this.getElementsByTagName("i")[0].style.display = "none"; + $(panel).hide(); + $(fa).addClass("fa-plus"); + $(fa).removeClass("fa-minus"); } }); } diff --git a/sass/main.scss b/sass/main.scss index a82491024..8d9a3b659 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -385,48 +385,43 @@ nav { } .card { width: 100%; - .accordion { + margin-bottom: 20px; + border-radius: 7px; + background-color: $light-blue; + + &:hover { + // transition: all 400ms ease; + background-color: lighten($light-blue, 5%); + } + + .accordion-header { + background-color: transparent; + cursor: pointer; text-align: left; padding: 1rem 1.5rem; - background-color: #455296; - border-radius: 7px; border: none; outline: none; width: 100%; font-size: $nav-fontsize; - margin-bottom: 1rem; - .fa-plus { - content: '\02795'; + + .fa-plus, .fa-minus { margin-right: 1rem; - &-red { - color: $red; - } - - &-pink { - color: $pink; - } - &-orange { - color: $orange; - } } - &:hover { - cursor: pointer; - transition: all 400ms ease; - &:hover { - background-color: lighten($red, 5%); - } - &:active { - transform: translateY(4px); - } + + .fa-plus { + &-red { color: $red; } + &-pink { color: $pink; } + &-orange { color: $orange; } + } + + .fa-minus { + color: $blue; } } .panel { display: none; margin: 0 0 2rem; - background-color: #fff; overflow: hidden; - border-bottom-left-radius: 7px; - border-bottom-right-radius: 7px; padding: 0 3.5rem 1rem 4.1rem; font-size: 12px; p { @@ -435,16 +430,18 @@ nav { transition: top .5s ease-in-out; } } - .active { - background-color: #fff; - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; - margin-bottom: 0; + } + .active { + margin-bottom: 0; + background-color: white; + + // Need to explicitly set for some reason + .accordion-header, .panel { color: $dark-blue; } - .active:before { - content: "\2796"; - margin-right: 1rem; + + &:hover { + background-color: white; } } } From 259a60992a002cd7b94ccfe69cb1bc7582fc6ad8 Mon Sep 17 00:00:00 2001 From: Peter Kos Date: Thu, 10 Dec 2020 23:04:16 -0500 Subject: [PATCH 07/11] Animations working!! Signed-off-by: Peter Kos --- index.js | 13 ++++++------- sass/main.scss | 3 --- 2 files changed, 6 insertions(+), 10 deletions(-) diff --git a/index.js b/index.js index e0459d0b3..0ae42e2b2 100644 --- a/index.js +++ b/index.js @@ -35,15 +35,14 @@ for (let i = 0; i < card.length; i++) { let fa = this.getElementsByTagName("i")[0] // Toggle panel and plus/minus on click of header - if ($(panel).css("display") == "none") { - $(panel).show(); - $(fa).removeClass("fa-plus"); - $(fa).addClass("fa-minus"); + if ($(card[i]).hasClass("active")) { + $(panel).slideDown(200); } else { - $(panel).hide(); - $(fa).addClass("fa-plus"); - $(fa).removeClass("fa-minus"); + $(panel).slideUp(200); } + + $(fa).toggleClass("fa-plus"); + $(fa).toggleClass("fa-minus"); }); } diff --git a/sass/main.scss b/sass/main.scss index 8d9a3b659..65459d9ee 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -390,7 +390,6 @@ nav { background-color: $light-blue; &:hover { - // transition: all 400ms ease; background-color: lighten($light-blue, 5%); } @@ -420,7 +419,6 @@ nav { } .panel { display: none; - margin: 0 0 2rem; overflow: hidden; padding: 0 3.5rem 1rem 4.1rem; font-size: 12px; @@ -432,7 +430,6 @@ nav { } } .active { - margin-bottom: 0; background-color: white; // Need to explicitly set for some reason From 4a866c25ba536cbdcfd1abcddc7204cb800f01e4 Mon Sep 17 00:00:00 2001 From: cxs7700 Date: Thu, 10 Dec 2020 23:30:15 -0500 Subject: [PATCH 08/11] cleaning up unnecessary styles --- index.html | 2 +- index.js | 2 +- sass/main.scss | 12 ++---------- 3 files changed, 4 insertions(+), 12 deletions(-) diff --git a/index.html b/index.html index 45b41380d..b57c9880f 100644 --- a/index.html +++ b/index.html @@ -203,7 +203,7 @@
SUNDAY
-
+

Frequently Asked Questions

diff --git a/index.js b/index.js index 0ae42e2b2..8d513c93e 100644 --- a/index.js +++ b/index.js @@ -32,7 +32,7 @@ for (let i = 0; i < card.length; i++) { card[i].classList.toggle("active"); let panel = card[i].getElementsByClassName("panel")[0]; - let fa = this.getElementsByTagName("i")[0] + let fa = this.getElementsByTagName("i")[0]; // Toggle panel and plus/minus on click of header if ($(card[i]).hasClass("active")) { diff --git a/sass/main.scss b/sass/main.scss index 65459d9ee..b9ce3b307 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -364,7 +364,7 @@ nav { } } -#faq-content { +#faq { padding: $section-padding; background-color: $dark-blue; #faq-wrapper { @@ -375,6 +375,7 @@ nav { #faq-cards { display: flex; flex-flow: row wrap; + margin-bottom: 3rem; &-left { width: 49%; margin-right: .5rem; @@ -388,11 +389,9 @@ nav { margin-bottom: 20px; border-radius: 7px; background-color: $light-blue; - &:hover { background-color: lighten($light-blue, 5%); } - .accordion-header { background-color: transparent; cursor: pointer; @@ -402,30 +401,25 @@ nav { outline: none; width: 100%; font-size: $nav-fontsize; - .fa-plus, .fa-minus { margin-right: 1rem; } - .fa-plus { &-red { color: $red; } &-pink { color: $pink; } &-orange { color: $orange; } } - .fa-minus { color: $blue; } } .panel { display: none; - overflow: hidden; padding: 0 3.5rem 1rem 4.1rem; font-size: 12px; p { color: $dark-blue; line-height: 23px; - transition: top .5s ease-in-out; } } } @@ -436,14 +430,12 @@ nav { .accordion-header, .panel { color: $dark-blue; } - &:hover { background-color: white; } } } #contact { - margin: 2rem 0 0; a { text-transform: uppercase; color: $red; From b39cabb2d7e8b18575639c2483a29558928b26c3 Mon Sep 17 00:00:00 2001 From: Peter Kos Date: Thu, 10 Dec 2020 23:53:17 -0500 Subject: [PATCH 09/11] Added question content, fixed link color in card Signed-off-by: Peter Kos --- index.html | 34 +++++++++++++++++----------------- sass/main.scss | 5 ++++- 2 files changed, 21 insertions(+), 18 deletions(-) diff --git a/index.html b/index.html index b57c9880f..e965039aa 100644 --- a/index.html +++ b/index.html @@ -214,7 +214,8 @@

Frequently Asked Questions

Who can participate in BrickHack?
-

Anyone currently enrolled as a student can attend! If you don't fit that description, you're +

Anyone currently enrolled as a student can attend!

+

If you don't fit that description, you're absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

@@ -224,8 +225,7 @@

Frequently Asked Questions

Do I need a team to join?
-

Anyone currently enrolled as a student can attend! If you don't fit that description, you're - absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

+

Nope! If you have an existing team, that's great — otherwise, we'll provide time to form new teams with other hackers at the start of the event.

@@ -234,41 +234,41 @@

Frequently Asked Questions

Do RIT students need to apply?
-

Anyone currently enrolled as a student can attend! If you don't fit that description, you're - absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

+

Yes. All students, RIT or not, need to apply to the event.

+

Our main limitation is space. Even though we're a digtial event, we need to provide judging, chat moderation, interpreting services, and more. All of these require staff, and we only have so many resources to run the event.

+

Maybe next year we'll have AI run the event...

-
-

Anyone currently enrolled as a student can attend! If you don't fit that description, you're - absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

+

We've put a lot of thought into making sure all of BrickHack can be enjoyed by everyone. We're planning to have intepreting services and audio captioning to boot, with more accomodations to come in the future.

+

During registration, put services that you require in the "special needs" field, and we'll do our best to meet them!

+

For any outstanding questions, email hello@coderit.org.

-

Anyone currently enrolled as a student can attend! If you don't fit that description, you're - absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

+

Soon!

+

(We'll send an email out if you are accepted.)

-

Anyone currently enrolled as a student can attend! If you don't fit that description, you're - absolutely welcome to attend as a mentor or volunteer. All attendees must be 18 years or older.

+

We've got you covered.

diff --git a/sass/main.scss b/sass/main.scss index b9ce3b307..b18017c9d 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -84,7 +84,7 @@ a { } p { - font-size: 1.2em; + font-size: 1.3em; } // Nav @@ -421,6 +421,9 @@ nav { color: $dark-blue; line-height: 23px; } + a { + color: $red; + } } } .active { From f85b77a1aa5e7d455ffe50cfb9d41a55173af16c Mon Sep 17 00:00:00 2001 From: Peter Kos Date: Fri, 11 Dec 2020 00:07:42 -0500 Subject: [PATCH 10/11] Tweak panel p styling Make margin styling a bit better but messier Signed-off-by: Peter Kos --- sass/main.scss | 31 ++++++++++++++++++++----------- 1 file changed, 20 insertions(+), 11 deletions(-) diff --git a/sass/main.scss b/sass/main.scss index b18017c9d..ea3bfa722 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -375,18 +375,21 @@ nav { #faq-cards { display: flex; flex-flow: row wrap; - margin-bottom: 3rem; + justify-content: space-between; + + // TODO: This can be cleaner. + $card-m: 20px; &-left { - width: 49%; - margin-right: .5rem; + width: calc(50% - (#{$card-m} / 2)); + margin-right: $card-m / 2; } &-right { - width: 49%; - margin-left: .5rem; + width: calc(50% - (#{$card-m} / 2)); + margin-left: $card-m / 2; } .card { width: 100%; - margin-bottom: 20px; + margin-bottom: $card-m; border-radius: 7px; background-color: $light-blue; &:hover { @@ -396,13 +399,14 @@ nav { background-color: transparent; cursor: pointer; text-align: left; - padding: 1rem 1.5rem; + padding: 20px 30px; border: none; outline: none; width: 100%; font-size: $nav-fontsize; + .fa-plus, .fa-minus { - margin-right: 1rem; + margin-right: 10px; } .fa-plus { &-red { color: $red; } @@ -414,12 +418,17 @@ nav { } } .panel { - display: none; - padding: 0 3.5rem 1rem 4.1rem; - font-size: 12px; + display: none; // Toggled in JS + margin-top: -30px; + padding: 20px 30px; + font-size: 0.8em; + // Align w/ header text, not sure if this can be made cleaner. + margin-left: 35px; + p { color: $dark-blue; line-height: 23px; + margin-bottom: 10px; } a { color: $red; From a2d157c214a80a14040dab5bbe24feed76336f43 Mon Sep 17 00:00:00 2001 From: Peter Kos Date: Fri, 11 Dec 2020 00:08:48 -0500 Subject: [PATCH 11/11] Remove unnesesecary outline none Signed-off-by: Peter Kos --- sass/main.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/sass/main.scss b/sass/main.scss index ea3bfa722..3f50b91e2 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -401,7 +401,6 @@ nav { text-align: left; padding: 20px 30px; border: none; - outline: none; width: 100%; font-size: $nav-fontsize;