Files

46 lines
1.2 KiB
Vue

<script setup lang="ts">
import '~/assets/css/reset.css';
import '~/assets/css/base.css';
import 'katex/dist/katex.min.css';
const { user } = useAuth();
const { accent, neutral, hinting, refresh: refreshSettings } = await useUserSettings();
watch(user, () => {
refreshSettings();
})
watchEffect(() => {
useHead({
htmlAttrs: {
style: `
--neutral-100: var(--palette-${neutral.value}-100);
--neutral-200: var(--palette-${neutral.value}-200);
--neutral-300: var(--palette-${neutral.value}-300);
--color-accent: var(--accent-${accent.value}, var(--accent-violet));
--color-accent-hover: var(--accent-${accent.value}-hover, var(--accent-violet-hover));
--accent-hinting: ${hinting.value}%;
--base-hinting: calc(100% - var(--accent-hinting));`,
},
});
});
if (import.meta.client) {
// Force Shiki into browser rendering only.
window.sessionStorage.setItem('mdc-shiki-highlighter', 'browser');
}
</script>
<template>
<NuxtLoadingIndicator />
<NuxtLayout>
<NuxtPage />
</NuxtLayout>
<NuxtRouteAnnouncer />
</template>
<style>
#__nuxt {
height: 100%;
display: flex;
}
</style>