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

Revamped main layout

Browse Source
This commit is contained in:
Alexis
2024-08-29 17:41:58 +02:00
parent 386b714f3c
commit 67aefb8bd9
7 changed files with 136 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
components/global/user/CTA.vue
View File

@@ -1,10 +1,10 @@
<script lang="ts" setup>
import { computed } from "vue"
import { PhGear, PhGlobeHemisphereWest, PhLaptop, PhMoon, PhPalette, PhSignOut, PhSun, PhTranslate, PhUserCircle } from "@phosphor-icons/vue"
import { PhCheckCircle, PhGear, PhGlobeHemisphereWest, PhLaptop, PhMoon, PhPalette, PhSignOut, PhSun, PhTranslate, PhUserCircle } from "@phosphor-icons/vue"
import { cn } from "~/lib/utils";
const router = useRouter()
const { preference } = useColorMode()
const { auth } = useSupabaseClient()
const user = useSupabaseUser()
@@ -84,23 +84,38 @@ function pushRoute(to: AvailableRoutes) {
<UiDropdownMenuSub>
<UiDropdownMenuSubTrigger class="p-0">
<UiDropdownMenuItem class="flex gap-[.5ch] items-center rounded-none">
<UiDropdownMenuItem class="flex gap-[.5ch] items-center rounded-none pointer-events-none">
<PhPalette size="20" weight="fill" />
<span>Apparence</span>
</UiDropdownMenuItem>
</UiDropdownMenuSubTrigger>
<UiDropdownMenuPortal>
<UiDropdownMenuSubContent>
<UiDropdownMenuItem class="flex gap-[.5ch] items-center rounded-none" @click="$colorMode.preference = 'dark'">
<PhMoon size="20" />
<UiDropdownMenuItem
class="flex gap-[.5ch] items-center rounded-none"
:class="cn({ 'text-emerald-600': $colorMode.preference === 'dark' })"
@select.prevent="$colorMode.preference = 'dark'"
>
<PhCheckCircle v-if="$colorMode.preference === 'dark'" size="20" weight="fill" />
<PhMoon v-else size="20" />
<span>Sombre</span>
</UiDropdownMenuItem>
<UiDropdownMenuItem class="flex gap-[.5ch] items-center rounded-none" @click="$colorMode.preference = 'light'">
<PhSun size="20" />
<UiDropdownMenuItem
class="flex gap-[.5ch] items-center rounded-none"
:class="cn({ 'text-emerald-600': $colorMode.preference === 'light' })"
@select.prevent="$colorMode.preference = 'light'"
>
<PhCheckCircle v-if="$colorMode.preference === 'light'" size="20" weight="fill" />
<PhSun v-else size="20" />
<span>Clair</span>
</UiDropdownMenuItem>
<UiDropdownMenuItem class="flex gap-[.5ch] items-center rounded-none" @click="$colorMode.preference = 'system'">
<PhLaptop size="20" />
<UiDropdownMenuItem
class="flex gap-[.5ch] items-center rounded-none"
:class="cn({ 'text-emerald-600': $colorMode.preference === 'system' })"
@select.prevent="$colorMode.preference = 'system'"
>
<PhCheckCircle v-if="$colorMode.preference === 'system'" size="20" weight="fill" />
<PhLaptop v-else size="20" />
<span>Système</span>
</UiDropdownMenuItem>
</UiDropdownMenuSubContent>
@@ -109,7 +124,7 @@ function pushRoute(to: AvailableRoutes) {
<UiDropdownMenuSub>
<UiDropdownMenuSubTrigger class="p-0">
<UiDropdownMenuItem class="flex gap-[.5ch] items-center rounded-none">
<UiDropdownMenuItem class="flex gap-[.5ch] items-center rounded-none pointer-events-none">
<PhTranslate size="20" />
<span>Langage</span>
</UiDropdownMenuItem>