106 lines
3.9 KiB
HTML
106 lines
3.9 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<link rel="apple-touch-icon" sizes="180x180" href="%sveltekit.assets%/apple-touch-icon.png" />
|
|
<link rel="icon" type="image/png" sizes="32x32" href="%sveltekit.assets%/favicon-32x32.png" />
|
|
<link rel="icon" type="image/png" sizes="16x16" href="%sveltekit.assets%/favicon-16x16.png" />
|
|
<link rel="manifest" href="%sveltekit.assets%/site.webmanifest" />
|
|
<link rel="mask-icon" href="%sveltekit.assets%/safari-pinned-tab.svg" color="#2e0b78" />
|
|
<meta name="apple-mobile-web-app-title" content="Moshing Mammut" />
|
|
<meta name="application-name" content="Moshing Mammut" />
|
|
<meta name="msapplication-TileColor" content="#2e0b78" />
|
|
<meta
|
|
name="description"
|
|
content="A collection of music recommendations and now-listenings by the users of metalhead.club"
|
|
/>
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
|
<meta name="theme-color" content="#17063b" media="(prefers-color-scheme: dark)" />
|
|
<meta name="theme-color" content="#BCB9B2" media="(prefers-color-scheme: light)" />
|
|
<link rel="alternate" type="application/atom+xml" href="/feed.xml" title="Atom Feed" />
|
|
<link rel="hub" href="https://pubsubhubbub.superfeedr.com" />
|
|
%sveltekit.head%
|
|
<style>
|
|
body {
|
|
--color-blue: hsl(259, 82%, 26%);
|
|
--color-blue-dark: hsl(259, 82%, 13%);
|
|
--color-lavender: hsl(253, 82%, 33%);
|
|
--color-mauve: hsl(273, 82%, 38%);
|
|
|
|
--color-grey: hsl(44, 7%, 41%);
|
|
--color-grey-translucent: hsla(44, 7%, 41%, 0.2);
|
|
--color-grey-light: hsl(0, 0%, 98%);
|
|
|
|
--color-red: hsl(7, 100%, 56%);
|
|
--color-red-light: hsl(7, 100%, 61%);
|
|
--color-red-lighter: hsl(7, 100%, 68%);
|
|
--color-red-dark: hsl(7, 100%, 48%);
|
|
--color-red-desat: hsl(7, 20%, 56%);
|
|
--color-red-desat-dark: hsl(7, 20%, 30%);
|
|
--color-red-desat-desat: hsl(7, 8%, 56%);
|
|
|
|
--color-text: var(--color-blue-dark);
|
|
--color-border: var(--color-grey);
|
|
--color-link: var(--color-mauve);
|
|
--color-link-visited: var(--color-lavender);
|
|
--color-bg: var(--color-grey-light);
|
|
--color-bg-translucent: hsla(42, 7%, 72%, 0.5);
|
|
--color-button: var(--color-red-light);
|
|
--color-button-shadow: var(--color-red-desat-dark);
|
|
--color-button-hover: var(--color-red);
|
|
--color-button-deactivated: var(--color-red-desat-desat);
|
|
--color-button-text: var(--color-blue-dark);
|
|
|
|
color: var(--color-text);
|
|
background-color: var(--color-bg);
|
|
font-family:
|
|
system-ui,
|
|
-apple-system,
|
|
BlinkMacSystemFont,
|
|
'Segoe UI',
|
|
Roboto,
|
|
Oxygen-Sans,
|
|
Ubuntu,
|
|
Cantarell,
|
|
'Helvetica Neue',
|
|
Helvetica,
|
|
Arial,
|
|
sans-serif,
|
|
'Apple Color Emoji',
|
|
'Segoe UI Emoji',
|
|
'Segoe UI Symbol';
|
|
}
|
|
|
|
a {
|
|
color: var(--color-link);
|
|
}
|
|
a:visited {
|
|
color: var(--color-link-visited);
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
body {
|
|
--color-lavender: hsl(273, 43%, 65%);
|
|
--color-mauve: hsl(286, 73%, 81%);
|
|
|
|
--color-text: var(--color-grey-light);
|
|
--color-border: var(--color-grey-light);
|
|
--color-link: var(--color-lavender);
|
|
--color-link-visited: var(--color-mauve);
|
|
--color-bg: var(--color-blue-dark);
|
|
--color-bg-translucent: hsla(259, 82%, 26%, 0.5);
|
|
--color-button: var(--color-red-light);
|
|
--color-button-shadow: var(--color-red-desat);
|
|
--color-button-hover: var(--color-red);
|
|
--color-button-deactivated: var(--color-red-desat-desat);
|
|
--color-button-text: var(--color-blue-dark);
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body data-sveltekit-preload-data="hover">
|
|
<div style="display: contents">%sveltekit.body%</div>
|
|
</body>
|
|
</html>
|