1--- 2import { siteDescription, themeColor } from '../jev/site.mjs'; 3import { pwaInfo } from 'virtual:pwa-info'; 4import '../styles/index.css'; 5 6const { BASE_URL } = import.meta.env; 7const baseNoTrailing = BASE_URL.endsWith('/') ? BASE_URL.slice(0, -1) : BASE_URL; 8--- 9 10<!-- Global Metadata --> 11<meta charset="utf-8" /> 12<meta name="viewport" content="width=device-width" /> 13<meta name="generator" content={Astro.generator} /> 14 15<link rel="icon" type="image/svg+xml" href={`${baseNoTrailing}/favicon.ico`} /> 16 17<meta 18 name="description" 19 content={siteDescription} 20/> 21<link rel="icon" href={`${baseNoTrailing}/favicon.ico`} /> 22<link rel="apple-touch-icon" href={`${baseNoTrailing}/icons/apple-icon-180.png`} sizes="180x180" /> 23<meta name="theme-color" content={themeColor} /> 24 25<base href={BASE_URL} /> 26 27<!-- Scrollable accessibility code helper --> 28<script src={`${baseNoTrailing}/make-scrollable-code-focusable.js`} is:inline></script> 29 30<script src="/src/pwa.ts"></script> 31<!-- this does not work for some reason: --> 32<!-- <style is:global define:vars={strudelTheme}></style> --> 33<!-- the following variables are just a fallback to make sure everything is readable without JS --> 34<style is:global> 35 :root { 36 color-scheme: dark; 37 --background: #222; 38 --lineBackground: #22222299; 39 --foreground: #fff; 40 --caret: #ffcc00; 41 --selection: rgba(128, 203, 196, 0.5); 42 --selectionMatch: #036dd626; 43 --lineHighlight: #00000050; 44 --gutterBackground: transparent; 45 --gutterForeground: #8a919966; 46 } 47</style> 48{pwaInfo && <Fragment set:html={pwaInfo.webManifest.linkTag} />} 49 50<script> 51 // https://medium.com/quick-code/100vh-problem-with-ios-safari-92ab23c852a8 52 const appHeight = () => { 53 const doc = document.documentElement; 54 doc.style.setProperty('--app-height', `${window.innerHeight - 1}px`); 55 }; 56 if (typeof window !== 'undefined') { 57 window.addEventListener('resize', appHeight); 58 appHeight(); 59 } 60</script>