61 lines
1.7 KiB
Text
61 lines
1.7 KiB
Text
---
|
|
import { pwaInfo } from 'virtual:pwa-info';
|
|
import '../styles/index.css';
|
|
|
|
const { BASE_URL } = import.meta.env;
|
|
const base = BASE_URL;
|
|
---
|
|
|
|
<!-- Global Metadata -->
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width" />
|
|
<meta name="generator" content={Astro.generator} />
|
|
|
|
<link rel="icon" type="image/svg+xml" href="favicon.ico" />
|
|
|
|
<meta
|
|
name="description"
|
|
content="Strudel is a music live coding environment for the browser, porting the TidalCycles pattern language to JavaScript."
|
|
/>
|
|
<link rel="icon" href="/favicon.ico" />
|
|
<link rel="apple-touch-icon" href="/icons/apple-icon-180.png" sizes="180x180" />
|
|
<meta name="theme-color" content="#222222" />
|
|
|
|
<base href={base} />
|
|
|
|
<!-- Scrollable a11y code helper -->
|
|
<script src="./make-scrollable-code-focusable.js" is:inline></script>
|
|
|
|
<script src="/src/pwa.ts"></script>
|
|
{pwaInfo && <Fragment set:html={pwaInfo.webManifest.linkTag} />}
|
|
|
|
<script>
|
|
// const themeStyle = document.getElementById('theme');
|
|
const themeStyle = document.createElement('style');
|
|
themeStyle.id = 'strudel-theme';
|
|
document.head.append(themeStyle);
|
|
function setTheme(theme) {
|
|
const cssVariables = Object.entries(theme)
|
|
.map(([key, value]) => `--${key}: ${value};`)
|
|
.join('\n');
|
|
themeStyle.innerHTML = `:root {
|
|
${cssVariables}
|
|
}`;
|
|
}
|
|
// default theme
|
|
setTheme({
|
|
background: '#222',
|
|
foreground: '#FFFFFF',
|
|
caret: '#FFFFFF',
|
|
selection: '#49483E',
|
|
selectionMatch: '#49483E',
|
|
gutterBackground: '#272822',
|
|
gutterForeground: '#FFFFFF70',
|
|
lineHighlight: '#00000059',
|
|
});
|
|
document.addEventListener('strudel-theme', (e: any) => {
|
|
console.log('strudel theme', e.detail);
|
|
// TODO: persist theme
|
|
setTheme(e.detail);
|
|
});
|
|
</script>
|