Ledda/djledda-web
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

styling

Browse Source
This commit is contained in:
Daniel Ledda
2025-12-21 23:39:07 +01:00
parent 2829504b2b
commit f40c02585f
15 changed files with 295 additions and 527 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/DjTooltip.tsx
View File

@@ -119,12 +119,12 @@ export default defineComponent({
onBeforeUnmount(() => tooltip.hide());
return () => <>
<div class="tooltip-container"
<span class="tooltip-container"
{...attrs}
onMouseenter={(e) => tooltip.show(props.tooltip, e.pageX, e.pageY)}
onMouseleave={() => tooltip.hide()}>
{slots.default?.()}
</div>
</span>
</>;
},
});

88
app/blog/DjBlogRoot.tsx
View File

@@ -28,42 +28,59 @@ export const routes: RouteRecordRaw[] = [
];
const styles = css`
.supercontainer {
.dj-blog-root {
width: 100vw;
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 100px;
}
height: 100vh;
.container {
width: 800px;
}
footer {
color: gray;
font-style: italic;
margin-top: 40px;
}
a {
color: var(--dj-palette3);
text-decoration: solid line;
&:visited {
color: var(--dj-visited);
.container {
width: 800px;
}
}
nav {
font-size: 40px;
margin-bottom: 40px;
text-decoration: none;
text-align: right;
width: 100%;
.spacer {
flex: 1;
}
a, a:visited {
footer {
color: gray;
width: calc(100% - 10px);
margin-bottom: 20px;
font-style: italic;
padding-left: 10px;
}
a {
color: var(--dj-palette3);
text-decoration: solid line;
&:visited {
color: var(--dj-visited);
}
}
nav {
font-size: 40px;
margin-bottom: 40px;
text-decoration: none;
text-align: right;
width: 100%;
a, a:visited {
color: var(--dj-palette3);
}
}
@media only screen and (max-width: 1024px) {
.container {
width: calc(100% - 20px);
padding: 10px;
}
footer {
margin-bottom: 0;
}
}
}
`;
@@ -80,7 +97,7 @@ export default defineComponent({
return () => (
<>
<div ref={carrier} class="tooltip-carrier" />
<div class="supercontainer">
<div class="dj-blog-root">
<div class="container">
<nav>
<DjTooltip tooltip="flog, clog, bog, frog, cog, log, grog, fog, snog...">
@@ -102,14 +119,15 @@ export default defineComponent({
)),
}}
</RouterView>
<footer>
<div class="bottom">
<div>
<a href="/">djledda.net</a> {new Date().getFullYear()} - <DjEmail>{() => "Contact"}</DjEmail>
</div>
</div>
</footer>
</div>
<div class="spacer" />
<footer>
<div class="bottom">
<div>
<a href="/">djledda.net</a> {new Date().getFullYear()} - <DjEmail>{() => "Contact"}</DjEmail>
</div>
</div>
</footer>
</div>
</>
);

143
app/home/DjHomeRoot.tsx
View File

