eightequal/AstralRinth
1
0
Fork 0
forked from didirus/AstralRinth
Code Pull Requests Activity

Large and outlined buttons (#69)

Browse Source
This commit is contained in:
Prospector
2023-06-20 09:05:26 -07:00
committed by GitHub
parent 61e00f1620
commit 6de1fa0878
3 changed files with 41 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
lib/components/base/Button.vue
View File

@@ -24,6 +24,14 @@ const props = defineProps({
type: Boolean,
default: false,
},
large: {
type: Boolean,
default: false,
},
outline: {
type: Boolean,
default: false,
},
})
const accentedButton = computed(() => ['danger', 'primary'].includes(props.color))
@@ -35,11 +43,13 @@ const accentedButton = computed(() => ['danger', 'primary'].includes(props.color
class="btn"
:class="{
'icon-only': props.iconOnly,
'btn-large': props.large,
'btn-raised': color === 'raised',
'btn-danger': color === 'danger',
'btn-primary': color === 'primary',
'btn-secondary': color === 'secondary',
'btn-highlight': color === 'highlight',
'btn-outline': props.outline,
'color-accent-contrast': accentedButton,
}"
:to="link"
@@ -54,11 +64,13 @@ const accentedButton = computed(() => ['danger', 'primary'].includes(props.color
class="btn"
:class="{
'icon-only': props.iconOnly,
'btn-large': props.large,
'btn-raised': color === 'raised',
'btn-danger': color === 'danger',
'btn-primary': color === 'primary',
'btn-secondary': color === 'secondary',
'btn-highlight': color === 'highlight',
'btn-outline': props.outline,
'color-accent-contrast': accentedButton,
}"
@click="action"