129 lines
3.0 KiB
Svelte
129 lines
3.0 KiB
Svelte
<script lang="ts">
|
|
interface Props {
|
|
data: {};
|
|
children: any;
|
|
}
|
|
let { data, children }: Props = $props();
|
|
// $inspect("l",data);
|
|
</script>
|
|
|
|
<nav>
|
|
<a href="/">Sludge</a>
|
|
<a href="/fest">Fest</a>
|
|
<a href="/pork">Pork</a>
|
|
<a href="/blag">Blag</a>
|
|
</nav>
|
|
|
|
<main>
|
|
{@render children()}
|
|
</main>
|
|
|
|
<style lang="scss">
|
|
@use '/src/app.scss' as *;
|
|
:global(body) {
|
|
background-color: $green-42;
|
|
// '3px-tile.png',
|
|
// 'arabesque.png',
|
|
// 'beige-paper.png',
|
|
// 'binding-dark.png',
|
|
// '45-degree-fabric-light.png'
|
|
|
|
background-image: url('/patterns/arabesque.png');
|
|
background-attachment: fixed;
|
|
}
|
|
nav{
|
|
padding: 0 20%;
|
|
display: flex;
|
|
gap: 1rem;
|
|
justify-content: flex-end;
|
|
text-shadow: 3px 3px 3px $green;
|
|
a{
|
|
font-weight: 700;
|
|
text-decoration: none;
|
|
&:first-child{
|
|
margin-right: auto;
|
|
}
|
|
&:hover{
|
|
color: $orange;
|
|
}
|
|
}
|
|
}
|
|
|
|
main {
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
|
|
|
|
:global(html, body, div, span, object, iframe, figure, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, code, em, img, small, strike, strong, sub, sup, tt, b, u, i, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td, main, canvas, embed, footer, header, nav, section, video){
|
|
margin: 0;
|
|
padding: 0;
|
|
border: 0;
|
|
font-size: 100%;
|
|
// font: inherit;
|
|
color: $yellow;
|
|
font-family: "Garamond", serif;
|
|
font-size-adjust: 0.75;
|
|
vertical-align: baseline;
|
|
text-rendering: optimizeLegibility;
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
|
|
@font-face{
|
|
font-family: 'Baskerville';
|
|
font-display: swap;
|
|
font-style: italic;
|
|
font-weight: 500;
|
|
src: url(/font/LibreBaskerville-Italic.otf) format('opentype');
|
|
}
|
|
@font-face{
|
|
font-family: 'Baskerville';
|
|
font-display: swap;
|
|
font-style: normal;
|
|
font-weight: 900;
|
|
src: url(/font/LibreBaskerville-Bold.otf) format('opentype');
|
|
}
|
|
@font-face{
|
|
font-family: 'Baskerville';
|
|
font-display: swap;
|
|
font-style: normal;
|
|
font-weight: 500;
|
|
src: url(/font/LibreBaskerville-Regular.otf) format('opentype');
|
|
}
|
|
|
|
@font-face{
|
|
font-family: 'Initials';
|
|
font-display: swap;
|
|
font-style: normal;
|
|
font-weight: 500;
|
|
src: url(/font/EBGaramond-Initials.otf) format('opentype');
|
|
}
|
|
@font-face{
|
|
font-family: 'Initials';
|
|
font-display: swap;
|
|
font-style: normal;
|
|
font-weight: 100;
|
|
src: url(/font/EBGaramond-InitialsF1.otf) format('opentype');
|
|
}
|
|
@font-face{
|
|
font-family: 'Initials';
|
|
font-display: swap;
|
|
font-style: normal;
|
|
font-weight: 200;
|
|
src: url(/font/EBGaramond-InitialsF2.otf) format('opentype');
|
|
}
|
|
|
|
@font-face{
|
|
font-family: 'Garamond';
|
|
font-display: swap;
|
|
font-style: italic;
|
|
src: url(/font/EBGaramond-Italic.ttf) format('truetype');
|
|
}
|
|
@font-face{
|
|
font-family: 'Garamond';
|
|
font-display: swap;
|
|
font-style: normal;
|
|
src: url(/font/EBGaramond.ttf) format('truetype');
|
|
}
|
|
</style>
|