Joururi/leim-tools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added color square to event creation forms

Browse Source
This commit is contained in:
Alexis
2025-04-18 18:03:55 +02:00
parent 5bd76495f4
commit 5370a9df06
1 changed files with 13 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
components/calendar/input/EventCategory.vue
View File

@@ -1,5 +1,6 @@
<script lang="ts" setup> <script lang="ts" setup>
import { PhCaretDown } from "@phosphor-icons/vue"; import { PhCaretDown } from "@phosphor-icons/vue";
import { cn } from "~/lib/utils";
import type { Category } from "~/models/Category"; import type { Category } from "~/models/Category";
const isPopoverOpen = ref<boolean>(false) const isPopoverOpen = ref<boolean>(false)
@@ -39,7 +40,12 @@ const filteredCategories = computed(() =>
{{ props.placeholder }} {{ props.placeholder }}
</template> </template>
<template v-else> <template v-else>
{{ model.name }} <span
class="bgc"
:class="cn(`element-${model.color}`)"
>
{{ capitalize(model.name) }}
</span>
</template> </template>
<PhCaretDown class="ml-2 size-4 shrink-0 opacity-50" /> <PhCaretDown class="ml-2 size-4 shrink-0 opacity-50" />
@@ -63,7 +69,12 @@ const filteredCategories = computed(() =>
class="cursor-pointer" class="cursor-pointer"
@select="handleCatSelect" @select="handleCatSelect"
> >
{{ category.name }} <span
class="bgc"
:class="cn(`element-${category.color}`)"
>
{{ capitalize(category.name) }}
</span>
</UiCommandItem> </UiCommandItem>
</UiCommandGroup> </UiCommandGroup>
</UiCommandList> </UiCommandList>