Fix background gradient and About Us description (#176)

* update about us description * fix background gradient * fix about us text placement on different screen sizes
HackAtUCI · Oct 9, 2024 · 9061c15 · 9061c15
1 parent 613cdba
commit 9061c15
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 13 deletions.
diff --git a/apps/site/src/app/(home)/sections/Intro/Intro.module.scss b/apps/site/src/app/(home)/sections/Intro/Intro.module.scss
@@ -2,18 +2,34 @@
 
 .description {
  text-align: center;
- font-size: 1rem;
+ font-size: 0.85rem;
 
- @include bootstrap.media-breakpoint-up(sm) {
+ @media screen and (min-width: 415px) {
+ font-size: 1rem;
+ }
+
+ @media screen and (min-width: 500px) {
+ font-size: 1.25rem;
+ }
+
+ @include bootstrap.media-breakpoint-up(xl) {
  font-size: 1.5rem;
  }
 }
 
 .header {
- font-size: 1.25rem;
+ font-size: 1rem;
  font-weight: 600;
 
+ @media screen and (min-width: 415px) {
+ font-size: 1.25rem;
+ }
+
  @include bootstrap.media-breakpoint-up(sm) {
+ font-size: 1.5rem;
+ }
+
+ @include bootstrap.media-breakpoint-up(xl) {
  font-size: 2rem;
  }
 }
@@ -26,7 +42,7 @@
  margin-top: 3vw;
 
  @media screen and (min-width: 400px) {
- margin-top: 12.5vw;
+ margin-top: 7.5vw;
  }
 
  @include bootstrap.media-breakpoint-up(sm) {

diff --git a/apps/site/src/app/(home)/sections/Intro/Intro.tsx b/apps/site/src/app/(home)/sections/Intro/Intro.tsx
@@ -5,11 +5,13 @@ export default function Intro() {
  <div className={styles.intro}>
  <h2 className={styles.header}>What is ZotHacks?</h2>
  <p className={styles.description}>
- ZotHacks is UC Irvine’s beginner-friendly hackathon, where students with
- minimal computer science experience will learn to build their first CS
- project. Through ZotHacks, we introduce these students to the world of
- hackathons and web development by providing technical workshops, strong
- mentorship, and free food!
+ ZotHacks is a 12-hour hackathon designed for beginners where students
+ with minimal computer science experience will learn to build their first
+ CS project. Through ZotHacks, we introduce these students to the world
+ of hackathons and web development by providing technical workshops,
+ dedicated mentors for every team, and free food! We encourage applicants
+ from all backgrounds, including underrepresented minorities, majors, or
+ genders to apply!
  </p>
  </div>
  );

diff --git a/apps/site/src/lib/styles/globals.scss b/apps/site/src/lib/styles/globals.scss
@@ -4,10 +4,6 @@ $container-padding: 8rem;
 
 .background {
  background: linear-gradient(#01a6c4, #01a7c5 67%, #00c1a9 82%, #8dbd9e);
-
- @media screen and (min-height: 600px) {
- background: #01a6c4;
- }
 }
 
 .accordion {