Added ui card to add worlds / calendars
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<script lang="ts" setup>
|
||||
import { PhPencil, PhPlus, PhTrash } from "@phosphor-icons/vue";
|
||||
import { PhPencil, PhTrash } from "@phosphor-icons/vue";
|
||||
import type { RealtimeChannel } from "@supabase/supabase-js"
|
||||
import type { World } from "~/models/World";
|
||||
|
||||
@@ -129,21 +129,6 @@ function hideEditModal() {
|
||||
<Heading level="h2">
|
||||
{{ $t('entity.world.namePlural') }}
|
||||
</Heading>
|
||||
|
||||
<UiTooltipProvider :delay-duration="250">
|
||||
<UiTooltip>
|
||||
<UiTooltipTrigger as-child>
|
||||
<UiButton size="icon" class="rounded-full h-8 w-8" @click="() => isCreateWorldModalOpen = true">
|
||||
<PhPlus size="17"/>
|
||||
</UiButton>
|
||||
</UiTooltipTrigger>
|
||||
<UiTooltipContent :side-offset="10">
|
||||
<p>
|
||||
{{ $t('entity.world.addSingle') }}
|
||||
</p>
|
||||
</UiTooltipContent>
|
||||
</UiTooltip>
|
||||
</UiTooltipProvider>
|
||||
</div>
|
||||
|
||||
<ul v-if="worlds?.data" class="grid lg:grid-cols-3 gap-2">
|
||||
@@ -192,6 +177,11 @@ function hideEditModal() {
|
||||
</UiCardContent>
|
||||
</UiCard>
|
||||
</li>
|
||||
<li class="w-fit">
|
||||
<AddCard @on-click="() => isCreateWorldModalOpen = true">
|
||||
{{ $t('entity.world.addSingle') }}
|
||||
</AddCard>
|
||||
</li>
|
||||
</ul>
|
||||
</Spacing>
|
||||
</section>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
import type { RealtimeChannel } from "@supabase/supabase-js"
|
||||
import type { World } from "~/models/World";
|
||||
import type { Calendar } from "~/models/CalendarConfig";
|
||||
import { PhArrowBendDoubleUpLeft, PhGlobeHemisphereWest, PhPencil, PhPlus, PhTrash } from "@phosphor-icons/vue";
|
||||
import { PhArrowBendDoubleUpLeft, PhGlobeHemisphereWest, PhPencil, PhTrash } from "@phosphor-icons/vue";
|
||||
|
||||
const supabase = useSupabaseClient()
|
||||
const route = useRoute()
|
||||
@@ -166,9 +166,9 @@ function hideEditModal() {
|
||||
<PhPencil size="17" weight="fill" />
|
||||
</UiButton>
|
||||
</UiTooltipTrigger>
|
||||
<UiTooltipContent :side-offset="10">
|
||||
<UiTooltipContent :side-offset="12" side="right">
|
||||
<p>
|
||||
{{ $t('entity.calendar.addSingle') }}
|
||||
{{ $t('entity.world.editSingle') }}
|
||||
</p>
|
||||
</UiTooltipContent>
|
||||
</UiTooltip>
|
||||
@@ -185,21 +185,6 @@ function hideEditModal() {
|
||||
<Heading level="h2">
|
||||
{{ $t('entity.calendar.namePlural') }}
|
||||
</Heading>
|
||||
|
||||
<UiTooltipProvider :delay-duration="250">
|
||||
<UiTooltip>
|
||||
<UiTooltipTrigger as-child>
|
||||
<UiButton size="icon" class="rounded-full h-8 w-8" @click="() => isCreateCalendarModalOpen = true">
|
||||
<PhPlus size="17"/>
|
||||
</UiButton>
|
||||
</UiTooltipTrigger>
|
||||
<UiTooltipContent :side-offset="10">
|
||||
<p>
|
||||
{{ $t('entity.calendar.addSingle') }}
|
||||
</p>
|
||||
</UiTooltipContent>
|
||||
</UiTooltip>
|
||||
</UiTooltipProvider>
|
||||
</div>
|
||||
|
||||
<ul v-if="world.data.calendars && world.data.calendars?.length > 0" class="grid md:grid-cols-3 gap-2">
|
||||
@@ -221,6 +206,11 @@ function hideEditModal() {
|
||||
</UiCardContent>
|
||||
</UiCard>
|
||||
</li>
|
||||
<li class="w-fit">
|
||||
<AddCard @on-click="() => isCreateCalendarModalOpen = true">
|
||||
{{ $t('entity.calendar.addSingle') }}
|
||||
</AddCard>
|
||||
</li>
|
||||
</ul>
|
||||
<template v-else>
|
||||
<p class="pl-6 opacity-75 italic">
|
||||
|
||||
Reference in New Issue
Block a user