fix notification color

DecentralCardGame · Oct 4, 2024 · a00cf83 · a00cf83
1 parent e81a35e
commit a00cf83
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 4 deletions.
diff --git a/src/App.vue b/src/App.vue
@@ -61,6 +61,20 @@ export default {
 </script>
 
 <style lang="scss">
+.vue-notification {
+    // types (green, amber, red)
+  &.success {
+    color: #000000;
+    background: #4cbb17;
+    border-left-color: #006400;
+  }
+
+  &.error {
+    background: #d82027;
+    border-left-color: #800000;
+  }
+}
+
 @font-face {
   font-family: 'Museo900-Regular';
   font-weight: normal;

diff --git a/src/def-composables/useNotifications.ts b/src/def-composables/useNotifications.ts
@@ -24,7 +24,7 @@ const useNotificationsInstance = () => {
       group: "bottom-right-notification",
       title: title,
       text: text,
-      type: "notification--alert",
+      type: "error",
       duration: 5000
     });
   });
@@ -34,7 +34,7 @@ const useNotificationsInstance = () => {
       group: "bottom-right-notification",
       title: title,
       text: text,
-      type: "notification--success",
+      type: "success",
       duration: 5000
     });
   });
@@ -44,7 +44,7 @@ const useNotificationsInstance = () => {
       group: "bottom-right-notification",
       title: title,
       text: text,
-      type: "notification--info",
+      type: "info",
       duration: 5000
     });
   });

diff --git a/src/views/CardCreatorPage.vue b/src/views/CardCreatorPage.vue
@@ -739,7 +739,8 @@
               :model="model"
             />
           </div>
-          <div class="text-left flex flex-col">
+
+          <div class="text-left flex flex-col justify-between">
             <div class="py-5 flex flex-col items-start">
               <div class="pl-12 py-3 text-s font-bold">
                 SUMMARY