Garmelon/gedaechtnas
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Make CNoteButton disable-able

Browse source
This commit is contained in:
Joscha 2025-02-11 19:47:00 +01:00
parent 4b6732ccd0
commit 369839912f
1 changed files with 17 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

24
gdn-app/src/components/CNoteButton.vue
View file

@ -1,19 +1,29 @@
<script setup lang="ts"> <script setup lang="ts">
const { visible, inverted = false } = defineProps<{ const {
visible: boolean; visible = true,
inverted = false,
disabled = false,
} = defineProps<{
visible?: boolean;
inverted?: boolean; inverted?: boolean;
disabled?: boolean;
}>(); }>();
</script> </script>
<template> <template>
<div <button
class="flex select-none items-center rounded-sm border p-0.5 transition hover:bg-neutral-200 active:scale-95" class="flex select-none items-center rounded-sm border border-black p-0.5 transition"
:class="{ :class="{
'bg-white text-black': !inverted, 'bg-white text-black': !inverted,
'border-black bg-black text-white hover:bg-neutral-600': inverted, 'bg-black text-white': inverted,
hidden: !visible, 'hover:bg-neutral-200': !disabled && !inverted,
'hover:bg-neutral-600': !disabled && inverted,
'active:scale-95': !disabled,
'opacity-40': disabled,
invisible: !visible,
}" }"
:disabled
> >
<slot></slot> <slot></slot>
</div> </button>
</template> </template>