feat: add noise to background gradient

1 files changed, 11 insertions, 10 deletions

diff --git a/css/default.scss b/css/default.scss
index fff60ed..d63769d 100644
--- a/css/default.scss
+++ b/css/default.scss
@@ -22,12 +22,11 @@ body {
   align-items: center;
   $opacity: 25%;
   background-color: black;
-  background: $background-color
-    linear-gradient(
-      135deg,
+  background-image:
+    url("/images/noise.png"),
+    linear-gradient(135deg,
       oklch(from $primary-color l c h / $opacity),
-      oklch(from $secondary-color l c h / $opacity) 100%
-    );
+      oklch(from $secondary-color l c h / $opacity) 100%);
   color: white;
   color: $foreground-color;
   padding: 4rem 0 0 0;
@@ -41,31 +40,33 @@ content {
   max-width: 60rem;
   flex-direction: row-reverse;
 
-  & > * {
+  &>* {
     background-color: $background-color;
     outline: 0.1rem solid $background-color;
     outline-offset: 0.1rem;
   }
 
-  & > nav {
+  &>nav {
     padding: 1.25rem 0.75rem;
   }
 
-  & > article {
+  &>article {
     width: 100vw;
     padding: 1.25rem;
+    height: fit-content;
   }
 }
 
 footer {
   position: fixed;
   bottom: 0px;
-  color: $background-color;
   opacity: 0.7;
   font-size: 0.75rem;
   padding: 0.5rem;
   width: 100%;
   text-align: right;
+  color: white;
+  mix-blend-mode: overlay;
 
   p {
     padding: 0;
@@ -145,4 +146,4 @@ ul {
       opacity: 0.75;
     }
   }
-}
+}
\ No newline at end of file