新增 ledger.css 设计令牌与桌面端布局,AppRail 左导航、PageHead 桌面页头、ResultsColumn 常驻结果栏;做菜/菜谱/发现/我的/设置/帮助/关于各页做桌面窄屏双形态适配,窄屏仍走原有底部标签栏与弹层交互。
50 lines
960 B
Vue
50 lines
960 B
Vue
<script setup lang="ts">
|
|
// import { installPrompt } from './utils/pwa'
|
|
import { isClient } from '@vueuse/core'
|
|
import { useIndexedDB } from '~/composables/db'
|
|
import { appName } from '~/constants'
|
|
|
|
// https://nuxt.com/docs/api/composables/use-head
|
|
useHead({
|
|
title: appName,
|
|
meta: [
|
|
{
|
|
name: 'description',
|
|
content: '好的,今天我们来做菜!',
|
|
},
|
|
],
|
|
})
|
|
|
|
const indexedDB = useIndexedDB()
|
|
const { isDark, setDarkMode, setLightMode } = useDarkMode()
|
|
|
|
onMounted(() => {
|
|
// init dark mode
|
|
if (isClient) {
|
|
if (isDark.value) {
|
|
setDarkMode()
|
|
}
|
|
else {
|
|
setLightMode()
|
|
}
|
|
|
|
indexedDB.init()
|
|
}
|
|
|
|
// installPrompt()
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<!-- <VitePwaManifest /> -->
|
|
<!-- https://ionic.nuxtjs.org/cookbook/customising-app-vue -->
|
|
<!-- <NuxtLayout>
|
|
<NuxtLoadingIndicator />
|
|
<NuxtPage />
|
|
</NuxtLayout> -->
|
|
<ion-app>
|
|
<AppRail />
|
|
<ion-router-outlet />
|
|
</ion-app>
|
|
</template>
|