style: change color

threefoldtech · Aug 14, 2024 · 503e737 · 503e737
1 parent a815066
commit 503e737
Show file tree

Hide file tree

Showing 7 changed files with 18 additions and 19 deletions.
diff --git a/frontend/public/theme.css b/frontend/public/theme.css
@@ -0,0 +1,3 @@
+.background-green {
+  background-color: #1aa18f !important;
+}
diff --git a/frontend/src/components/CreateFlist.vue b/frontend/src/components/CreateFlist.vue
@@ -4,12 +4,12 @@
     <v-main class="d-flex flex-column justify-center" height="90%">
       <v-container fluid>
         <v-row justify="center">
-          <v-col :cols="8">
+          <v-col cols="8">
             <h2 class="mb-2">Create a Flist:</h2>
           </v-col>
         </v-row>
         <v-row justify="center">
-          <v-col :cols="8">
+          <v-col cols="8">
             <label
               for="image-name"
               class="text-subtitle-1 text-medium-emphasis d-flex align-center"
@@ -192,7 +192,7 @@
             </div>
 
             <v-btn
-              class="pr-5 rounded-pill bg-purple-darken-1 mb-8"
+              class="pr-5 rounded-pill background-green mb-8"
               size="large"
               width="50%"
               @click="create"
@@ -215,6 +215,7 @@ import axios from "axios";
 import Footer from "./Footer.vue";
 import { toast } from "vue3-toastify";
 import "vue3-toastify/dist/index.css";
+import "../../public/theme.css";
 
 const privateReg = ref<boolean>(false);
 const registeryAddress = ref<boolean>(false);

diff --git a/frontend/src/components/FollowUp.vue b/frontend/src/components/FollowUp.vue
@@ -6,7 +6,7 @@
         <v-progress-circular
           :size="70"
           :width="7"
-          color="purple-darken-1"
+          color="#1aa18f"
           indeterminate
           class="mb-5"
         >

diff --git a/frontend/src/components/Home.vue b/frontend/src/components/Home.vue
@@ -37,7 +37,7 @@
             @click="username = userName"
           >
             <template v-slot:prepend>
-              <v-icon icon="mdi-account" color="purple-darken-1"></v-icon>
+              <v-icon icon="mdi-account" color="#1aa18f"></v-icon>
             </template>
             <v-list-item-title>
               {{ userName }}
@@ -51,7 +51,7 @@
         style="height: fit-content"
       >
         <h2 class="mb-2" v-if="username.length != 0">
-          <v-icon icon="mdi-account" color="purple-darken-1"></v-icon
+          <v-icon icon="mdi-account" color="#1aa18f"></v-icon
           >{{ username }}
         </h2>
         <!-- table containe flists -->

diff --git a/frontend/src/components/Login.vue b/frontend/src/components/Login.vue
@@ -1,13 +1,5 @@
 <template>
-  <v-container
-    fluid
-    style="
-      padding: 0px;
-      max-height: 100vh;
-      overflow-y: hidden;
-      overflow-x: hidden;
-    "
-  >
+  <v-container fluid class="overflow-hidden pa-0">
     <v-row>
       <v-col :cols="4" class="position-relative">
         <v-img :src="image" cover height="100%" style="z-index: 900"> </v-img>
@@ -71,7 +63,7 @@
               >
               </v-text-field>
               <v-btn
-                class="pr-5 rounded-pill bg-purple-darken-1"
+                class="pr-5 rounded-pill background-green"
                 size="large"
                 width="50%"
                 @click="login"
@@ -95,6 +87,7 @@ import { User } from "../types/User.ts";
 import axios from "axios";
 import { toast } from "vue3-toastify";
 import "vue3-toastify/dist/index.css";
+import "../../public/theme.css";
 
 const user = ref<User>({ username: "", password: "" });
 

diff --git a/frontend/src/components/Navbar.vue b/frontend/src/components/Navbar.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-app-bar class="bg-purple-darken-1">
+  <v-app-bar color="#1aa18f">
     <v-app-bar-nav-icon to="/" class="ml-8">
       <v-img :src="whiteLogo" contain height="50px" width="50px"></v-img>
     </v-app-bar-nav-icon>
@@ -9,7 +9,8 @@
     </div>
     <div class="mr-5" v-else>
       <v-btn to="/Create"
-        ><v-icon icon="mdi-plus-circle-outline" class="mr-2"></v-icon>Create flist</v-btn
+        ><v-icon icon="mdi-plus-circle-outline" class="mr-2"></v-icon>Create
+        flist</v-btn
       >
       <v-btn to="/Flists">My FLists</v-btn>
     </div>
@@ -18,5 +19,6 @@
 
 <script setup lang="ts">
 import whiteLogo from "../assets/logo_white.png";
+import "../../public/theme.css";
 const auth: string | null = sessionStorage.getItem("token");
 </script>
diff --git a/frontend/src/components/UserFlist.vue b/frontend/src/components/UserFlist.vue
@@ -4,7 +4,7 @@
     <v-main>
       <div>
         <h2 class="ml-5 mt-5">
-          <v-icon icon="mdi-account" color="purple-darken-1"></v-icon
+          <v-icon icon="mdi-account" color="#1aa18f"></v-icon
           >{{ loggedInUser }}
         </h2>
       </div>