Made the covers work better on smartphones.

framedsc · Dec 16, 2023 · 2f991c5 · 2f991c5
1 parent dadf628
commit 2f991c5
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/components/home/year-cover.tsx b/components/home/year-cover.tsx
@@ -72,7 +72,7 @@ const framedTextStyle: CSS.Properties = {
   top: '13%',
   left: '50%',
   fontWeight: 'bold',
-  fontSize: '88px',//'110px',
+  fontSize: `18cqw`,
   textAlign: 'center',
   transform: 'translate(-50%, -50%)',
   opacity: '90%',
@@ -85,7 +85,7 @@ const yearTextStyle: CSS.Properties = {
   top: '85%',
   left:' 50%',
   fontWeight: 'lighter',
-  fontSize: '76px',//'95px',
+  fontSize: '14cqw',
   textAlign: 'center',
   transform: 'translate(-50%, -50%)',
   opacity: '80%',

diff --git a/styles/globals.scss b/styles/globals.scss
@@ -38,3 +38,7 @@ html {
     }
   }
 }
+
+.year-cover-container {
+  container-type: inline-size;
+}
-Original file line number
+Diff line change
@@ Expand Up / @@ -38,3 +38,7 @@ html { @@
         }
       }
     }
+    .year-cover-container {
+      container-type: inline-size;
+    }