smaller title text for mobile

acmucsd · Dec 10, 2024 · a220d26 · a220d26
1 parent be08211
commit a220d26
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/src/sections/Sponsors/index.tsx b/src/sections/Sponsors/index.tsx
@@ -9,7 +9,9 @@ const Sponsors: React.FC = () => {
   return (
     <section className={styles.container}>
       <div className={styles.content}>
-        <Typography variant="display/heavy/small">Thank you to our past sponsors...</Typography>
+        <Typography variant="display/heavy/small" className={styles.title}>
+          Thank you to our past sponsors...
+        </Typography>
         <div className={styles.sponsorLogos}>
           {SPONSORS.map(sponsor => (
             <Link href={sponsor.link} key={sponsor.name}>

diff --git a/src/sections/Sponsors/style.module.scss b/src/sections/Sponsors/style.module.scss
@@ -13,7 +13,6 @@
     padding-bottom: 5rem;
   }
 }
-
 .content {
   display: flex;
   flex-direction: column;
@@ -25,6 +24,13 @@
   text-align: center;
 }
 
+.title {
+  @media screen and (max-width: vars.$breakpoint-md) {
+    font-size: 2.25rem !important;
+    line-height: 2.625rem !important;
+  }
+}
+
 .sponsorLogos {
   display: flex;
   flex-wrap: wrap;