aboutsummaryrefslogtreecommitdiffstats
path: root/components/base
diff options
context:
space:
mode:
Diffstat (limited to 'components/base')
-rw-r--r--components/base/Button.vue24
1 files changed, 23 insertions, 1 deletions
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;