@@ -1,60 +1,82 @@
import { defineComponent, ref, type Ref } from "vue";
import { defineComponent, ref } from "vue";
import useHead from "@/useHead.ts";
import DjTooltip, { setupTooltip } from "@/DjTooltip.tsx";
import DjEmail from "@/DjEmail.tsx";
import { addCSS, css } from "@/util.ts";
const styles = css`
:root {
--subject-spacing: 40px;
body {
height: 100vh;
}
.resource {
margin-bottom: 10px;
}
.title_name {
font-size: 48px;
color: var(--dj-palette3);
text-align: center;
}
.supercontainer {
padding-top: 3em;
.dj-home-root {
margin: auto;
}
width: 500px;
display: flex;
flex-direction: column;
height: 100%;
.main {
width: 50em;
margin: 20px auto;
text-align: center;
}
.resource {
margin-bottom: 10px;
}
.spacer {
flex-grow: 1;
height: 100%;
}
.dj-title {
font-size: 48px;
margin: 20px auto;
color: var(--dj-palette3);
text-align: right;
white-space: nowrap;
display: flex;
flex-direction: row;
flex-flow: row-reverse;
overflow: hidden;
}
.underline {
text-decoration: underline solid var(--dj-palette3);
}
.pad {
color: var(--dj-bgpalette1);
}
@media only screen and (max-width: 1024px) {
.main {
width: 35em;
padding: 20px;
margin: 20px auto;
text-align: left;
}
:root {
--subject-spacing: 20px;
}
}
@media only screen and (max-width: 768px) {
.title_name {
font-size: 30px;
li {
list-style: disclosure-closed;
}
.main {
width: 20em;
padding: 20px;
a {
color: var(--dj-palette3);
&:visited {
color: var(--dj-visited);
}
}
}
a {
color: var(--dj-palette3);
footer {
margin-left: 10px;
margin-bottom: 20px;
}
&:visited {
color: var(--dj-visited);
@media only screen and (max-width: 1024px) {
width: 100%;
.dj-title {
margin-right: 30px;
}
footer {
margin-bottom: 0;
}
}
}
`;
@@ -70,31 +92,39 @@ export default defineComponent({
return () => <>
<div ref={tooltipCarrier} class="tooltip-carrier" />
<div class="supercontainer">
<div class="dj-home-root">
<div>
<div class="dj-title title_name">
<div class="dj-title">
<DjTooltip tooltip="Easily the coolest guy out there.">
<span>dj ledda</span>
<div class="underline">
<span class="pad">_ _ _ _ _ _ _ __</span><span>dj ledda</span>
</div>
</DjTooltip>
</div>
<div class="main">
<div class="subject">
<div class="resourcelist">
<main class="main">
<ul class="resourcelist">
<li>
<a href="/blog">
<DjTooltip class="resource" tooltip="My musings, my losings, my winnings, my thoughts">
Blog
</DjTooltip>
</a>
</li>
<li>
<a href="/generative-energy">
<DjTooltip class="resource" tooltip="Thyroid calculator, German translations, and more...">
Generative Energy - Ray Peat Resources
</DjTooltip>
</a>
</li>
<li>
<a href="https://git.djledda.net/Ledda">
<DjTooltip class="resource" tooltip="Check out what I'm coding!">
My git projects
</DjTooltip>
</a>
</li>
<li>
<a href="/home/muenchen-auf-englisch.html">
<DjTooltip class="resource" tooltip="
Authentic historically accurate translations of all of Munich's S-Bahn and U-Bahn
@@ -104,16 +134,22 @@ export default defineComponent({
M&uuml;nchen auf Englisch - Munich in English
</DjTooltip>
</a>
</li>
<li>
<a href="https://drum-slayer.com">
<DjTooltip class="resource" tooltip="Small app for designing multitrack looped rhythms with local save and multiple files. Originally built using just vanilla TypeScript and CSS, now with Vue.">
Drum Slayer
</DjTooltip>
</a>
</li>
<li>
<a href="/somaesque/index.html">
<DjTooltip class="resource" tooltip="Puzzle solver app for puzzle cubes resembling the original Soma Cube puzzle. Save and edit your own puzzles! Built with Svelte, THREE.js and AssemblyScript.">
Somaesque
</DjTooltip>
</a>
</li>
<li>
<a href="/kadi/">
<DjTooltip class="resource" tooltip="Make an account and start saving paper and tracking your Yatzy stats with your
friends! Make your own rulesets, and more. Built with React, express.js, and
@@ -121,15 +157,18 @@ export default defineComponent({
K A D I: Online Yatzy Scoresheets
</DjTooltip>
</a>
<DjEmail>
<DjTooltip class="resource" tooltip="You'll see my address when you click here.">
Click here to get in touch
</DjTooltip>
</DjEmail>
</div>
</li>
</ul>
</main>
</div>
<div class="spacer" />
<footer>
<div class="bottom">
<div>
<a href="/">djledda.net</a> {new Date().getFullYear()} - <DjEmail>{() => "Contact"}</DjEmail>
</div>
</div>
</div>
</footer>
</div>
</>;
},

370
deno.lock generated
View File

@@ -1,7 +1,6 @@
{
"version": "5",
"specifiers": {
"jsr:@b-fuze/deno-dom@*": "0.1.48",
"jsr:@b-fuze/deno-dom@~0.1.56": "0.1.56",
"jsr:@deno/cache-dir@0.13.2": "0.13.2",
"jsr:@deno/emit@*": "0.46.0",
@@ -11,44 +10,30 @@
"jsr:@std/assert@0.223": "0.223.0",
"jsr:@std/bytes@0.223": "0.223.0",
"jsr:@std/cli@^1.0.24": "1.0.24",
"jsr:@std/cli@^1.0.6": "1.0.6",
"jsr:@std/encoding@1": "1.0.10",
"jsr:@std/encoding@^1.0.10": "1.0.10",
"jsr:@std/encoding@^1.0.5": "1.0.5",
"jsr:@std/fmt@0.223": "0.223.0",
"jsr:@std/fmt@1": "1.0.8",
"jsr:@std/fmt@^1.0.3": "1.0.3",
"jsr:@std/fmt@^1.0.8": "1.0.8",
"jsr:@std/fs@*": "0.223.0",
"jsr:@std/fs@0.223": "0.223.0",
"jsr:@std/fs@1": "1.0.20",
"jsr:@std/fs@^1.0.20": "1.0.20",
"jsr:@std/html@^1.0.5": "1.0.5",
"jsr:@std/http@*": "1.0.9",
"jsr:@std/http@^1.0.22": "1.0.22",
"jsr:@std/internal@^1.0.12": "1.0.12",
"jsr:@std/io@0.223": "0.223.0",
"jsr:@std/media-types@^1.0.3": "1.0.3",
"jsr:@std/media-types@^1.1.0": "1.1.0",
"jsr:@std/net@^1.0.4": "1.0.4",
"jsr:@std/net@^1.0.6": "1.0.6",
"jsr:@std/path@*": "1.0.7",
"jsr:@std/path@0.223": "0.223.0",
"jsr:@std/path@1": "1.1.3",
"jsr:@std/path@^1.0.7": "1.0.7",
"jsr:@std/path@^1.1.3": "1.1.3",
"jsr:@std/streams@^1.0.14": "1.0.14",
"jsr:@std/streams@^1.0.7": "1.0.7",
"npm:@types/node@*": "22.5.4",
"npm:@vue/devtools-api@*": "6.6.4",
"npm:vue-router@4.4.5": "4.4.5_vue@3.5.12",
"npm:vue-router@4.4.5": "4.4.5_vue@3.5.26",
"npm:vue@*": "3.5.26",
"npm:vue@^3.5.26": "3.5.26"
},
"jsr": {
"@b-fuze/deno-dom@0.1.48": {
"integrity": "bf5b591aef2e9e9c59adfcbb93a9ecd45bab5b7c8263625beafa5c8f1662e7da"
},
"@b-fuze/deno-dom@0.1.56": {
"integrity": "8030e2dc1d8750f1682b53462ab893d9c3470f2287feecbe22f44a88c54ab148",
"dependencies": [
@@ -90,33 +75,20 @@
"@std/bytes@0.223.0": {
"integrity": "84b75052cd8680942c397c2631318772b295019098f40aac5c36cead4cba51a8"
},
"@std/cli@1.0.6": {
"integrity": "d22d8b38c66c666d7ad1f2a66c5b122da1704f985d3c47f01129f05abb6c5d3d"
},
"@std/cli@1.0.24": {
"integrity": "b655a5beb26aa94f98add6bc8889f5fb9bc3ee2cc3fc954e151201f4c4200a5e"
},
"@std/encoding@1.0.5": {
"integrity": "ecf363d4fc25bd85bd915ff6733a7e79b67e0e7806334af15f4645c569fefc04"
},
"@std/encoding@1.0.10": {
"integrity": "8783c6384a2d13abd5e9e87a7ae0520a30e9f56aeeaa3bdf910a3eaaf5c811a1"
},
"@std/fmt@0.223.0": {
"integrity": "6deb37794127dfc7d7bded2586b9fc6f5d50e62a8134846608baf71ffc1a5208"
},
"@std/fmt@1.0.3": {
"integrity": "97765c16aa32245ff4e2204ecf7d8562496a3cb8592340a80e7e554e0bb9149f"
},
"@std/fmt@1.0.8": {
"integrity": "71e1fc498787e4434d213647a6e43e794af4fd393ef8f52062246e06f7e372b7"
},
"@std/fs@0.223.0": {
"integrity": "3b4b0550b2c524cbaaa5a9170c90e96cbb7354e837ad1bdaf15fc9df1ae9c31c",
"dependencies": [
"jsr:@std/assert",
"jsr:@std/path@0.223"
]
"integrity": "3b4b0550b2c524cbaaa5a9170c90e96cbb7354e837ad1bdaf15fc9df1ae9c31c"
},
"@std/fs@1.0.20": {
"integrity": "e953206aae48d46ee65e8783ded459f23bec7dd1f3879512911c35e5484ea187",
@@ -128,30 +100,18 @@
"@std/html@1.0.5": {
"integrity": "4e2d693f474cae8c16a920fa5e15a3b72267b94b84667f11a50c6dd1cb18d35e"
},
"@std/http@1.0.9": {
"integrity": "d409fc319a5e8d4a154e576c758752e9700282d74f31357a12fec6420f9ecb6c",
"dependencies": [
"jsr:@std/cli@^1.0.6",
"jsr:@std/encoding@^1.0.5",
"jsr:@std/fmt@^1.0.3",
"jsr:@std/media-types@^1.0.3",
"jsr:@std/net@^1.0.4",
"jsr:@std/path@^1.0.7",
"jsr:@std/streams@^1.0.7"
]
},
"@std/http@1.0.22": {
"integrity": "53f0bb70e23a2eec3e17c4240a85bb23d185b2e20635adb37ce0f03cc4ca012a",
"dependencies": [
"jsr:@std/cli@^1.0.24",
"jsr:@std/cli",
"jsr:@std/encoding@^1.0.10",
"jsr:@std/fmt@^1.0.8",
"jsr:@std/fs@^1.0.20",
"jsr:@std/html",
"jsr:@std/media-types@^1.1.0",
"jsr:@std/net@^1.0.6",
"jsr:@std/media-types",
"jsr:@std/net",
"jsr:@std/path@^1.1.3",
"jsr:@std/streams@^1.0.14"
"jsr:@std/streams"
]
},
"@std/internal@1.0.12": {
@@ -164,15 +124,9 @@
"jsr:@std/bytes"
]
},
"@std/media-types@1.0.3": {
"integrity": "b12d30a7852f7578f4d210622df713bbfd1cbdd9b4ec2eaf5c1845ab70bab159"
},
"@std/media-types@1.1.0": {
"integrity": "c9d093f0c05c3512932b330e3cc1fe1d627b301db33a4c2c2185c02471d6eaa4"
},
"@std/net@1.0.4": {
"integrity": "2f403b455ebbccf83d8a027d29c5a9e3a2452fea39bb2da7f2c04af09c8bc852"
},
"@std/net@1.0.6": {
"integrity": "110735f93e95bb9feb95790a8b1d1bf69ec0dc74f3f97a00a76ea5efea25500c"
},
@@ -182,353 +136,163 @@
"jsr:@std/assert"
]
},
"@std/path@1.0.7": {
"integrity": "76a689e07f0e15dcc6002ec39d0866797e7156629212b28f27179b8a5c3b33a1"
},
"@std/path@1.1.3": {
"integrity": "b015962d82a5e6daea980c32b82d2c40142149639968549c649031a230b1afb3",
"dependencies": [
"jsr:@std/internal"
]
},
"@std/streams@1.0.7": {
"integrity": "1a93917ca0c58c01b2bfb93647189229b1702677f169b6fb61ad6241cd2e499b"
},
"@std/streams@1.0.14": {
"integrity": "c0df6cdd73bd4bbcbe4baa89e323b88418c90ceb2d926f95aa99bdcdbfca2411"
}
},
"npm": {
"@babel/helper-string-parser@7.25.9": {
"integrity": "sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@babel%2fhelper-string-parser/-/helper-string-parser-7.25.9.tgz"
},
"@babel/helper-string-parser@7.27.1": {
"integrity": "sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@babel%2fhelper-string-parser/-/helper-string-parser-7.27.1.tgz"
},
"@babel/helper-validator-identifier@7.25.9": {
"integrity": "sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@babel%2fhelper-validator-identifier/-/helper-validator-identifier-7.25.9.tgz"
"integrity": "sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA=="
},
"@babel/helper-validator-identifier@7.28.5": {
"integrity": "sha512-qSs4ifwzKJSV39ucNjsvc6WVHs6b7S03sOh2OcHF9UHfVPqWWALUsNUVzhSBiItjRZoLHx7nIarVjqKVusUZ1Q==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@babel%2fhelper-validator-identifier/-/helper-validator-identifier-7.28.5.tgz"
},
"@babel/parser@7.26.2": {
"integrity": "sha512-DWMCZH9WA4Maitz2q21SRKHo9QXZxkDsbNZoVD62gusNtNBBqDg9i7uOhASfTfIGNzW+O+r7+jAlM8dwphcJKQ==",
"dependencies": [
"@babel/types@7.26.0"
],
"bin": true,
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@babel%2fparser/-/parser-7.26.2.tgz"
"integrity": "sha512-qSs4ifwzKJSV39ucNjsvc6WVHs6b7S03sOh2OcHF9UHfVPqWWALUsNUVzhSBiItjRZoLHx7nIarVjqKVusUZ1Q=="
},
"@babel/parser@7.28.5": {
"integrity": "sha512-KKBU1VGYR7ORr3At5HAtUQ+TV3SzRCXmA/8OdDZiLDBIZxVyzXuztPjfLd3BV1PRAQGCMWWSHYhL0F8d5uHBDQ==",
"dependencies": [
"@babel/types@7.28.5"
"@babel/types"
],
"bin": true,
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@babel%2fparser/-/parser-7.28.5.tgz"
},
"@babel/types@7.26.0": {
"integrity": "sha512-Z/yiTPj+lDVnF7lWeKCIJzaIkI0vYO87dMpZ4bg4TDrFe4XXLFWL1TbXU27gBP3QccxV9mZICCrnjnYlJjXHOA==",
"dependencies": [
"@babel/helper-string-parser@7.25.9",
"@babel/helper-validator-identifier@7.25.9"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@babel%2ftypes/-/types-7.26.0.tgz"
"bin": true
},
"@babel/types@7.28.5": {
"integrity": "sha512-qQ5m48eI/MFLQ5PxQj4PFaprjyCTLI37ElWMmNs0K8Lk3dVeOdNpB3ks8jc7yM5CDmVC73eMVk/trk3fgmrUpA==",
"dependencies": [
"@babel/helper-string-parser@7.27.1",
"@babel/helper-validator-identifier@7.28.5"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@babel%2ftypes/-/types-7.28.5.tgz"
},
"@jridgewell/sourcemap-codec@1.5.0": {
"integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@jridgewell%2fsourcemap-codec/-/sourcemap-codec-1.5.0.tgz"
"@babel/helper-string-parser",
"@babel/helper-validator-identifier"
]
},
"@jridgewell/sourcemap-codec@1.5.5": {
"integrity": "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@jridgewell%2fsourcemap-codec/-/sourcemap-codec-1.5.5.tgz"
},
"@types/node@22.5.4": {
"integrity": "sha512-FDuKUJQm/ju9fT/SeX/6+gBzoPzlVCzfzmGkwKvRHQVxi4BntVbyIwf6a4Xn62mrvndLiml6z/UBXIdEVjQLXg==",
"dependencies": [
"undici-types"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@types%2fnode/-/node-22.5.4.tgz"
},
"@vue/compiler-core@3.5.12": {
"integrity": "sha512-ISyBTRMmMYagUxhcpyEH0hpXRd/KqDU4ymofPgl2XAkY9ZhQ+h0ovEZJIiPop13UmR/54oA2cgMDjgroRelaEw==",
"dependencies": [
"@babel/parser@7.26.2",
"@vue/shared@3.5.12",
"entities@4.5.0",
"estree-walker",
"source-map-js"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fcompiler-core/-/compiler-core-3.5.12.tgz"
"integrity": "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og=="
},
"@vue/compiler-core@3.5.26": {
"integrity": "sha512-vXyI5GMfuoBCnv5ucIT7jhHKl55Y477yxP6fc4eUswjP8FG3FFVFd41eNDArR+Uk3QKn2Z85NavjaxLxOC19/w==",
"dependencies": [
"@babel/parser@7.28.5",
"@vue/shared@3.5.26",
"entities@7.0.0",
"@babel/parser",
"@vue/shared",
"entities",
"estree-walker",
"source-map-js"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fcompiler-core/-/compiler-core-3.5.26.tgz"
},
"@vue/compiler-dom@3.5.12": {
"integrity": "sha512-9G6PbJ03uwxLHKQ3P42cMTi85lDRvGLB2rSGOiQqtXELat6uI4n8cNz9yjfVHRPIu+MsK6TE418Giruvgptckg==",
"dependencies": [
"@vue/compiler-core@3.5.12",
"@vue/shared@3.5.12"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fcompiler-dom/-/compiler-dom-3.5.12.tgz"
]
},
"@vue/compiler-dom@3.5.26": {
"integrity": "sha512-y1Tcd3eXs834QjswshSilCBnKGeQjQXB6PqFn/1nxcQw4pmG42G8lwz+FZPAZAby6gZeHSt/8LMPfZ4Rb+Bd/A==",
"dependencies": [
"@vue/compiler-core@3.5.26",
"@vue/shared@3.5.26"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fcompiler-dom/-/compiler-dom-3.5.26.tgz"
},
"@vue/compiler-sfc@3.5.12": {
"integrity": "sha512-2k973OGo2JuAa5+ZlekuQJtitI5CgLMOwgl94BzMCsKZCX/xiqzJYzapl4opFogKHqwJk34vfsaKpfEhd1k5nw==",
"dependencies": [
"@babel/parser@7.26.2",
"@vue/compiler-core@3.5.12",
"@vue/compiler-dom@3.5.12",
"@vue/compiler-ssr@3.5.12",
"@vue/shared@3.5.12",
"estree-walker",
"magic-string@0.30.12",
"postcss@8.4.47",
"source-map-js"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fcompiler-sfc/-/compiler-sfc-3.5.12.tgz"
"@vue/compiler-core",
"@vue/shared"
]
},
"@vue/compiler-sfc@3.5.26": {
"integrity": "sha512-egp69qDTSEZcf4bGOSsprUr4xI73wfrY5oRs6GSgXFTiHrWj4Y3X5Ydtip9QMqiCMCPVwLglB9GBxXtTadJ3mA==",
"dependencies": [
"@babel/parser@7.28.5",
"@vue/compiler-core@3.5.26",
"@vue/compiler-dom@3.5.26",
"@vue/compiler-ssr@3.5.26",
"@vue/shared@3.5.26",
"@babel/parser",
"@vue/compiler-core",
"@vue/compiler-dom",
"@vue/compiler-ssr",
"@vue/shared",
"estree-walker",
"magic-string@0.30.21",
"postcss@8.5.6",
"magic-string",
"postcss",
"source-map-js"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fcompiler-sfc/-/compiler-sfc-3.5.26.tgz"
},
"@vue/compiler-ssr@3.5.12": {
"integrity": "sha512-eLwc7v6bfGBSM7wZOGPmRavSWzNFF6+PdRhE+VFJhNCgHiF8AM7ccoqcv5kBXA2eWUfigD7byekvf/JsOfKvPA==",
"dependencies": [
"@vue/compiler-dom@3.5.12",
"@vue/shared@3.5.12"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fcompiler-ssr/-/compiler-ssr-3.5.12.tgz"
]
},
"@vue/compiler-ssr@3.5.26": {
"integrity": "sha512-lZT9/Y0nSIRUPVvapFJEVDbEXruZh2IYHMk2zTtEgJSlP5gVOqeWXH54xDKAaFS4rTnDeDBQUYDtxKyoW9FwDw==",
"dependencies": [
"@vue/compiler-dom@3.5.26",
"@vue/shared@3.5.26"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fcompiler-ssr/-/compiler-ssr-3.5.26.tgz"
"@vue/compiler-dom",
"@vue/shared"
]
},
"@vue/devtools-api@6.6.4": {
"integrity": "sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fdevtools-api/-/devtools-api-6.6.4.tgz"
},
"@vue/reactivity@3.5.12": {
"integrity": "sha512-UzaN3Da7xnJXdz4Okb/BGbAaomRHc3RdoWqTzlvd9+WBR5m3J39J1fGcHes7U3za0ruYn/iYy/a1euhMEHvTAg==",
"dependencies": [
"@vue/shared@3.5.12"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2freactivity/-/reactivity-3.5.12.tgz"
"integrity": "sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g=="
},
"@vue/reactivity@3.5.26": {
"integrity": "sha512-9EnYB1/DIiUYYnzlnUBgwU32NNvLp/nhxLXeWRhHUEeWNTn1ECxX8aGO7RTXeX6PPcxe3LLuNBFoJbV4QZ+CFQ==",
"dependencies": [
"@vue/shared@3.5.26"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2freactivity/-/reactivity-3.5.26.tgz"
},
"@vue/runtime-core@3.5.12": {
"integrity": "sha512-hrMUYV6tpocr3TL3Ad8DqxOdpDe4zuQY4HPY3X/VRh+L2myQO8MFXPAMarIOSGNu0bFAjh1yBkMPXZBqCk62Uw==",
"dependencies": [
"@vue/reactivity@3.5.12",
"@vue/shared@3.5.12"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fruntime-core/-/runtime-core-3.5.12.tgz"
"@vue/shared"
]
},
"@vue/runtime-core@3.5.26": {
"integrity": "sha512-xJWM9KH1kd201w5DvMDOwDHYhrdPTrAatn56oB/LRG4plEQeZRQLw0Bpwih9KYoqmzaxF0OKSn6swzYi84e1/Q==",
"dependencies": [
"@vue/reactivity@3.5.26",
"@vue/shared@3.5.26"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fruntime-core/-/runtime-core-3.5.26.tgz"
},
"@vue/runtime-dom@3.5.12": {
"integrity": "sha512-q8VFxR9A2MRfBr6/55Q3umyoN7ya836FzRXajPB6/Vvuv0zOPL+qltd9rIMzG/DbRLAIlREmnLsplEF/kotXKA==",
"dependencies": [
"@vue/reactivity@3.5.12",
"@vue/runtime-core@3.5.12",
"@vue/shared@3.5.12",
"csstype@3.1.3"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fruntime-dom/-/runtime-dom-3.5.12.tgz"
"@vue/reactivity",
"@vue/shared"
]
},
"@vue/runtime-dom@3.5.26": {
"integrity": "sha512-XLLd/+4sPC2ZkN/6+V4O4gjJu6kSDbHAChvsyWgm1oGbdSO3efvGYnm25yCjtFm/K7rrSDvSfPDgN1pHgS4VNQ==",
"dependencies": [
"@vue/reactivity@3.5.26",
"@vue/runtime-core@3.5.26",
"@vue/shared@3.5.26",
"csstype@3.2.3"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fruntime-dom/-/runtime-dom-3.5.26.tgz"
},
"@vue/server-renderer@3.5.12_vue@3.5.12": {
"integrity": "sha512-I3QoeDDeEPZm8yR28JtY+rk880Oqmj43hreIBVTicisFTx/Dl7JpG72g/X7YF8hnQD3IFhkky5i2bPonwrTVPg==",
"dependencies": [
"@vue/compiler-ssr@3.5.12",
"@vue/shared@3.5.12",
"vue@3.5.12"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fserver-renderer/-/server-renderer-3.5.12.tgz"
"@vue/reactivity",
"@vue/runtime-core",
"@vue/shared",
"csstype"
]
},
"@vue/server-renderer@3.5.26_vue@3.5.26": {
"integrity": "sha512-TYKLXmrwWKSodyVuO1WAubucd+1XlLg4set0YoV+Hu8Lo79mp/YMwWV5mC5FgtsDxX3qo1ONrxFaTP1OQgy1uA==",
"dependencies": [
"@vue/compiler-ssr@3.5.26",
"@vue/shared@3.5.26",
"vue@3.5.26"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fserver-renderer/-/server-renderer-3.5.26.tgz"
},
"@vue/shared@3.5.12": {
"integrity": "sha512-L2RPSAwUFbgZH20etwrXyVyCBu9OxRSi8T/38QsvnkJyvq2LufW2lDCOzm7t/U9C1mkhJGWYfCuFBCmIuNivrg==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fshared/-/shared-3.5.12.tgz"
"@vue/compiler-ssr",
"@vue/shared",
"vue"
]
},
"@vue/shared@3.5.26": {
"integrity": "sha512-7Z6/y3uFI5PRoKeorTOSXKcDj0MSasfNNltcslbFrPpcw6aXRUALq4IfJlaTRspiWIUOEZbrpM+iQGmCOiWe4A==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/@vue%2fshared/-/shared-3.5.26.tgz"
},
"csstype@3.1.3": {
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/csstype/-/csstype-3.1.3.tgz"
"integrity": "sha512-7Z6/y3uFI5PRoKeorTOSXKcDj0MSasfNNltcslbFrPpcw6aXRUALq4IfJlaTRspiWIUOEZbrpM+iQGmCOiWe4A=="
},
"csstype@3.2.3": {
"integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/csstype/-/csstype-3.2.3.tgz"
},
"entities@4.5.0": {
"integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/entities/-/entities-4.5.0.tgz"
"integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ=="
},
"entities@7.0.0": {
"integrity": "sha512-FDWG5cmEYf2Z00IkYRhbFrwIwvdFKH07uV8dvNy0omp/Qb1xcyCWp2UDtcwJF4QZZvk0sLudP6/hAu42TaqVhQ==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/entities/-/entities-7.0.0.tgz"
"integrity": "sha512-FDWG5cmEYf2Z00IkYRhbFrwIwvdFKH07uV8dvNy0omp/Qb1xcyCWp2UDtcwJF4QZZvk0sLudP6/hAu42TaqVhQ=="
},
"estree-walker@2.0.2": {
"integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/estree-walker/-/estree-walker-2.0.2.tgz"
},
"magic-string@0.30.12": {
"integrity": "sha512-Ea8I3sQMVXr8JhN4z+H/d8zwo+tYDgHE9+5G4Wnrwhs0gaK9fXTKx0Tw5Xwsd/bCPTTZNRAdpyzvoeORe9LYpw==",
"dependencies": [
"@jridgewell/sourcemap-codec@1.5.0"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/magic-string/-/magic-string-0.30.12.tgz"
"integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="
},
"magic-string@0.30.21": {
"integrity": "sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==",
"dependencies": [
"@jridgewell/sourcemap-codec@1.5.5"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/magic-string/-/magic-string-0.30.21.tgz"
"@jridgewell/sourcemap-codec"
]
},
"nanoid@3.3.11": {
"integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==",
"bin": true,
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/nanoid/-/nanoid-3.3.11.tgz"
},
"nanoid@3.3.7": {
"integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==",
"bin": true,
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/nanoid/-/nanoid-3.3.7.tgz"
"bin": true
},
"picocolors@1.1.1": {
"integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/picocolors/-/picocolors-1.1.1.tgz"
},
"postcss@8.4.47": {
"integrity": "sha512-56rxCq7G/XfB4EkXq9Egn5GCqugWvDFjafDOThIdMBsI15iqPqR5r15TfSr1YPYeEI19YeaXMCbY6u88Y76GLQ==",
"dependencies": [
"nanoid@3.3.7",
"picocolors",
"source-map-js"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/postcss/-/postcss-8.4.47.tgz"
"integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA=="
},
"postcss@8.5.6": {
"integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==",
"dependencies": [
"nanoid@3.3.11",
"nanoid",
"picocolors",
"source-map-js"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/postcss/-/postcss-8.5.6.tgz"
]
},
"source-map-js@1.2.1": {
"integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/source-map-js/-/source-map-js-1.2.1.tgz"
"integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA=="
},
"undici-types@6.19.8": {
"integrity": "sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==",
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/undici-types/-/undici-types-6.19.8.tgz"
},
"vue-router@4.4.5_vue@3.5.12": {
"vue-router@4.4.5_vue@3.5.26": {
"integrity": "sha512-4fKZygS8cH1yCyuabAXGUAsyi1b2/o/OKgu/RUb+znIYOxPRxdkytJEx+0wGcpBE1pX6vUgh5jwWOKRGvuA/7Q==",
"dependencies": [
"@vue/devtools-api",
"vue@3.5.12"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/vue-router/-/vue-router-4.4.5.tgz"
},
"vue@3.5.12": {
"integrity": "sha512-CLVZtXtn2ItBIi/zHZ0Sg1Xkb7+PU32bJJ8Bmy7ts3jxXTcbfsEfBivFYYWz1Hur+lalqGAh65Coin0r+HRUfg==",
"dependencies": [
"@vue/compiler-dom@3.5.12",
"@vue/compiler-sfc@3.5.12",
"@vue/runtime-dom@3.5.12",
"@vue/server-renderer@3.5.12_vue@3.5.12",
"@vue/shared@3.5.12"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/vue/-/vue-3.5.12.tgz"
"vue"
]
},
"vue@3.5.26": {
"integrity": "sha512-SJ/NTccVyAoNUJmkM9KUqPcYlY+u8OVL1X5EW9RIs3ch5H2uERxyyIUI4MRxVCSOiEcupX9xNGde1tL9ZKpimA==",
"dependencies": [
"@vue/compiler-dom@3.5.26",
"@vue/compiler-sfc@3.5.26",
"@vue/runtime-dom@3.5.26",
"@vue/server-renderer@3.5.26_vue@3.5.26",
"@vue/shared@3.5.26"
],
"tarball": "http://npm.srv.dc1.boerse-go.de:4873/vue/-/vue-3.5.26.tgz"
"@vue/compiler-dom",
"@vue/compiler-sfc",
"@vue/runtime-dom",
"@vue/server-renderer",
"@vue/shared"
]
}
},
"workspace": {

13
main.ts
View File

@@ -48,10 +48,9 @@ async function* siteEntries(path: string): AsyncGenerator<string> {
}
}
const publicFiles = siteEntries("public");
const sites: string[] = [];
for await (const path of publicFiles) {
sites.push(path);
for await (const entry of siteEntries("public")) {
sites.push(entry);
}
async function getAPIResponse(apiReq: Request): Promise<Response> {
@@ -223,12 +222,12 @@ Deno.serve({
// SSR
if (response === null) {
const baseDirectoryName = pathname.split("/")[1] ?? "";
let baseDirectoryName = pathname.split("/")[1] ?? "";
baseDirectoryName = baseDirectoryName === "" ? "home" : baseDirectoryName;
if (sites.includes(baseDirectoryName)) {
const appLocation = baseDirectoryName === "" ? "home" : baseDirectoryName;
const siteTemplate = join("public", baseDirectoryName, "index_template.html");
const siteEntry = join("app", appLocation, "server.ts");
const clientEntry = join("@", appLocation, "client.ts");
const siteEntry = join("app", baseDirectoryName, "server.ts");
const clientEntry = join("@", baseDirectoryName, "client.ts");
const { app, router } = (await import("./" + siteEntry)).default() as {
app: App;
router: Router | null;

2
public/blog/content/poof-and-its-gone.html
View File

@@ -36,7 +36,7 @@
complete drag of a memorisation task, presumably aided by my younger, more language sensitive age at the time. Each day was a new game of detective guesswork, and better still, I got to play
with new ideas about how the language works each day in the schoolyard with the new friends I was making. New ways to
describe how things are situated in space, adverbs for how they move in relation to one another, mysterious new prefixes and other quaint linguistic
quirks, like the insane backwards word order of German&em;unlimited entertainment to see if I was up to
quirks, like the insane backwards word order of German&mdash;unlimited entertainment to see if I was up to
the challenge. I practically spent all my time in class ogling the immaculate chalk handwriting of the various teachers, I remember biology and German class in particular, and
trying to work out what on Earth was going on. For some strange reason, it was a kind of bliss.
</p>

2
public/blog/index_template.html
View File

@@ -4,7 +4,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/theme.css">
<link rel="stylesheet" href="/static/theme.css">
<meta name="description" content="dj blog - djledda's blog">
<!-- SSR HEAD OUTLET -->

16
public/home/index_template.html Normal file
View File

@@ -0,0 +1,16 @@
<!DOCTYPE html>
<html>
<head>
<link rel="icon" href="/home/icon.webp" />
<link rel="icon" href="/home/img/dj.gif" />
<link rel="stylesheet" href="/static/theme.css" />
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- SSR HEAD OUTLET -->
</head>
<body>
<div id="app-root" style="height: 100vh;"><!-- SSR OUTLET --></div>
</body>
</html>

13
public/index_template.html
View File

@@ -1,13 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<link rel="icon" href="/home/icon.webp" />
<link rel="stylesheet" href="/theme.css" />
<link rel="icon" href="/home/img/dj.gif" />
<!-- SSR HEAD OUTLET -->
</head>
<body>
<div id="app-root"><!-- SSR OUTLET --></div>
</body>
</html>

BIN
public/static/assets/baskervville-italic.ttf Normal file
View File

Binary file not shown.

BIN
public/static/assets/baskervville.ttf Normal file
View File

Binary file not shown.

BIN
public/static/assets/quattrocento-bold.ttf Normal file
View File

Binary file not shown.

BIN
public/static/assets/quattrocento-regular.ttf Normal file
View File

Binary file not shown.

58
public/static/theme.css Normal file
View File

@@ -0,0 +1,58 @@
@font-face {
font-family: "Quattrocento";
font-style: regular;
src: local("Quattrocento"), url("assets/quattrocento-regular.ttf") format("truetype")
}
@font-face {
font-family: "Quattrocento";
font-style: bold;
src: local("Quattrocento"), url("assets/quattrocento-bold.ttf") format("truetype");
}
@font-face {
font-family: "Baskervville";
font-style: regular;
src: local("Baskervville"), url("assets/baskervville.ttf") format("truetype")
}
@font-face {
font-family: "Baskervville";
font-style: italic;
src: local("Baskervville"), url("assets/baskervville-italic.ttf") format("truetype");
}
:root {
--dj-palette1: #83a6bf;
--dj-palette2: #5e81ac;
--dj-palette3: #8fbcbb;
--dj-visited: #8d8bd5;
--dj-bgpalette1: #2e3440;
}
html, body {
box-sizing: border-box;
background-color: var(--dj-bgpalette1);
color: var(--dj-palette1);
margin: 0;
padding: 0;
font-family: "Quattrocento", serif;
font-optical-sizing: auto;
font-style: normal;
font-size: 16px;
}
h1, h2, h3, h4, h5, nav, .dj-title, .roboto-slab {
font-family: "Baskervville", serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
}
.spectral-regular, body {
font-family: "Spectral", serif;
font-weight: 400;
font-style: normal;
font-size: 19px;
}

113
public/theme.css
View File

@@ -1,113 +0,0 @@
@import url('https://fonts.googleapis.com/css2?family=Laila:wght@300;400;500;600;700&family=Quattrocento:wght@400;700&family=Roboto+Slab:wght@100..900&family=Spectral:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');
:root {
--dj-palette1: #83a6bf;
--dj-palette2: #5e81ac;
--dj-palette3: #8fbcbb;
--dj-visited: #8d8bd5;
--dj-bgpalette1: #2e3440;
}
html, body {
background-color: var(--dj-bgpalette1);
color: var(--dj-palette1);
font-family: "Quattrocento", sans-serif;
font-optical-sizing: auto;
font-weight: 400; /* bold 700 */
font-style: normal;
font-size: 16px;
}
h1, h2, h3, h4, h5, nav, .dj-title, .roboto-slab {
font-family: "Roboto Slab", serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
}
.spectral-extralight {
font-family: "Spectral", serif;
font-weight: 200;
font-style: normal;
}
.spectral-light {
font-family: "Spectral", serif;
font-weight: 300;
font-style: normal;
}
.spectral-regular, body {
font-family: "Spectral", serif;
font-weight: 400;
font-style: normal;
font-size: 19px;
}
.spectral-medium {
font-family: "Spectral", serif;
font-weight: 500;
font-style: normal;
}
.spectral-semibold {
font-family: "Spectral", serif;
font-weight: 600;
font-style: normal;
}
.spectral-bold {
font-family: "Spectral", serif;
font-weight: 700;
font-style: normal;
}
.spectral-extrabold {
font-family: "Spectral", serif;
font-weight: 800;
font-style: normal;
}
.spectral-extralight-italic {
font-family: "Spectral", serif;
font-weight: 200;
font-style: italic;
}
.spectral-light-italic {
font-family: "Spectral", serif;
font-weight: 300;
font-style: italic;
}
.spectral-regular-italic {
font-family: "Spectral", serif;
font-weight: 400;
font-style: italic;
}
.spectral-medium-italic {
font-family: "Spectral", serif;
font-weight: 500;
font-style: italic;
}
.spectral-semibold-italic {
font-family: "Spectral", serif;
font-weight: 600;
font-style: italic;
}
.spectral-bold-italic {
font-family: "Spectral", serif;
font-weight: 700;
font-style: italic;
}
.spectral-extrabold-italic {
font-family: "Spectral", serif;
font-weight: 800;
font-style: italic;
}