frontend with styling buttons

neuefische · Jun 4, 2024 · 35a37e7 · 35a37e7
1 parent 5290a63
commit 35a37e7
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/frontend/src/components/Button/Button.styled.ts b/frontend/src/components/Button/Button.styled.ts
@@ -5,17 +5,17 @@ export const StyledLink = styled(Link)`
     display: inline-block;
     padding: 10px 20px;
     color: white;
-    background-color: #6200ea;
+    background-color: var(--primary-color);
     text-decoration: none;    
     border: none;
     border-radius: 5px;
     cursor: pointer;
     
     &:hover {
-        background-color: #3700b3;
+        background-color: color-mix(in srgb, var(--primary-color) 80%, white);
     }
 
     &:active {
-        background-color: #03dac5;
+        background-color: color-mix(in srgb, var(--primary-color) 70%, black);
     }
 `;
diff --git a/frontend/src/index.css b/frontend/src/index.css
@@ -3,6 +3,8 @@
   --default-border-color: lightgrey;
   --default-border-radius: 15px;
   --header-height: 70px;
+  --primary-color: #6200ea;
+
 
 }