main page wip

This commit is contained in:
2026-01-28 23:48:00 +00:00
parent c6453c61a2
commit 304364524f
10 changed files with 1079 additions and 441 deletions

View File

@@ -9,6 +9,7 @@
mkShell { mkShell {
buildInputs = [ buildInputs = [
pnpm pnpm
nodejs
]; ];
shellHook = '' shellHook = ''

View File

@@ -15,6 +15,8 @@
"@sveltejs/adapter-static": "^3.0.10", "@sveltejs/adapter-static": "^3.0.10",
"@sveltejs/kit": "^2.50.1", "@sveltejs/kit": "^2.50.1",
"@sveltejs/vite-plugin-svelte": "^6.2.4", "@sveltejs/vite-plugin-svelte": "^6.2.4",
"prettier": "^3.8.1",
"prettier-plugin-svelte": "^3.4.1",
"svelte": "^5.48.2", "svelte": "^5.48.2",
"svelte-check": "^4.3.5", "svelte-check": "^4.3.5",
"typescript": "^5.9.3", "typescript": "^5.9.3",

1098
pnpm-lock.yaml generated

File diff suppressed because it is too large Load Diff

View File

@@ -1,5 +1,5 @@
<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>
@@ -8,4 +8,303 @@
<link rel="icon" href={favicon} /> <link rel="icon" href={favicon} />
</svelte:head> </svelte:head>
{@render children()} <body>
<div class="container">
<header>
<h1>Doloro's corner of the inter-webs</h1>
<nav class="nav">
<a href="&#x2F;">Home</a>
<a href="&#x2F;plogs&#x2F;">Posts</a>
<a href="&#x2F;about&#x2F;">About</a>
</nav>
</header>
<div class="body_of_funny_content">
<div class="left-sidebar a_bit_of_padding">
<style>
.side-card {
background-color: var(--thirdly);
border: 2px, inset, var(--thirdly);
}
.side-card + .side-card {
margin-top: 5px;
}
.side-card-inner {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: small;
}
.side-card-bottom {
align-self: flex-end;
}
</style>
<div class="left-sidebar-inner sticky_top">
<div>
<div class="side-card">meow</div>
</div>
</div>
</div>
<div class="actual-content">
<center>
<div class="meow">
<img src="https://doloro.co.uk/assets/work_in_progress/wip2.gif" />
<img src="https://doloro.co.uk/assets/work_in_progress/wip2.gif" />
</div>
<img src="https://doloro.co.uk/assets/work_in_progress/wip.gif" />
<div class="meow">
<img src="https://doloro.co.uk/assets/work_in_progress/wip2.gif" />
<img src="https://doloro.co.uk/assets/work_in_progress/wip2.gif" />
</div>
</center>
<style>
.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>
<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;
height: auto;
border: 2px outset #1da1f2;
background: #1da1f2;
margin: 2px;
img {
width: 30px;
height: auto;
}
}
.social-button:hover {
filter: brightness(110%);
}
.social-button:active {
border-style: inset;
img {
}
}
</style>
</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>
<hr style="width: 97%; border-radius: 100px" />
<center>
<a href="https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=CduP0196TYs"
><img
class="web-button"
src="https://doloro.co.uk/assets/webStamps/viscous_comp.gif"
/></a
>
<a
><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>

BIN
static/bg.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 687 B

View File

@@ -1,4 +1,4 @@
import adapter from '@sveltejs/adapter-static'; import adapter from "@sveltejs/adapter-static";
/** @type {import('@sveltejs/kit').Config} */ /** @type {import('@sveltejs/kit').Config} */
const config = { kit: { adapter: adapter() } }; const config = { kit: { adapter: adapter() } };

View File

@@ -1,6 +1,6 @@
import { sveltekit } from '@sveltejs/kit/vite'; import { sveltekit } from "@sveltejs/kit/vite";
import { defineConfig } from 'vite'; import { defineConfig } from "vite";
export default defineConfig({ export default defineConfig({
plugins: [sveltekit()] plugins: [sveltekit()],
}); });