diff --git a/css/styles.css b/css/styles.css index aaaf416..9875367 100644 --- a/css/styles.css +++ b/css/styles.css @@ -190,13 +190,18 @@ nav ul li a:hover { .hero h1 { font-size: 40px; } + + .hero h1 br { + display: none; + } } .hero h1 span { + display: inline-block; + padding: 20px; color: #fbbc04; - padding: 15px 10px 0px 0px; - border: 3px solid #fbbc04; - border-radius: 50%; + background: url("/images/assets/hero/frame.svg") no-repeat center center; + background-size: contain; } .hero-cta { @@ -295,12 +300,24 @@ nav ul li a:hover { margin-bottom: 15px; } +@media (max-width: 760px) { + .about .content p.title { + font-size: 20px; + } +} + .about .content p.sub-title { font-size: 18px; font-weight: 400; color: #1e1e1ecc; } +@media (max-width: 760px) { + .about .content p.sub-title { + font-size: 14px; + } +} + .about .cta { padding: 10px 24px 10px 20px; border-radius: 25px; @@ -318,6 +335,15 @@ nav ul li a:hover { gap: 6px; } +@media (max-width: 760px) { + .about .cta { + padding: 5px 10px; + } + .about .cta .content { + font-size: 14px; + } +} + /* join section start */ #why-join { @@ -355,7 +381,6 @@ nav ul li a:hover { height: 700px; width: 300px; border-radius: 20px; - transform: rotate(90deg); } @@ -363,15 +388,28 @@ nav ul li a:hover { margin-top: -24rem; } +#why-join .section-header .title { + text-align: center; + margin-bottom: 10px; + font-size: 2rem; + font-weight: 700; +} + +@media (max-width: 768px) { + #why-join .section-header .title { + font-size: 1.1rem; + } +} + #why-join .title { text-align: left; - margin-bottom: 10px; - font-size: 2.5rem; + margin-bottom: 5px; + font-size: 1.5rem; font-weight: 700; } #why-join .content { - font-size: 1.3rem; + font-size: 1rem; font-weight: 400; } @@ -661,10 +699,11 @@ section header { gap: 0.6em; background-color: #000; border-radius: 35px; - padding: 1rem 0; + padding: 0.8rem 0; width: 20%; min-width: 300px; margin: auto; + font-size: 1rem; } .view-team button { @@ -919,7 +958,7 @@ h3 { } .join-us__list-text { - font-size: 1.5rem; + font-size: 1rem; } .stroke-double { @@ -1163,13 +1202,14 @@ h3 { gap: 0.6em; background-color: #000; border-radius: 35px; - padding: 1rem 0; + padding: 0.5rem 0; } .view-events button { color: #fff; background-color: transparent; border: none; + font-size: 1rem; } .go-to-icon { @@ -1315,6 +1355,63 @@ h3 { /* end of carousel parallax effect */ +/* beginning of events section styling */ + +#eventsTabContent .tagging { + display: inline-block; + padding: 0.5em 1em; + border-radius: 50px; + font-size: 0.875rem; + text-align: center; +} + +#eventsTabContent .tagging.red { + background-color: #ffcdd2; + color: #b71c1c; +} + +#eventsTabContent .tagging.green { + background-color: #c8e6c9; + color: #1b5e20; +} + +#eventsTabContent .tagging.blue { + background-color: #bbdefb; + color: #0d47a1; +} + +#eventsTabContent .tagging.gold { + background-color: #ffecb3; + color: #ff9800; +} + +#eventsTabContent .register { + display: inline-block; + padding: 0.5em 1em; + border-radius: 50px; + font-size: 0.875rem; + text-align: center; + color: #fff; +} + +#eventsTabContent .register.red { + background-color: #b71c1c; +} + +#eventsTabContent .register.green { + background-color: #1b5e20; +} + +#eventsTabContent .register.blue { + background-color: #0d47a1; +} + +#eventsTabContent .register.gold { + background-color: #ff9800; +} + +/* end of events section styling */ + /* beginning of subscribe section styling */ .subscribe-section { @@ -1346,7 +1443,8 @@ h3 { } .subscribe-section button { - background-color: #000; + background-color: #0a2212; + border: none; flex-basis: 30%; } diff --git a/images/assets/hero/frame.svg b/images/assets/hero/frame.svg new file mode 100644 index 0000000..9619190 --- /dev/null +++ b/images/assets/hero/frame.svg @@ -0,0 +1,10 @@ + diff --git a/images/assets/hero/saparator.svg b/images/assets/hero/saparator.svg deleted file mode 100644 index 5953056..0000000 --- a/images/assets/hero/saparator.svg +++ /dev/null @@ -1,46 +0,0 @@ - - diff --git a/images/assets/hero/separator.svg b/images/assets/hero/separator.svg new file mode 100644 index 0000000..9414b3f --- /dev/null +++ b/images/assets/hero/separator.svg @@ -0,0 +1,56 @@ + diff --git a/index.html b/index.html index 6b18f84..f1ce896 100644 --- a/index.html +++ b/index.html @@ -63,7 +63,7 @@
At GDSC Unilag, we're dedicated to nurturing the next generation of developers. Through innovation and collaboration, we provide the tools and support needed for success. Join us as we shape the future of technology together.
@@ -75,7 +75,7 @@Why should you join GDSC?
+⭐️Why should you join GDSC?⭐️