Arsharth/hydrogen-web
1
0
Fork 0
forked from mystiq/hydrogen-web
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add default themes to index html

Browse source
This commit is contained in:
RMidhunSuresh 2022-03-28 18:02:53 +05:30
parent 1f6efb4db3
commit 32eb95734a
1 changed files with 45 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

48
scripts/build-plugins/rollup-plugin-build-themes.js
View file

@ -27,7 +27,7 @@ async function appendVariablesToCSS(variables, cssSource) {
}
module.exports = function buildThemes(options) {
let manifest, variants;
let manifest, variants, defaultDark, defaultLight;
return {
name: "build-themes",
@ -38,13 +38,23 @@ module.exports = function buildThemes(options) {
for (const location of manifestLocations) {
manifest = require(`${location}/manifest.json`);
variants = manifest.values.variants;
for (const [variant] of Object.entries(variants)) {
for (const [variant, details] of Object.entries(variants)) {
const themeName = manifest.name;
const fileName = `theme-${themeName}-${variant}.css`;
if (details.default) {
// This theme is the default for when Hydrogen launches for the first time
if (details.dark) {
defaultDark = fileName;
}
else {
defaultLight = fileName;
}
}
// emit the css as built theme bundle
this.emitFile({
type: "chunk",
id: `${location}/theme.css?variant=${variant}`,
fileName: `theme-${themeName}-${variant}.css`,
fileName,
});
}
}
@ -60,5 +70,37 @@ module.exports = function buildThemes(options) {
}
return null;
},
transformIndexHtml(_, ctx) {
let darkThemeLocation, lightThemeLocation;
for (const [, bundle] of Object.entries(ctx.bundle)) {
if (bundle.name === defaultDark) {
darkThemeLocation = bundle.fileName;
}
if (bundle.name === defaultLight) {
lightThemeLocation = bundle.fileName;
}
}
return [
{
tag: "link",
attrs: {
rel: "stylesheet",
type: "text/css",
media: "(prefers-color-scheme: dark)",
href: `./${darkThemeLocation}`,
}
},
{
tag: "link",
attrs: {
rel: "stylesheet",
type: "text/css",
media: "(prefers-color-scheme: light)",
href: `./${lightThemeLocation}`,
}
},
];
}
}
}