define styles for whole site

acmcsufoss · Sep 18, 2024 · 66e5140 · 66e5140
1 parent d9427fd
commit 66e5140
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 22 deletions.
diff --git a/src/components/FloatingBoxes.astro b/src/components/FloatingBoxes.astro
@@ -37,7 +37,7 @@ const boxes = Array.from({ length: numBoxes }, () => generateRandomStyles());
   .box {
     width: 2rem;
     height: 2rem;
-    position: absolute;
+    position: fixed;
     border-radius: 0.25rem;
     background-color: #11d4b1;
     animation: float infinite alternate ease-in-out;

diff --git a/src/globals.css b/src/globals.css
@@ -1,29 +1,29 @@
 @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap");
 
 :root {
+  --ff-regular: "Poppins", "sans-serif";
+  --ff-custom: "Fira Code", "monospace";
+
+  --color-primary: 33, 33, 33;
+  --color-secondary: 47, 47, 47;
+  --color-contrast: 245, 245, 245;
+
+  --color-oss-team: 17, 212, 177;
+  --color-link: 77, 208, 225;
+
   font-family: var(--ff-regular);
   line-height: 1.5;
   font-weight: 400;
 
   color-scheme: dark;
-  background-color: var(--color-primary);
-  color: var(--color-contrast);
+  background-color: rgb(var(--color-primary));
+  color: rgb(var(--color-contrast));
 
   font-synthesis: none;
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   -webkit-text-size-adjust: 100%;
-
-  --ff-regular: "Poppins", "sans-serif";
-  --ff-custom: "Fira Code", "monospace";
-
-  --color-primary: #212121;
-  --color-secondary: #2f2f2f;
-  --color-contrast: #f5f5f5;
-
-  --color-oss-team: #11d4b1;
-  --color-link: #4dd0e1;
 }
 
 *,
@@ -46,7 +46,7 @@ a:hover {
 
 .custom-link {
   text-decoration: underline;
-  color: var(--color-link);
+  color: rgb(var(--color-link));
 }
 
 body {
@@ -65,5 +65,5 @@ body {
 }
 
 .oss {
-  color: var(--color-oss-team);
+  color: rgb(var(--color-oss-team));
 }
diff --git a/src/pages/index.astro b/src/pages/index.astro
@@ -27,17 +27,18 @@ import Layout from "../layouts/Layout.astro";
   @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap");
 
   main {
-    padding: 1rem;
+    padding: 1rem 2rem;
     max-width: max-content;
     border-radius: 1.5rem;
-    border: 2px solid var(--color-secondary);
-    background-color: var(--color-secondary);
+    border: 2px solid rgb(var(--color-secondary));
+    background-color: rgba(var(--color-secondary), 0.7);
     z-index: 10;
   }
 
   h1 {
     margin: 0;
     font-size: 2rem;
+    word-break: break-all;
   }
 
   h2 {
@@ -54,20 +55,28 @@ import Layout from "../layouts/Layout.astro";
     display: flex;
     flex-direction: column;
     width: max-content;
-    padding: 1rem;
   }
 
   .semester-links > a {
     color: white;
   }
 
   @media screen and (min-width: 768px) {
+    main {
+      padding: 1rem 1.25rem;
+    }
+
     h1 {
-      font-size: 4rem;
+      font-size: 3.75rem;
+      word-wrap: normal;
     }
 
     h2 {
       font-size: 2.5rem;
     }
+
+    .semester-links {
+      padding: 1rem;
+    }
   }
 </style>
diff --git a/src/pages/sp24.astro b/src/pages/sp24.astro
@@ -93,11 +93,11 @@ const contributors: MarkdownEntry[] = Object.values(
     }
 
     p > b.oss {
-      color: var(--color-oss-team);
+      color: rgb(var(--color-oss-team));
     }
 
     li > strong {
-      color: var(--color-link);
+      color: rgb(var(--color-link));
       font-weight: bold;
     }