Add variables for gradients

IFRCGo · Oct 15, 2024 · 894d00c · 894d00c
1 parent feccc5a
commit 894d00c
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 7 deletions.
diff --git a/.changeset/fluffy-months-film.md b/.changeset/fluffy-months-film.md
@@ -0,0 +1,5 @@
+---
+"go-web-app": patch
+---
+
+Add a new 404 page
diff --git a/app/src/views/FourHundredFour/styles.module.css b/app/src/views/FourHundredFour/styles.module.css
@@ -1,6 +1,13 @@
 .four-hundred-four {
     display: flex;
     flex-direction: column;
+    /* FIXME: To be moved to go-ui */
+    --four-hundred-four-heading-gradient: repeating-linear-gradient(
+        -50deg,
+        red 10px,
+        transparent,
+        transparent 20px
+    )
 
     .main-section-container {
         display: flex;
@@ -23,12 +30,7 @@
             gap: var(--go-ui-spacing-xs);
 
             .four-hundred-four-heading {
-                background: repeating-linear-gradient(
-                    -50deg,
-                    red 10px,
-                    transparent,
-                    transparent 20px
-                );
+                background: var(--four-hundred-four-heading-gradient);
                 background-clip: text;
                 color: transparent;
                 font-size: 8rem;
@@ -62,4 +64,4 @@
         top: 0;
         opacity: 0.1;
     }
-}
+}