color fixes

SELab-2 · Mar 10, 2024 · 909c031 · 909c031
1 parent 6015ba9
commit 909c031
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 11 deletions.
diff --git a/frontend/src/assets/base.scss b/frontend/src/assets/base.scss
@@ -6,6 +6,8 @@
     --color-primary-dark: color-mod(var(--color-primary) shade(15%));
     --color-primary-bg: color-mod(var(--color-primary) alpha(30));
 
+
+
     --color-accent: #ffd200;
     --color-accent-light: color-mod(var(--color-accent) tint(15%));
     --color-accent-dark: color-mod(var(--color-accent) shade(15%));
@@ -16,6 +18,7 @@
     --gray-8: #282828;
     --gray-6: #444444;
     --gray-4: #666666;
+    --gray-3: #B0B0B0;
     --gray-2: #f2f2f2;
     --gray-0: #f8f8f8;
     --white: #ffffff;

diff --git a/frontend/src/views/LoginView.vue b/frontend/src/views/LoginView.vue
@@ -25,12 +25,8 @@ import { useCASUrl } from "@/stores/cas-url";
 
 <style scoped>
 .login {
-    /* position: fixed; */
-    /* top: 50%; */
-    /* left: 0; */
     width: 100%;
     height: 100vh;
-    /* height: 75vh; */
     background-color: var(--color-primary);
     /* transform: translateY(-50%); */
     justify-content: center;
@@ -40,7 +36,7 @@ import { useCASUrl } from "@/stores/cas-url";
 }
 
 .logo {
-    margin-top: 30px;
+    margin-top: 125px;
 }
 
 .login h1,
@@ -57,9 +53,8 @@ import { useCASUrl } from "@/stores/cas-url";
 }
 
 .login-button {
-    background-color: var(--color-accent);
-    color: var(--color-text-on-accent);
-    font-weight: bold;
+    background-color: var(--gray-4);
+    color: var(--white);
     border: 2px solid var(--color-border);
     padding: 10px 20px;
     font-size: 16px;
@@ -71,8 +66,8 @@ import { useCASUrl } from "@/stores/cas-url";
 }
 
 .login-button:hover {
-    background-color: var(--tertiary-bg-color);
-    color: white;
+    background-color: var(--gray-3);
+    color: var(--white);
 }
 
 .ugent-logo {

diff --git a/frontend/src/views/UserView.vue b/frontend/src/views/UserView.vue
@@ -39,6 +39,7 @@ async function fetchUser() {
 }
 
 .logout h2 {
+    margin-top: 50px;
     margin-bottom: 30px;
 }
 
@@ -56,7 +57,7 @@ async function fetchUser() {
 }
 
 .logout-button:hover {
-    background-color: var(--color-error-secondary);
+    background-color: indianred;
     color: white;
 }
 </style>