107 lines
3.0 KiB
Vue
107 lines
3.0 KiB
Vue
<template>
|
|
<header class="hstack justify-between pl-4 pr-1">
|
|
<nuxt-link class="hstack gap-x-2" :to="$nuxt.$localePath('/')">
|
|
<SharedLogo text-base />
|
|
<div text-lg><SharedBrandName /></div>
|
|
</nuxt-link>
|
|
|
|
<div class="hstack">
|
|
<UiButton
|
|
:as="NuxtLink"
|
|
:to="$nuxt.$localePath('/dashboard')"
|
|
variant="ghost-secondary"
|
|
size="xs"
|
|
class="h-8 gap-x-1"
|
|
:aria-label="$t('dashboard.my_resumes')"
|
|
>
|
|
<span class="i-ep:menu text-lg" />
|
|
<span class="hide-on-mobile text-base">
|
|
{{ $t("dashboard.my_resumes") }}
|
|
</span>
|
|
</UiButton>
|
|
|
|
<UiDropdownMenu>
|
|
<UiDropdownMenuTrigger as-child>
|
|
<UiButton
|
|
variant="ghost-secondary"
|
|
size="xs"
|
|
class="h-8 gap-x-1"
|
|
:aria-label="`Switch the language from: ${localeName}`"
|
|
>
|
|
<span class="i-ic:round-translate text-lg" />
|
|
<span class="hide-on-mobile text-base">
|
|
{{ localeName }}
|
|
</span>
|
|
</UiButton>
|
|
</UiDropdownMenuTrigger>
|
|
<UiDropdownMenuContent class="min-w-28" align="start" :side-offset="0">
|
|
<UiDropdownMenuItem
|
|
v-for="item in availableLocales"
|
|
:key="item.code"
|
|
:as="NuxtLink"
|
|
:to="switchLocalePath(item.code)"
|
|
>
|
|
<span v-if="item.icon" :class="[item.icon, 'text-base mr-1.5']" />
|
|
{{ item.name }}
|
|
</UiDropdownMenuItem>
|
|
</UiDropdownMenuContent>
|
|
</UiDropdownMenu>
|
|
|
|
<slot name="tail" />
|
|
|
|
<UiButton
|
|
as="a"
|
|
variant="ghost-secondary"
|
|
size="xs"
|
|
class="h-8 gap-x-1"
|
|
href="/"
|
|
aria-label="Open Signal AI resume workspace"
|
|
>
|
|
<span class="i-material-symbols:auto-awesome text-lg" />
|
|
<span class="hide-on-mobile text-base">Signal AI</span>
|
|
</UiButton>
|
|
|
|
<SharedToggleDark />
|
|
|
|
<form action="/logout" method="post">
|
|
<UiButton
|
|
type="submit"
|
|
variant="ghost-secondary"
|
|
size="xs"
|
|
class="h-8 gap-x-1"
|
|
aria-label="Sign out of Signal"
|
|
>
|
|
<span class="i-material-symbols:logout text-lg" />
|
|
<span class="hide-on-mobile text-base">Sign out</span>
|
|
</UiButton>
|
|
</form>
|
|
|
|
<UiButton
|
|
as="a"
|
|
variant="ghost-secondary"
|
|
size="round"
|
|
href="http://github.com/Renovamen/oh-my-cv"
|
|
target="_blank"
|
|
rel="nofollow noopener"
|
|
>
|
|
<span i-tabler:brand-github text-lg />
|
|
</UiButton>
|
|
</div>
|
|
</header>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { NuxtLink } from "#components";
|
|
|
|
const switchLocalePath = useSwitchLocalePath();
|
|
const { locale, locales } = useI18n();
|
|
|
|
const availableLocales = computed(() =>
|
|
locales.value.filter((i) => i.code !== locale.value)
|
|
);
|
|
|
|
const localeName = computed(
|
|
() => locales.value.find((i) => i.code === locale.value)?.name || ""
|
|
);
|
|
</script>
|