diff options
Diffstat (limited to 'components/base/Button.vue')
| -rw-r--r-- | components/base/Button.vue | 24 |
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; |
