mirror of
https://github.com/eliasstepanik/strudel.git
synced 2026-01-11 13:48:40 +00:00
64 lines
2.1 KiB
Plaintext
64 lines
2.1 KiB
Plaintext
---
|
|
// @ts-ignore
|
|
import { pwaInfo } from 'virtual:pwa-info';
|
|
import '../styles/index.css';
|
|
|
|
const { BASE_URL } = import.meta.env;
|
|
const baseNoTrailing = BASE_URL.endsWith('/') ? BASE_URL.slice(0, -1) : BASE_URL;
|
|
---
|
|
|
|
<!-- Global Metadata -->
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width" />
|
|
<meta name="generator" content={Astro.generator} />
|
|
<link rel="alternate" type="application/rss+xml" title={`RSS Feed for strudel.cc`} href="/rss.xml" />
|
|
<link rel="icon" type="image/svg+xml" href={`${baseNoTrailing}/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={`${baseNoTrailing}/favicon.ico`} />
|
|
<link rel="apple-touch-icon" href={`${baseNoTrailing}/icons/apple-icon-180.png`} sizes="180x180" />
|
|
<meta name="theme-color" content="#222222" />
|
|
|
|
<base href={BASE_URL} />
|
|
|
|
<!-- Scrollable a11y code helper -->
|
|
<script {`${baseNoTrailing}/make-scrollable-code-focusable.js`} is:inline></script>
|
|
|
|
<script src="/src/pwa.ts"></script>
|
|
<!-- this does not work for some reason: -->
|
|
<!-- <style is:global define:vars={strudelTheme}></style> -->
|
|
<!-- the following variables are just a fallback to make sure everything is readable without JS -->
|
|
<style is:global>
|
|
:root {
|
|
--background: #222;
|
|
--lineBackground: #22222299;
|
|
--foreground: #fff;
|
|
--caret: #ffcc00;
|
|
--selection: rgba(128, 203, 196, 0.5);
|
|
--selectionMatch: #036dd626;
|
|
--lineHighlight: #00000050;
|
|
--gutterBackground: transparent;
|
|
--gutterForeground: #8a919966;
|
|
}
|
|
</style>
|
|
{pwaInfo && <Fragment set:html={pwaInfo.webManifest.linkTag} />}
|
|
|
|
<script>
|
|
import { initTheme, codemirrorSettings } from '@strudel/codemirror';
|
|
|
|
initTheme(codemirrorSettings.get().theme);
|
|
|
|
// https://medium.com/quick-code/100vh-problem-with-ios-safari-92ab23c852a8
|
|
const appHeight = () => {
|
|
const doc = document.documentElement;
|
|
doc.style.setProperty('--app-height', `${window.innerHeight - 1}px`);
|
|
};
|
|
if (typeof window !== 'undefined') {
|
|
window.addEventListener('resize', appHeight);
|
|
appHeight();
|
|
}
|
|
</script>
|