CloudToys/elk
1
0
Fork 0
Code

feat: add web manifest dark theme variants (#947)

Browse Source
This commit is contained in:
Joaquín Sánchez 2023-01-10 21:35:34 +01:00 committed by GitHub
parent 6e7813020e
commit 1b9fb99032
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 39 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
composables/setups.ts
View File

@ -3,6 +3,7 @@ import type { LocaleObject } from '#i18n'
export function setupPageHeader() {
const { locale, locales, t } = useI18n()
const colorMode = useColorMode()
const buildInfo = useBuildInfo()
const localeMap = (locales.value as LocaleObject[]).reduce((acc, l) => {
@ -26,7 +27,7 @@ export function setupPageHeader() {
? () => [{
key: 'webmanifest',
rel: 'manifest',
href: `/manifest-${locale.value}.webmanifest`,
href: `/manifest-${locale.value}${colorMode.value === 'dark' ? '-dark' : ''}.webmanifest`,
}]
: [],
})

25
modules/pwa/i18n.ts
View File

@ -74,6 +74,31 @@ export const createI18n = async (): Promise<LocalizedWebManifest> => {
},
],
}
acc[`${lang}-dark`] = {
scope: '/',
id: '/',
start_url: '/',
display: 'standalone',
lang,
name,
short_name,
description,
dir,
background_color: '#111111',
theme_color: '#111111',
icons: [
{
src: 'pwa-192x192.png',
sizes: '192x192',
type: 'image/png',
},
{
src: 'pwa-512x512.png',
sizes: '512x512',
type: 'image/png',
},
],
}
return acc
}, {} as LocalizedWebManifest)

19
modules/pwa/index.ts
View File

@ -41,10 +41,10 @@ export default defineNuxtModule<VitePWANuxtOptions>({
throw new Error('Remove vite-plugin-pwa plugin from Vite Plugins entry in Nuxt config file!')
webmanifests = await createI18n()
const generateManifest = (locale: string) => {
const manifest = webmanifests![locale]
const generateManifest = (entry: string) => {
const manifest = webmanifests![entry]
if (!manifest)
throw new Error(`No webmanifest found for locale ${locale}`)
throw new Error(`No webmanifest found for locale/theme ${entry}`)
return JSON.stringify(manifest)
}
viteInlineConfig.plugins.push({
@ -54,12 +54,12 @@ export default defineNuxtModule<VitePWANuxtOptions>({
if (options.disable || !bundle)
return
Object.keys(webmanifests!).map(l => [l, `manifest-${l}.webmanifest`]).forEach(([l, fileName]) => {
Object.keys(webmanifests!).map(wm => [wm, `manifest-${wm}.webmanifest`]).forEach(([wm, fileName]) => {
bundle[fileName] = {
isAsset: true,
type: 'asset',
name: undefined,
source: generateManifest(l),
source: generateManifest(wm),
fileName,
}
})
@ -107,9 +107,9 @@ export default defineNuxtModule<VitePWANuxtOptions>({
viteServer.middlewares.stack.push({ route: webManifest, handle: emptyHandle })
if (webmanifests) {
Object.keys(webmanifests).forEach((locale) => {
Object.keys(webmanifests).forEach((wm) => {
viteServer.middlewares.stack.push({
route: `${nuxt.options.app.baseURL}manifest-${locale}.webmanifest`,
route: `${nuxt.options.app.baseURL}manifest-${wm}.webmanifest`,
handle: emptyHandle,
})
})
@ -138,6 +138,11 @@ export default defineNuxtModule<VitePWANuxtOptions>({
'Content-Type': 'application/manifest+json',
},
}
nitroConfig.routeRules![`/manifest-${locale.code}-dark.webmanifest`] = {
headers: {
'Content-Type': 'application/manifest+json',
},
}
}
})
nuxt.hook('nitro:init', (nitro) => {