doloro/doloro-site-v6
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

things

Browse Source
This commit is contained in:
Doloro1978
2026-04-07 16:46:03 +01:00
parent 304364524f
commit a57d0f7fea
4 changed files with 224 additions and 291 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app.html
+2 -1
View File
@@ -3,9 +3,10 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="/shared.css" />
%sveltekit.head% %sveltekit.head%
</head> </head>
<body data-sveltekit-preload-data="hover"> <body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div> <div style="display: contents">%sveltekit.body%</div>
</body> </body>
</html> </html>
src/routes/+layout.svelte
+129 -288
View File
@@ -1,310 +1,151 @@
<script lang="ts"> <script lang="ts">
import favicon from "$lib/assets/favicon.svg"; import favicon from "$lib/assets/favicon.svg";
let { children } = $props(); let { children } = $props();
</script> </script>
<svelte:head> <svelte:head>
<link rel="icon" href={favicon} /> <link rel="icon" href={favicon} />
<link href="/shared.css" rel="stylesheet" />
</svelte:head> </svelte:head>
<body> <div class="container">
<div class="container"> <header>
<header> <h1>Doloro's corner of the inter-webs</h1>
<h1>Doloro's corner of the inter-webs</h1> <nav class="nav">
<nav class="nav"> <a href="&#x2F;">Home</a>
<a href="&#x2F;">Home</a> </nav>
</header>
<a href="&#x2F;plogs&#x2F;">Posts</a> <div class="body_of_funny_content">
<div class="left-sidebar a_bit_of_padding">
<a href="&#x2F;about&#x2F;">About</a> <style>
</nav> .side-card {
</header> background-color: var(--thirdly);
<div class="body_of_funny_content"> border: 2px, inset, var(--thirdly);
<div class="left-sidebar a_bit_of_padding"> }
<style> .side-card + .side-card {
.side-card { margin-top: 5px;
background-color: var(--thirdly); }
border: 2px, inset, var(--thirdly); .side-card-inner {
} display: flex;
.side-card + .side-card { flex-direction: column;
margin-top: 5px; align-items: center;
} justify-content: center;
.side-card-inner { font-size: small;
display: flex; }
flex-direction: column; .side-card-bottom {
align-items: center; align-self: flex-end;
justify-content: center; }
font-size: small; </style>
} <div class="left-sidebar-inner sticky_top">
.side-card-bottom { <div>
align-self: flex-end; <div class="side-card">meow</div>
}
</style>
<div class="left-sidebar-inner sticky_top">
<div>
<div class="side-card">meow</div>
</div>
</div> </div>
</div> </div>
<div class="actual-content"> </div>
<center> <div class="actual-content">
<div class="meow"> {@render children()}
<img src="https://doloro.co.uk/assets/work_in_progress/wip2.gif" /> <style>
<img src="https://doloro.co.uk/assets/work_in_progress/wip2.gif" /> .meow {
display: flex;
flex-direction: row;
justify-content: space-between;
}
</style>
</div>
<div class="right-sidebar a_bit_of_padding">
<div class="right-sidebar-inner sticky_top">
<div class="side-card">meow</div>
<div class="side-card" style="">
<div class="side-card-inner">
<a
href="https://doloro.co.uk/"
style="width: 95%; height: auto; align-items: center; margin: 2px"
><img
class="web-button"
src="https://doloro.co.uk/assets/webStamps/doloro.png"
style="width: 100%; height: auto; text-align: center"
/></a
>
<a> steal my web button! </a>
</div> </div>
<img src="https://doloro.co.uk/assets/work_in_progress/wip.gif" /> </div>
<div class="meow"> <div class="side-card">
<img src="https://doloro.co.uk/assets/work_in_progress/wip2.gif" /> <div class="social-button-div">
<img src="https://doloro.co.uk/assets/work_in_progress/wip2.gif" /> <a
style="border-color: #1DA1F2; background: #1DA1F2"
class="social-button"
href="https:&#x2F;&#x2F;x.com&#x2F;Doloror"
>
<img src="https://doloro.co.uk/assets/socials/twitter.svg" />
</a>
<a
style="border-color: #ff90e8; background: #ff90e8"
class="social-button"
href="https:&#x2F;&#x2F;doloro.gumroad.com&#x2F;"
>
<img src="https://doloro.co.uk/assets/socials/gumroad.svg" />
</a>
<a
style="border-color: #000000; background: #000000"
class="social-button"
href="https:&#x2F;&#x2F;steamcommunity.com&#x2F;id&#x2F;Doloro&#x2F;"
>
<img src="https://doloro.co.uk/assets/socials/steam.svg" />
</a>
<a
style="border-color: #101010; background: #101010"
class="social-button"
href="https:&#x2F;&#x2F;jinxxy.com&#x2F;doloro"
>
<img src="https://doloro.co.uk/assets/socials/jinxxy.png" />
</a>
</div> </div>
</center> <style>
<style> .social-button-div {
.meow { display: flex;
display: flex; flex-wrap: wrap;
flex-direction: row; align-content: stretch;
justify-content: space-between; justify-content: space-evenly;
} }
</style> .social-button {
</div> display: block;
<div class="right-sidebar a_bit_of_padding"> width: 30px;
<div class="right-sidebar-inner sticky_top"> height: auto;
<div class="side-card">meow</div> border: 2px outset #1da1f2;
<div class="side-card" style=""> background: #1da1f2;
<div class="side-card-inner"> margin: 2px;
<a img {
href="https://doloro.co.uk/"
style="width: 95%; height: auto; align-items: center; margin: 2px"
><img
class="web-button"
src="https://doloro.co.uk/assets/webStamps/doloro.png"
style="width: 100%; height: auto; text-align: center"
/></a
>
<a> steal my web button! </a>
</div>
</div>
<div class="side-card">
<div class="social-button-div">
<a
style="border-color: #1DA1F2; background: #1DA1F2"
class="social-button"
href="https:&#x2F;&#x2F;x.com&#x2F;Doloror"
>
<img src="https://doloro.co.uk/assets/socials/twitter.svg" />
</a>
<a
style="border-color: #ff90e8; background: #ff90e8"
class="social-button"
href="https:&#x2F;&#x2F;doloro.gumroad.com&#x2F;"
>
<img src="https://doloro.co.uk/assets/socials/gumroad.svg" />
</a>
<a
style="border-color: #000000; background: #000000"
class="social-button"
href="https:&#x2F;&#x2F;steamcommunity.com&#x2F;id&#x2F;Doloro&#x2F;"
>
<img src="https://doloro.co.uk/assets/socials/steam.svg" />
</a>
<a
style="border-color: #101010; background: #101010"
class="social-button"
href="https:&#x2F;&#x2F;jinxxy.com&#x2F;doloro"
>
<img src="https://doloro.co.uk/assets/socials/jinxxy.png" />
</a>
</div>
<style>
.social-button-div {
display: flex;
flex-wrap: wrap;
align-content: stretch;
justify-content: space-evenly;
}
.social-button {
display: block;
width: 30px; width: 30px;
height: auto; height: auto;
border: 2px outset #1da1f2;
background: #1da1f2;
margin: 2px;
img {
width: 30px;
height: auto;
}
} }
.social-button:hover { }
filter: brightness(110%); .social-button:hover {
filter: brightness(110%);
}
.social-button:active {
border-style: inset;
img {
} }
.social-button:active { }
border-style: inset; </style>
img { </div>
} <div class="side-card side-card-bottom">
} <div class="side-card-inner">
</style> <span> Last updated: 09&#x2F;16&#x2F;25 </span>
</div>
<div class="side-card side-card-bottom">
<div class="side-card-inner">
<span> Last updated: 09&#x2F;16&#x2F;25 </span>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<hr style="width: 97%; border-radius: 100px" /> </div>
<center> <hr style="width: 97%; border-radius: 100px" />
<a href="https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=CduP0196TYs" <center>
><img <a>meow</a>
class="web-button" </center>
src="https://doloro.co.uk/assets/webStamps/viscous_comp.gif" <hr style="width: 92%; border-radius: 100px" />
/></a <footer>
> <h2>Doloro, All Meows Reserved.</h2>
<a </footer>
><img
class="web-button"
src="https://doloro.co.uk/assets/webStamps/catgirl.gif"
/></a
>
<a href="https:&#x2F;&#x2F;doloro.co.uk&#x2F;"
><img
class="web-button"
src="https://doloro.co.uk/assets/webStamps/doloro.png"
/></a
>
<a href="https:&#x2F;&#x2F;joelgc.com&#x2F;"
><img
class="web-button"
src="https://doloro.co.uk/assets/webStamps/ena.png"
/></a
>
<a href="https:&#x2F;&#x2F;kernel.org&#x2F;"
><img
class="web-button"
src="https://doloro.co.uk/assets/webStamps/linux.png"
/></a
>
<a href="https:&#x2F;&#x2F;rainworldgame.com&#x2F;"
><img
class="web-button"
src="https://doloro.co.uk/assets/webStamps/rainworld.gif"
/></a
>
<a
href="https:&#x2F;&#x2F;developer.valvesoftware.com&#x2F;wiki&#x2F;Source"
><img
class="web-button"
src="https://doloro.co.uk/assets/webStamps/source.webp"
/></a
>
<a href="https:&#x2F;&#x2F;celery.dog&#x2F;"
><img
class="web-button"
src="https://doloro.co.uk/assets/webStamps/celery_dog.gif"
/></a
>
</center>
<hr style="width: 92%; border-radius: 100px" />
<footer>
<h2>Doloro, All Meows Reserved.</h2>
</footer>
</body>
<style>
html {
line-height: 1.5;
color: white;
--primary: #0d2222;
--secondary: #054f3f;
--thirdly: #043b2f;
--accent-1: #9f8083;
--accent-2: #66232e;
--accent-3: #44131a;
}
nav {
width: 100%;
height: 32px;
background-color: var(--accent-2);
border: 3px, outset, var(--accent-3);
align-content: center;
font-size: 18px;
a {
padding: 5px;
color: #9f8083;
}
a:hover {
color: #043b2f;
}
}
body {
background-image: url("/bg.png");
margin: 40px auto;
max-width: 1280px;
}
.container {
}
header {
text-align: center;
h1 {
display: block;
font-size: 2em;
margin-block-start: 0.37em;
margin-block-end: 0.37em;
margin-inline-start: 0px;
margin-inline-end: 0px;
font-weight: bold;
unicode-bidi: isolate;
}
}
footer {
text-align: center;
}
.body_of_funny_content {
display: flex;
flex-direction: row;
}
.left-sidebar {
margin: 5px;
margin-left: 0px;
height: 800px;
width: 125px;
background-color: var(--secondary);
border-style: inset;
border: 2px, inset, var(--thirdly);
box-sizing: border-box;
}
.right-sidebar {
margin: 5px;
margin-right: 0px;
height: 800px;
width: 125px;
background-color: var(--secondary);
border: 2px, inset, var(--thirdly);
box-sizing: border-box;
}
.actual-content {
flex: 1;
background-color: var(--primary);
margin: 5px;
}
.sticky_top {
position: sticky;
top: 5px;
}
.a_bit_of_padding {
padding: 12px;
}
.stamp_holder {
justify-content: center;
flex-grow: 0;
display: flex;
flex-wrap: wrap;
align-items: flex-end;
image-rendering: pixelated;
gap: 1px;
}
</style>
src/routes/+page.svelte
+1 -2
View File
@@ -1,2 +1 @@
<h1>Welcome to SvelteKit</h1> <p>home</p>
<p>Visit <a href="https://svelte.dev/docs/kit">svelte.dev/docs/kit</a> to read the documentation</p>
static/shared.css
+92
View File
@@ -0,0 +1,92 @@
:root {
line-height: 1.5;
color: white;
--primary: #0d2222;
--secondary: #054f3f;
--thirdly: #043b2f;
--accent-1: #9f8083;
--accent-2: #66232e;
--accent-3: #44131a;
}
nav {
width: 100%;
height: 32px;
background-color: var(--accent-2);
border: 3px, outset, var(--accent-3);
align-content: center;
font-size: 18px;
a {
padding: 5px;
color: #9f8083;
}
a:hover {
color: #043b2f;
}
}
body {
background-image: url("/bg.png");
margin: 40px auto;
max-width: 1280px;
}
.container {
}
header {
text-align: center;
h1 {
display: block;
font-size: 2em;
margin-block-start: 0.37em;
margin-block-end: 0.37em;
margin-inline-start: 0px;
margin-inline-end: 0px;
font-weight: bold;
unicode-bidi: isolate;
}
}
footer {
text-align: center;
}
.body_of_funny_content {
display: flex;
flex-direction: row;
}
.left-sidebar {
margin: 5px;
margin-left: 0px;
height: 800px;
width: 125px;
background-color: var(--secondary);
border-style: inset;
border: 2px, inset, var(--thirdly);
box-sizing: border-box;
}
.right-sidebar {
margin: 5px;
margin-right: 0px;
height: 800px;
width: 125px;
background-color: var(--secondary);
border: 2px, inset, var(--thirdly);
box-sizing: border-box;
}
.actual-content {
flex: 1;
background-color: var(--primary);
margin: 5px;
}
.sticky_top {
position: sticky;
top: 5px;
}
.a_bit_of_padding {
padding: 12px;
}
.stamp_holder {
justify-content: center;
flex-grow: 0;
display: flex;
flex-wrap: wrap;
align-items: flex-end;
image-rendering: pixelated;
gap: 1px;
}