From ba28c0148cab26fcaf523e84731ffb7c416b3338 Mon Sep 17 00:00:00 2001
From: Leonardo Bishop <me@leonardobishop.com>
Date: Wed, 13 Mar 2024 17:35:05 +0000
Subject: Add import page

---
 components/base/Button.vue | 24 +++++++++++++++++++++++-
 1 file changed, 23 insertions(+), 1 deletion(-)

(limited to 'components/base/Button.vue')

diff --git a/components/base/Button.vue b/components/base/Button.vue
index c7f7c50..827e201 100644
--- a/components/base/Button.vue
+++ b/components/base/Button.vue
@@ -5,6 +5,11 @@ const props = defineProps({
     required: false,
     default: 'text',
   },
+  accent: {
+    type: String,
+    required: false,
+    default: 'normal',
+  },
   label: String,
   icon: Array<String>,
   disabled: Boolean,
@@ -20,7 +25,8 @@ const onClick = (event: MouseEvent) => {
 </script>
 
 <template>
-  <a id="button" :class="{ text: type === 'text', solid: type === 'solid', disabled: disabled }" @click.stop="onClick">
+  <a id="button" :class="{ text: type === 'text', solid: type === 'solid', disabled: disabled, [accent]: true }"
+    @click.stop="onClick">
     <font-awesome-icon :icon="icon" />
     {{ label }}
   </a>
@@ -55,6 +61,22 @@ const onClick = (event: MouseEvent) => {
   }
 }
 
+.text.danger {
+  color: var(--color-false);
+
+  &:hover {
+    color: var(--color-false-hover)
+  }
+}
+
+.solid.danger {
+  background-color: var(--color-false);
+
+  &:hover {
+    background-color: var(--color-false-hover);
+  }
+}
+
 .solid {
   background-color: var(--color-primary);
   transition: background-color 0.3s;
-- 
cgit v1.2.3-70-g09d2