Compare commits
5 commits
main
...
sidebar-re
| Author | SHA1 | Date | |
|---|---|---|---|
| d376e04015 | |||
1945abd6ad
|
|||
|
19b436ead1
|
|||
|
790147ea05
|
|||
|
cb5ba4fb82
|
93 changed files with 1723 additions and 2195 deletions
6
_src/_data/icon.json
Normal file
6
_src/_data/icon.json
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
{
|
||||
"blog": "m5 3h15l7 7v20H5zm5 22h12v-3H10zm0-6h12v-3H10zm0-6h9v-3h-9z",
|
||||
"changelog": "M10 25H21V22H10Zm4-13H10v3h4v4h3V15h4V12H17V8H14ZM5 3H20l7 7V30H5Z",
|
||||
"gallery": "M2 2V30H30V2H2M5 26l6-9 5 6 5-9 6 12H5",
|
||||
"home": "M20 20V30h8V12L16 2 4 12V30h8V20Z"
|
||||
}
|
||||
|
|
@ -1,142 +0,0 @@
|
|||
{
|
||||
"items": [
|
||||
{
|
||||
"artist": "2 Mello",
|
||||
"cover": "2-mello_sounds-of-tokyo-to-future.png",
|
||||
"src": "https://2mellomakes.bandcamp.com/album/sounds-of-tokyo-to-future",
|
||||
"title": "Sounds of Tokyo-To Future"
|
||||
},
|
||||
{
|
||||
"artist": "6no",
|
||||
"cover": "6no_final-6no.png",
|
||||
"src": "https://b9-6no.bandcamp.com/album/final-6no",
|
||||
"title": "FINAL 6NO"
|
||||
},
|
||||
{
|
||||
"artist": "Baths",
|
||||
"cover": "baths_cerulean.png",
|
||||
"src": "https://bathsmusic.bandcamp.com/album/cerulean",
|
||||
"title": "Cerulean"
|
||||
},
|
||||
{
|
||||
"artist": "Bôa",
|
||||
"cover": "boa_the-race-of-a-thousand-camels.png",
|
||||
"src": "https://musicbrainz.org/release-group/2b81ce5f-7b48-3f75-a714-cbab421db712",
|
||||
"title": "The Race of a Thousand Camels"
|
||||
},
|
||||
{
|
||||
"artist": "Duran Duran",
|
||||
"cover": "duran-duran_1993.png",
|
||||
"src": "https://musicbrainz.org/release-group/faedc66c-59ae-36ee-a89d-9dda4a9ea393",
|
||||
"title": "The Wedding Album"
|
||||
},
|
||||
{
|
||||
"artist": "Everything Everything",
|
||||
"cover": "everything-everything_man-alive.png",
|
||||
"src": "https://musicbrainz.org/release-group/053c59e7-2277-4187-ae85-3294923dc9ab",
|
||||
"title": "Man Alive"
|
||||
},
|
||||
{
|
||||
"artist": "Funk Fiction",
|
||||
"cover": "funk-fiction_sonic-beats.png",
|
||||
"src": "https://funkfiction.bandcamp.com/album/sonic-beats",
|
||||
"title": "Sonic BeATS"
|
||||
},
|
||||
{
|
||||
"artist": "goreshit",
|
||||
"cover": "goreshit_gnb.png",
|
||||
"src": "https://goreshit.bandcamp.com/album/gnb",
|
||||
"title": "gnb"
|
||||
},
|
||||
{
|
||||
"artist": "goreshit",
|
||||
"cover": "goreshit_goretrance-9.png",
|
||||
"src": "https://goreshit.bandcamp.com/album/goretrance-9",
|
||||
"title": "goretrance 9"
|
||||
},
|
||||
{
|
||||
"artist": "goreshit",
|
||||
"cover": "goreshit_stankface.png",
|
||||
"src": "https://goreshit.bandcamp.com/album/stankface",
|
||||
"title": "stankface"
|
||||
},
|
||||
{
|
||||
"artist": "Kaito",
|
||||
"cover": "kaito_a-hundred-million-light-years.png",
|
||||
"src": "https://kaitokompakt.bandcamp.com/album/a-hundred-million-light-years",
|
||||
"title": "A Hundred Million Light Years"
|
||||
},
|
||||
{
|
||||
"artist": "Lifeformed & Janice Kwan",
|
||||
"cover": "tunic.png",
|
||||
"src": "https://lifeformed.bandcamp.com/album/tunic-original-game-soundtrack",
|
||||
"title": "TUNIC"
|
||||
},
|
||||
{
|
||||
"artist": "Linkin Park",
|
||||
"cover": "linkin-park_hybrid-theory.png",
|
||||
"src": "https://musicbrainz.org/release-group/b5b4bb4b-8ba5-3acf-88cb-4cae2699d8da",
|
||||
"title": "Hybrid Theory"
|
||||
},
|
||||
{
|
||||
"artist": "Linkin Park",
|
||||
"cover": "linkin-park_meteora.png",
|
||||
"src": "https://musicbrainz.org/release-group/09474d62-17dd-3a4f-98fb-04c65f38a479",
|
||||
"title": "Meteora"
|
||||
},
|
||||
{
|
||||
"artist": "Madeon",
|
||||
"cover": "madeon_adventure.png",
|
||||
"src": "https://musicbrainz.org/release-group/5613f475-9235-49cd-bcfb-d69c196d91a7",
|
||||
"title": "Adventure"
|
||||
},
|
||||
{
|
||||
"artist": "Pendulum",
|
||||
"cover": "pendulum_hold-your-colour.png",
|
||||
"src": "https://musicbrainz.org/release-group/8ec197ee-a888-32d7-acb5-0fac3e95e263",
|
||||
"title": "Hold your Colour"
|
||||
},
|
||||
{
|
||||
"artist": "Pendulum",
|
||||
"cover": "pendulum_immersion.png",
|
||||
"src": "https://musicbrainz.org/release-group/320df089-f656-433d-add7-605d06800852",
|
||||
"title": "Immersion"
|
||||
},
|
||||
{
|
||||
"artist": "Pete Rock",
|
||||
"cover": "pete-rock_petestrumentals.png",
|
||||
"src": "https://peterock.bandcamp.com/album/petestrumentals",
|
||||
"title": "Petestrumentals"
|
||||
},
|
||||
{
|
||||
"artist": "Redeyes",
|
||||
"cover": "redeyes_poetry-in-motion.png",
|
||||
"src": "https://spearheadrecords.bandcamp.com/album/poetry-in-motion",
|
||||
"title": "Poetry in Motion"
|
||||
},
|
||||
{
|
||||
"artist": "T.H.C.",
|
||||
"cover": "thc_adagio.png",
|
||||
"src": "https://georgesarah.bandcamp.com/album/t-h-c-adagio",
|
||||
"title": "Adagio"
|
||||
},
|
||||
{
|
||||
"artist": "Vince Kaichan",
|
||||
"cover": "vince-kaichan_tracker-works.png",
|
||||
"src": "https://vincekaichan.bandcamp.com/album/tracker-works-2014-2018",
|
||||
"title": "Tracker Works 2014-2018"
|
||||
},
|
||||
{
|
||||
"artist": "Various artists",
|
||||
"cover": "jet-set-radio-future.png",
|
||||
"src": "https://jetsetradiofuture.live/",
|
||||
"title": "Jet Set Radio Future"
|
||||
},
|
||||
{
|
||||
"artist": "Various artists",
|
||||
"cover": "lethal-league-blaze.png",
|
||||
"src": "https://store.steampowered.com/app/991870/Lethal_League_Blaze__Soundtrack/",
|
||||
"title": "Lethal League Blaze"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,154 +0,0 @@
|
|||
{
|
||||
"items": [
|
||||
{
|
||||
"artist": "Axel & Cerror",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=206301",
|
||||
"title": "It's been a while",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Elysis",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=41767",
|
||||
"title": "Codelover",
|
||||
"tracker": "impulsetracker"
|
||||
},
|
||||
{
|
||||
"artist": "Fearofdark",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=169104",
|
||||
"title": "Surfing on a Sine Wave",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Hoffman",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=96582",
|
||||
"title": "burt & ernie",
|
||||
"tracker": "modplug"
|
||||
},
|
||||
{
|
||||
"artist": "Jereon Tel (WAVE)",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=46490",
|
||||
"title": "Hello 1997",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Jereon Tel (WAVE)",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=46496",
|
||||
"title": "Letting Go",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Michiel van den Bos",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=68847",
|
||||
"title": "Foregone Destruction",
|
||||
"tracker": "impulsetracker"
|
||||
},
|
||||
{
|
||||
"artist": "Michiel van den Bos",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=68859",
|
||||
"title": "Skyward Fire",
|
||||
"tracker": "impulsetracker"
|
||||
},
|
||||
{
|
||||
"artist": "Minomus & Libris",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=32525",
|
||||
"title": "Stardust & Sparkles",
|
||||
"tracker": "modplug"
|
||||
},
|
||||
{
|
||||
"artist": "Nagz & Genius",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=189549",
|
||||
"title": "Keep On",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Norfair",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=146774",
|
||||
"title": "Falling Flakes",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Radix",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=169628",
|
||||
"title": "Feng Shui Schematics",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Radix",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=148483",
|
||||
"title": "Yendi",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Radix",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=167157",
|
||||
"title": "Yuki Satellites",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Reed",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=120849",
|
||||
"title": "Twentyfour and Up",
|
||||
"tracker": "modplug"
|
||||
},
|
||||
{
|
||||
"artist": "Quazar",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=66187",
|
||||
"title": "Funky Stars (Hybrid song)",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Skybax",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=202163",
|
||||
"title": "Marmelade Dream",
|
||||
"tracker": "impulsetracker"
|
||||
},
|
||||
{
|
||||
"artist": "Tempest",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=66334",
|
||||
"title": "Acidjazzed Evening",
|
||||
"tracker": "modplug"
|
||||
},
|
||||
{
|
||||
"artist": "Virt",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=204060",
|
||||
"title": "Keep the World Spinning",
|
||||
"tracker": "impulsetracker"
|
||||
},
|
||||
{
|
||||
"artist": "Virt",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=181523",
|
||||
"title": "Nightfall over the City",
|
||||
"tracker": "impulsetracker"
|
||||
},
|
||||
{
|
||||
"artist": "Wire",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=66757",
|
||||
"title": "Prehistoric Tale",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Zalza",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=66539",
|
||||
"title": "My Blue Hashpipe",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Zalza",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=154062",
|
||||
"title": "Sysop's Secrets",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Zipp",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=154265",
|
||||
"title": "Manipulated",
|
||||
"tracker": "fasttracker2"
|
||||
},
|
||||
{
|
||||
"artist": "Zipp",
|
||||
"src": "https://modarchive.org/index.php?request=view_player&query=38138",
|
||||
"title": "White Coffee",
|
||||
"tracker": "fasttracker2"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,4 +1,11 @@
|
|||
{
|
||||
"listenbrainz": [
|
||||
{
|
||||
"icon": "listenbrainz.svg",
|
||||
"title": "ListenBrainz",
|
||||
"src": "https://listenbrainz.org/user/sunbun"
|
||||
}
|
||||
],
|
||||
"mastodon": [
|
||||
{
|
||||
"icon": "mastodon.svg",
|
||||
|
|
@ -8,7 +15,7 @@
|
|||
"matrix": [
|
||||
{
|
||||
"icon": "matrix.svg",
|
||||
"src": "https://matrix.to/#/@fossilisk:matrix.org"
|
||||
"src": "https://matrix.to/#/@sundae:bunsin.space"
|
||||
}
|
||||
],
|
||||
"neocities": [
|
||||
|
|
@ -32,6 +39,7 @@
|
|||
"youtube": [
|
||||
{
|
||||
"icon": "youtube.svg",
|
||||
"title": "YouTube",
|
||||
"src": "https://youtube.com/channel/UCE4xk4hn-M1d4w56F-TydFw"
|
||||
}
|
||||
]
|
||||
|
|
|
|||
6
_src/_data/svg.json
Normal file
6
_src/_data/svg.json
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
{
|
||||
"paw": "m 15.700739,16.184194 c 0,4.483 -2.555,2.038 -5.7060001,2.038 -3.151,0 -5.706,2.445 -5.706,-2.038 0,-2.925 2.555,-6.113001 5.706,-6.113001 3.1510001,0 5.7060001,3.188001 5.7060001,6.113001 z M 4.0687389,8.1071934 c 0.394,1.336 0.007,2.6259996 -0.862,2.8819996 -0.87,0.256001 -1.8929999,-0.619 -2.28599993,-1.9539996 -0.393,-1.336 -0.007,-2.626 0.86199993,-2.882 0.87,-0.256 1.893,0.619 2.286,1.954 z m 15.0000001,0.945 c -0.407,1.3319996 -1.442,2.1960006 -2.312,1.9299996 -0.869,-0.266 -1.244,-1.5609996 -0.837,-2.8919996 0.407,-1.332 1.442,-2.196 2.312,-1.93 0.869,0.265 1.244,1.56 0.837,2.892 z m -10.1100001,-4.859 c 0.365,1.897 -0.218,3.606 -1.302,3.814 -1.085,0.209 -2.261,-1.16 -2.626,-3.059 -0.365,-1.898 0.218,-3.6060001 1.302,-3.8150001 1.085,-0.20799996 2.261,1.1620001 2.626,3.0600001 z m 5.9960001,0.778 c -0.388,1.893 -1.578,3.25 -2.66,3.029 -1.082,-0.222 -1.647,-1.937 -1.26,-3.83 0.388,-1.894 1.578,-3.25000006 2.66,-3.0290001 1.082,0.222 1.647,1.9370001 1.26,3.8300001 z",
|
||||
"back": "M2 16 18 4h6L12 14H50v4H12L24 28H18Z",
|
||||
"theme": "M16 6a1 1 0 010 20Zm0-4a1 1 0 000 28A1 1 0 0016 2",
|
||||
"menu": "M4 8H28v3H4Zm0 7H28v3H4Zm0 7H28v3H4Z"
|
||||
}
|
||||
|
|
@ -1,140 +1,59 @@
|
|||
---
|
||||
paw: "m 15.700739,16.184194 c 0,4.483 -2.555,2.038 -5.7060001,2.038 -3.151,0 -5.706,2.445 -5.706,-2.038 0,-2.925 2.555,-6.113001 5.706,-6.113001 3.1510001,0 5.7060001,3.188001 5.7060001,6.113001 z M 4.0687389,8.1071934 c 0.394,1.336 0.007,2.6259996 -0.862,2.8819996 -0.87,0.256001 -1.8929999,-0.619 -2.28599993,-1.9539996 -0.393,-1.336 -0.007,-2.626 0.86199993,-2.882 0.87,-0.256 1.893,0.619 2.286,1.954 z m 15.0000001,0.945 c -0.407,1.3319996 -1.442,2.1960006 -2.312,1.9299996 -0.869,-0.266 -1.244,-1.5609996 -0.837,-2.8919996 0.407,-1.332 1.442,-2.196 2.312,-1.93 0.869,0.265 1.244,1.56 0.837,2.892 z m -10.1100001,-4.859 c 0.365,1.897 -0.218,3.606 -1.302,3.814 -1.085,0.209 -2.261,-1.16 -2.626,-3.059 -0.365,-1.898 0.218,-3.6060001 1.302,-3.8150001 1.085,-0.20799996 2.261,1.1620001 2.626,3.0600001 z m 5.9960001,0.778 c -0.388,1.893 -1.578,3.25 -2.66,3.029 -1.082,-0.222 -1.647,-1.937 -1.26,-3.83 0.388,-1.894 1.578,-3.25000006 2.66,-3.0290001 1.082,0.222 1.647,1.9370001 1.26,3.8300001 z"
|
||||
back: "M2 16 18 4h6L12 14H50v4H12L24 28H18Z"
|
||||
theme: "M16 6a1 1 0 010 20Zm0-4a1 1 0 000 28A1 1 0 0016 2"
|
||||
---
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
{%set currentPage = page.url.split('/')[1]|slugify%}
|
||||
{%set pageOrder = collections.pages|sort(attribute='data.order')%}
|
||||
{%set availableStyles = ['home', 'blog', 'gallery']%}
|
||||
<head>
|
||||
<title>
|
||||
{% if page.url.split('/') %}
|
||||
{%if page.url.split('/')%}
|
||||
{{ page.url.split('/')[1] }} -
|
||||
{% if page.url.split('/')[2] %}
|
||||
{{ page.url.split('/')[2] | replace("-", " ") }} |
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{{ site.name | safe }}
|
||||
{%if page.url.split('/')[2]%}
|
||||
{{ page.url.split('/')[2]|replace("-", " ") }} |
|
||||
{%endif%}
|
||||
{%endif%}
|
||||
{{ site.name|safe }}
|
||||
</title>
|
||||
{% include "meta.njk" %}
|
||||
<link rel="icon" href="/assets/img/icon/sundae.png">
|
||||
<link rel="stylesheet" href="/assets/css/reset.css">
|
||||
<link rel="stylesheet" href="/assets/css/default/default.css">
|
||||
<link rel="preload" href="/assets/css/citrus/default.css" as="style">
|
||||
<link rel="stylesheet" href="/assets/css/default/system.css" id="themed">
|
||||
{% if page.url === "/home/" %}
|
||||
<link rel="stylesheet" href="/assets/css/pokesprite-pokemon-gen8.css">
|
||||
{% endif %}
|
||||
{% set availableStyles = ['home', 'blog', 'gallery'] %}
|
||||
{% if page.url %}
|
||||
{% if availableStyles.indexOf(page.url.split('/')[1]|slugify) !== -1 %}
|
||||
<link rel="stylesheet" href="/assets/css/default/{{ page.url.split('/')[1]|slugify }}.css">
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{%include "meta.njk"%}
|
||||
{%include "stylesheets.njk"%}
|
||||
</head>
|
||||
<body id="{{ page.url.split('/')[1]|slugify }}">
|
||||
<nav>
|
||||
<details open="">
|
||||
<summary>
|
||||
Navigation
|
||||
</summary>
|
||||
{% set currentUrl %}{{ page.url }}{% endset %}
|
||||
{% set sortedPages = collections.pages|sort(attribute='data.order') %}
|
||||
<ul role="list">
|
||||
<li>
|
||||
<a href="../">
|
||||
<svg viewbox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
|
||||
<path d="{{ back }}"></path>
|
||||
</svg>
|
||||
Back
|
||||
</a>
|
||||
</li>
|
||||
{% for page in sortedPages %}
|
||||
<li>
|
||||
<a href="{{ page.url }}" {% if currentUrl.split('/')[1] === page.url.split('/')[1]|slugify %} aria-current="page" {% endif %}>
|
||||
<svg viewbox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
|
||||
<path d="{{ page.data.icon }}"></path>
|
||||
</svg>
|
||||
{{ page.data.title }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
<details open="">
|
||||
<summary>
|
||||
Options
|
||||
</summary>
|
||||
<ul role="list">
|
||||
<li>
|
||||
<button id="theme-toggle">
|
||||
<svg viewbox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
|
||||
<path d="{{ theme }}">
|
||||
</svg>
|
||||
Toggle theme
|
||||
</button>
|
||||
</li>
|
||||
</li>
|
||||
</ul>
|
||||
<script src="/assets/js/theme.js"></script>
|
||||
</details>
|
||||
<details open="">
|
||||
<summary>
|
||||
Outgoing
|
||||
</summary>
|
||||
<ul role="list">
|
||||
{% for key, items in outgoing %}
|
||||
{% for item in items %}
|
||||
{% if key != "signal" %}
|
||||
<li>
|
||||
<a href="{{ item.src }}">
|
||||
<img src="/assets/img/icon/{{ item.icon }}" alt="" aria-hidden="true">{{ key | capitalize }}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% if key == "signal" %}
|
||||
<li>
|
||||
<button command="show-modal" commandfor="{{ items[0].id }}">
|
||||
<img src="/assets/img/icon/{{ items[0].icon }}" alt="" aria-hidden="true">{{ key | capitalize }}
|
||||
</button>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<body id="{{ currentPage }}">
|
||||
<dialog id="signal">
|
||||
<article>
|
||||
{% for article in collections.articles %}
|
||||
{% if article.fileSlug == 'what' %}
|
||||
{{ article.content | safe }}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% include "../data/articles/what.html" %}
|
||||
</article>
|
||||
</dialog>
|
||||
</details>
|
||||
<script src="/assets/js/what.js" type="module"></script>
|
||||
<script src="/assets/js/details-save.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
</nav>
|
||||
<header>
|
||||
<nav class="navbar" id="floating">
|
||||
{%include "nav-misc.njk"%}
|
||||
</nav>
|
||||
<div id="sidebar" popover="">
|
||||
<nav class="navbar" id="default">
|
||||
{%include "nav-misc.njk"%}
|
||||
{%include "nav.njk"%}
|
||||
</nav>
|
||||
</div>
|
||||
<header>
|
||||
<h1>
|
||||
{% for page in sortedPages %}
|
||||
{% if currentUrl.split('/')[1] === page.url.split('/')[1]|slugify %}
|
||||
<a href="{{page.url}}">
|
||||
{%for page in pageOrder%}
|
||||
{%if page.url|slugify == currentPage%}
|
||||
<svg viewbox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
|
||||
<path d="{{ page.data.icon }}"></path>
|
||||
<path d="{{icon[page.url|slugify]}}"></path>
|
||||
</svg>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{{ page.url.split('/')[1]|slugify|capitalize }}
|
||||
{%endif%}
|
||||
{%endfor%}
|
||||
{{ currentPage | capitalize }}
|
||||
</a>
|
||||
</h1>
|
||||
</header>
|
||||
<main>
|
||||
{{ content | safe }}
|
||||
</main>
|
||||
<footer>
|
||||
</header>
|
||||
<main>
|
||||
{{ content|safe }}
|
||||
</main>
|
||||
<footer>
|
||||
<span id="message" aria-label="Random footer message">made with love</span>
|
||||
<script src="/assets/js/footer.js"></script>
|
||||
</footer>
|
||||
</body>
|
||||
</footer>
|
||||
<script src="/assets/js/what.js" type="module"></script>
|
||||
<script src="/assets/js/theme.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
---
|
||||
layout: base
|
||||
---
|
||||
|
||||
<article>
|
||||
{{content|safe}}
|
||||
<section class="postscript">
|
||||
|
|
|
|||
25
_src/_includes/gallery-cat.njk
Normal file
25
_src/_includes/gallery-cat.njk
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
<li>
|
||||
<a href="{{ item.page.url }}">
|
||||
{% if item.data.images[0] %}
|
||||
<figure>
|
||||
<img
|
||||
src="{{ item.data.images[0].src }}"
|
||||
alt=""
|
||||
style="{% if item.data.images[0].pixel %}image-rendering:pixelated;{% endif %}
|
||||
{% if item.data.images[0].position %}object-position:{{ item.data.images[0].position }};{% endif %}
|
||||
{% if item.data.images[0].fit %}object-fit:{{ item.data.images[0].fit }};{% endif %}">
|
||||
<figcaption>
|
||||
{{ item.page.fileSlug }}
|
||||
{% if item.data.images.length > 1 %}
|
||||
<p class="count">(+{{ item.data.images.length| minus: 1 }})</p>
|
||||
{% endif %}
|
||||
</figcaption>
|
||||
{% if item.data.images[0].date %}
|
||||
<time datetime="{{ item.data.images[0].date | ISO }}">
|
||||
{{ item.data.images[0].date | readable }}
|
||||
</time>
|
||||
{% endif %}
|
||||
</figure>
|
||||
{% endif %}
|
||||
</a>
|
||||
</li>
|
||||
|
|
@ -1,56 +1,57 @@
|
|||
---
|
||||
layout: base
|
||||
---
|
||||
|
||||
<article id="art">
|
||||
<h1>{{ page.fileSlug }}
|
||||
{% for flag in flags %}
|
||||
<img src="{{ flag.src }}">
|
||||
{% endfor %}
|
||||
<div>
|
||||
<h1>{{page.fileSlug}}
|
||||
{%for flag in flags%}
|
||||
<img src="{{flag.src}}">
|
||||
{%endfor%}
|
||||
</h1>
|
||||
{{ content|safe }}
|
||||
{% if programs and programs|length > 0 %}
|
||||
{{content|safe}}
|
||||
{%if programs and programs|length > 0%}
|
||||
<p>Made with:</p>
|
||||
<ul>
|
||||
{% for program in programs %}
|
||||
<ul class="paws">
|
||||
{%for program in programs%}
|
||||
<li>
|
||||
{{ program.name | link(program.src) | safe }}
|
||||
{{program.name|link(program.src)|safe}}
|
||||
</li>
|
||||
{% endfor %}
|
||||
{%endfor%}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if palettes and palettes|length > 0 %}
|
||||
{%endif%}
|
||||
{%if palettes and palettes|length > 0%}
|
||||
<p>Color palette used:</p>
|
||||
{% for palette in palettes %}
|
||||
<ul>
|
||||
{%for palette in palettes%}
|
||||
<ul class="paws">
|
||||
<li>
|
||||
{% if palette.src %}
|
||||
{{ palette.name | link(palette.src) | safe }}
|
||||
{% endif %}
|
||||
{%if palette.src%}
|
||||
{{palette.name|link(palette.src)|safe}}
|
||||
{%endif%}
|
||||
</li>
|
||||
</ul>
|
||||
{% endfor %}
|
||||
{%endfor%}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{%endif%}
|
||||
</div>
|
||||
<section>
|
||||
{% for image in images %}
|
||||
<a href="{{ image.src }}">
|
||||
{%for image in images%}
|
||||
<a href="{{image.src}}">
|
||||
<figure>
|
||||
<img src="{{ image.src }}" alt="" {% if image.pixel %} style="image-rendering: pixelated" {% endif %}>
|
||||
<figcaption>{{ image.alt }}</figcaption>
|
||||
<time datetime="{{ image.date|ISO }}">{{ image.date|readable }}</time>
|
||||
<img src="{{image.src}}" alt="" {%if image.pixel%} style="image-rendering: pixelated" {%endif%}>
|
||||
<figcaption>{{image.alt}}</figcaption>
|
||||
<time datetime="{{image.date|ISO}}"><b>{{image.date|readable}}</b></time>
|
||||
</figure>
|
||||
</a>
|
||||
{% endfor %}
|
||||
{%endfor%}
|
||||
</section>
|
||||
{% for attachment in attachments %}
|
||||
{%for attachment in attachments%}
|
||||
<section class="attachment">
|
||||
<a href="{{ attachment.src }}">
|
||||
<a href="{{attachment.src}}">
|
||||
<figure>
|
||||
<img src="{{ attachment.src }}">
|
||||
<figcaption>{{ attachment.alt }}</figcaption>
|
||||
<img src="{{attachment.src}}">
|
||||
<figcaption>{{attachment.alt}}</figcaption>
|
||||
</figure>
|
||||
</a>
|
||||
</section>
|
||||
{% endfor %}
|
||||
</article>
|
||||
{%endfor%}
|
||||
</article>
|
||||
|
|
|
|||
25
_src/_includes/nav-misc.njk
Normal file
25
_src/_includes/nav-misc.njk
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
<ul role="list">
|
||||
<li>
|
||||
<button popovertarget="sidebar">
|
||||
<svg viewbox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
|
||||
<path d="{{svg.menu}}"></path>
|
||||
</svg>
|
||||
Toggle menu
|
||||
</button>
|
||||
<li>
|
||||
<button class="theme-toggle">
|
||||
<svg viewbox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
|
||||
<path d="{{svg.theme}}">
|
||||
</svg>
|
||||
Toggle theme
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../">
|
||||
<svg viewbox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
|
||||
<path d="{{svg.back}}"></path>
|
||||
</svg>
|
||||
Go back
|
||||
</a>
|
||||
<li>
|
||||
</ul>
|
||||
38
_src/_includes/nav.njk
Normal file
38
_src/_includes/nav.njk
Normal file
|
|
@ -0,0 +1,38 @@
|
|||
<section>
|
||||
<h3>Pages</h3>
|
||||
<ul role="list">
|
||||
{%for page in pageOrder%}
|
||||
<li>
|
||||
<a href="{{page.url}}" {%if page.url|slugify == currentPage%}aria-current="page"{%endif%}>
|
||||
<svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
|
||||
<path d="{{icon[page.url|slugify]}}"></path>
|
||||
</svg>
|
||||
{{page.fileSlug|capitalize}}
|
||||
</a>
|
||||
</li>
|
||||
{%endfor%}
|
||||
</ul>
|
||||
</section>
|
||||
<section>
|
||||
<h3>Outgoing</h3>
|
||||
<ul role="list">
|
||||
{%for key, items in outgoing%}
|
||||
{%for item in items%}
|
||||
{%if key != "signal"%}
|
||||
<li>
|
||||
<a href="{{item.src}}">
|
||||
<img src="/assets/img/icon/{{item.icon}}" alt="" aria-hidden="true">{%if item.title %}{{item.title}}{%else%}{{key|capitalize}}{%endif%}
|
||||
</a>
|
||||
</li>
|
||||
{%endif%}
|
||||
{%endfor%}
|
||||
{%if key == "signal"%}
|
||||
<li>
|
||||
<button command="show-modal" commandfor="{{items[0].id}}">
|
||||
<img src="/assets/img/icon/{{items[0].icon}}" alt="" aria-hidden="true">{{key|capitalize}}
|
||||
</button>
|
||||
</li>
|
||||
{%endif%}
|
||||
{%endfor%}
|
||||
</ul>
|
||||
</section>
|
||||
7
_src/_includes/stylesheets.njk
Normal file
7
_src/_includes/stylesheets.njk
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
<link rel="stylesheet" href="/assets/css/reset.css">
|
||||
<link rel="stylesheet" href="/assets/css/default/fallback.css">
|
||||
<link rel="preload" href="/assets/css/citrus/citrus.css" as="style">
|
||||
<link rel="stylesheet" href="/assets/css/default/system.css" id="themed">
|
||||
{%if currentPage === "home"%}
|
||||
<link rel="stylesheet" href="/assets/css/pokesprite-pokemon-gen8.css">
|
||||
{%endif%}
|
||||
|
|
@ -1,108 +0,0 @@
|
|||
#blog {
|
||||
background-attachment: local, fixed;
|
||||
background-color: var(--light);
|
||||
background-image: var(--dot),
|
||||
linear-gradient(var(--citrus-mix-dark) 0% 10%, var(--citrus-dark) 100%);
|
||||
background-size: 6px, contain;
|
||||
background-blend-mode: overlay, normal;
|
||||
animation: none;
|
||||
& article {
|
||||
border-radius: 0;
|
||||
background-color: var(--citrus-light);
|
||||
background-image: var(--noise);
|
||||
background-size: auto;
|
||||
background-repeat: repeat;
|
||||
box-shadow: inset 0 -2rem 3rem -4rem var(--dark), var(--shadow-heavy);
|
||||
& aside, .addendum {
|
||||
border-radius: 0;
|
||||
border-width: 4px;
|
||||
border-style: solid;
|
||||
}
|
||||
& aside {
|
||||
border-color: var(--citrus-mix-light);
|
||||
background-image: linear-gradient(135deg,
|
||||
var(--citrus-light-extra) 5%,
|
||||
var(--citrus-light) 50%, var(--citrus-light-extra)
|
||||
);
|
||||
}
|
||||
& .addendum {
|
||||
border-color: var(--citrus-primary);
|
||||
background-image: linear-gradient(135deg,
|
||||
var(--citrus-mix-light) 5%,
|
||||
var(--citrus-light) 50%, var(--citrus-mix-light)
|
||||
);
|
||||
}
|
||||
& pre {
|
||||
border-radius: 4px;
|
||||
color: var(--citrus-secondary);
|
||||
background-color: var(--citrus-dark-extra);
|
||||
background-size: 4px;
|
||||
}
|
||||
& .post-warning {
|
||||
background-color: var(--citrus-primary);
|
||||
}
|
||||
& s {
|
||||
text-decoration-color: #d00;
|
||||
}
|
||||
& .postscript {
|
||||
& span:has([alt]) {
|
||||
&::after {
|
||||
content: "";
|
||||
width: calc(var(--avatar) - 10px);
|
||||
height: calc(var(--avatar) - 10px);
|
||||
position: absolute;
|
||||
margin: 5px;
|
||||
background-image: linear-gradient(
|
||||
color-mix(in lch, var(--light), transparent),
|
||||
transparent
|
||||
);
|
||||
box-shadow: inset 0 0 2px 0 var(--dark);
|
||||
}
|
||||
}
|
||||
& [alt="Profile picture"] {
|
||||
color: unset;
|
||||
border-radius: inherit;
|
||||
border: 2px solid;
|
||||
border-image-source: linear-gradient(
|
||||
to bottom,
|
||||
var(--citrus-mix-light),
|
||||
var(--citrus-secondary)
|
||||
);
|
||||
border-image-slice: 1;
|
||||
border-width: 3px;
|
||||
box-sizing: inherit;
|
||||
padding: 2px;
|
||||
background-image: radial-gradient(
|
||||
ellipse at 50% -0%,
|
||||
var(--light) 20%,
|
||||
var(--dark) 150%
|
||||
),
|
||||
var(--pansexual);
|
||||
background-blend-mode: overlay, normal;
|
||||
background-size: cover, 100%;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
box-shadow: 0 0 0 2px var(--citrus-mix-dark),
|
||||
inset 0 0 0 2px var(--citrus-mix), var(--shadow-light);
|
||||
font-size: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
& #posts {
|
||||
& a {
|
||||
border-width: 4px;
|
||||
box-shadow: var(--shadow-light);
|
||||
border-radius: 0;
|
||||
& p {
|
||||
color: initial;
|
||||
}
|
||||
& p:not(:last-child) {
|
||||
color: var(--citrus-dark);
|
||||
}
|
||||
&:not(:hover, :focus) {
|
||||
background-color: var(--citrus-light);
|
||||
border-color: var(--citrus-light);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
203
_src/assets/css/citrus/citrus.css
Normal file
203
_src/assets/css/citrus/citrus.css
Normal file
|
|
@ -0,0 +1,203 @@
|
|||
@import url("./nav.css");
|
||||
@import url("./variables.css");
|
||||
|
||||
body {
|
||||
font-family: "Nosey Rodent";
|
||||
background-attachment: local;
|
||||
background-blend-mode: soft-light;
|
||||
background-color: var(--citrus-primary);
|
||||
background-image: var(--paw-tiled);
|
||||
background-repeat: repeat;
|
||||
background-size: 128px;
|
||||
color: var(--citrus-dark-extra);
|
||||
}
|
||||
main article {
|
||||
background:
|
||||
var(--noise),
|
||||
linear-gradient(
|
||||
var(--citrus-light) 70%,
|
||||
color-mix(in lch, var(--citrus-mix-light), var(--citrus-light)) 100%
|
||||
);
|
||||
box-shadow: var(--shadow-heavy);
|
||||
border-radius: 2px;
|
||||
& a,
|
||||
button {
|
||||
background-color: var(--citrus-mix-light);
|
||||
color: var(--citrus-dark);
|
||||
&:hover {
|
||||
background-color: var(--citrus-primary);
|
||||
}
|
||||
}
|
||||
& ul li::before {
|
||||
background-color: var(--citrus-dark-extra);
|
||||
}
|
||||
}
|
||||
#interests {
|
||||
& li {
|
||||
& a {
|
||||
& span:has(img)::after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&:nth-child(odd) {
|
||||
transform: var(--rot-minus);
|
||||
}
|
||||
}
|
||||
}
|
||||
#gallery {
|
||||
& main article {
|
||||
border-radius: 4px;
|
||||
box-shadow:
|
||||
inset 0 0 0 4px color-mix(in lch, var(--light), var(--dark) 2%),
|
||||
inset 0 0 0 8px var(--citrus-mix-dark),
|
||||
var(--shadow-heavy);
|
||||
background-color: color-mix(
|
||||
in lch,
|
||||
var(--citrus-mix-dark),
|
||||
var(--citrus-mix)
|
||||
);
|
||||
background-image:
|
||||
var(--noise),
|
||||
linear-gradient(
|
||||
135deg,
|
||||
color-mix(in lch, var(--citrus-mix-dark), var(--citrus-mix)),
|
||||
var(--citrus-mix-dark)
|
||||
);
|
||||
& a:has(figure) {
|
||||
transition:
|
||||
border-color var(--trans),
|
||||
background-color var(--trans);
|
||||
box-shadow: var(--shadow-light);
|
||||
&:is(:hover, :focus) {
|
||||
& figure {
|
||||
transition: inherit;
|
||||
border-color: currentColor;
|
||||
}
|
||||
}
|
||||
&:is(:not(:hover, :focus)) {
|
||||
border-color: var(--light);
|
||||
background-color: var(--light);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
:is(#art li, #art section a):nth-child(odd) {
|
||||
transform: var(--rot-minus);
|
||||
}
|
||||
#art div {
|
||||
background-color: var(--citrus-light);
|
||||
background-image: var(--noise), var(--paper);
|
||||
background-size: auto, 4px;
|
||||
box-shadow: var(--shadow-light);
|
||||
padding: var(--pad-xl);
|
||||
transform: var(--rot-plus);
|
||||
& p {
|
||||
line-height: 32px;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
#blog {
|
||||
animation: none;
|
||||
background-attachment: local, fixed;
|
||||
background-blend-mode: overlay, normal;
|
||||
background-color: var(--light);
|
||||
background-image:
|
||||
var(--dot),
|
||||
linear-gradient(var(--citrus-mix-dark) 0% 10%, var(--citrus-dark) 100%);
|
||||
background-size: 6px, contain;
|
||||
& main article {
|
||||
background-color: var(--citrus-light);
|
||||
background-image: var(--noise);
|
||||
background-repeat: repeat;
|
||||
background-size: auto;
|
||||
border-radius: 0;
|
||||
box-shadow:
|
||||
inset 0 -2rem 3rem -4rem var(--dark),
|
||||
var(--shadow-heavy);
|
||||
& aside,
|
||||
.addendum {
|
||||
border-radius: 0;
|
||||
border-width: 4px;
|
||||
border-style: solid;
|
||||
}
|
||||
& aside {
|
||||
border-color: var(--citrus-mix-light);
|
||||
background-image: linear-gradient(
|
||||
135deg,
|
||||
var(--citrus-light-extra) 5%,
|
||||
var(--citrus-light) 50%,
|
||||
var(--citrus-light-extra)
|
||||
);
|
||||
}
|
||||
& .addendum {
|
||||
border-color: var(--citrus-primary);
|
||||
background-image: linear-gradient(
|
||||
135deg,
|
||||
var(--citrus-mix-light) 5%,
|
||||
var(--citrus-light) 50%,
|
||||
var(--citrus-mix-light)
|
||||
);
|
||||
}
|
||||
& pre {
|
||||
border-radius: 4px;
|
||||
color: var(--citrus-secondary);
|
||||
background-color: var(--citrus-dark-extra);
|
||||
background-size: 4px;
|
||||
}
|
||||
& .post-warning {
|
||||
background-color: var(--citrus-primary);
|
||||
}
|
||||
& s {
|
||||
text-decoration-color: #d00;
|
||||
}
|
||||
& .postscript {
|
||||
& [alt="Profile picture"] {
|
||||
color: unset;
|
||||
border-radius: inherit;
|
||||
border: 2px solid;
|
||||
border-image-source: linear-gradient(
|
||||
to bottom,
|
||||
var(--citrus-mix-light),
|
||||
var(--citrus-secondary)
|
||||
);
|
||||
border-image-slice: 1;
|
||||
border-width: 3px;
|
||||
box-sizing: inherit;
|
||||
padding: 2px;
|
||||
background-image: var(--agender);
|
||||
background-size: 100%;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
box-shadow:
|
||||
0 0 0 2px var(--citrus-mix-dark),
|
||||
inset 0 0 0 2px var(--citrus-mix),
|
||||
var(--shadow-light);
|
||||
font-size: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
& #posts {
|
||||
& a {
|
||||
border-width: 4px;
|
||||
box-shadow: var(--shadow-light);
|
||||
border-radius: 0;
|
||||
& p {
|
||||
color: initial;
|
||||
}
|
||||
& p:not(:last-child) {
|
||||
color: var(--citrus-dark);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 916px) {
|
||||
body::after {
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 916px) {
|
||||
header {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,79 +0,0 @@
|
|||
@import url("./blog.css");
|
||||
@import url("./gallery.css");
|
||||
@import url("./home.css");
|
||||
@import url("./nav.css");
|
||||
@import url("./variables.css");
|
||||
|
||||
:is(a, button):not(span *, .postscript *, body nav *),.link,
|
||||
#posts a {
|
||||
color: var(--citrus-dark);
|
||||
transition: background-color var(--trans);
|
||||
background-color: var(--citrus-primary);
|
||||
&:is(:hover, :focus) {
|
||||
color: var(--citrus-dark-extra);
|
||||
background-color: var(--citrus-secondary);
|
||||
}
|
||||
& a {
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
body {
|
||||
color: var(--citrus-dark-extra);
|
||||
background-color: var(--citrus-primary);
|
||||
background-image: var(--paw-tiled);
|
||||
background-size: 128px;
|
||||
background-attachment: local;
|
||||
background-repeat: repeat;
|
||||
background-blend-mode: soft-light;
|
||||
animation: mainbg 10s linear infinite;
|
||||
}
|
||||
header {
|
||||
color: var(--citrus-dark);
|
||||
}
|
||||
ul:not([role]) li::before {
|
||||
background-color: var(--citrus-dark-extra);
|
||||
}
|
||||
article {
|
||||
background: var(--noise),
|
||||
linear-gradient(
|
||||
var(--citrus-light) 70%,
|
||||
color-mix(in lch, var(--citrus-mix-light), var(--citrus-light)) 100%
|
||||
);
|
||||
border-radius: 0;
|
||||
box-shadow: var(--shadow-heavy);
|
||||
border: 0;
|
||||
& .header-anchor {
|
||||
border-radius: 0;
|
||||
}
|
||||
& code:not(pre *) {
|
||||
border-radius: 0;
|
||||
background-color: var(--citrus-dark);
|
||||
color: var(--citrus-primary);
|
||||
}
|
||||
&:not(pre,code,a) {
|
||||
font-family: "Nosey Rodent", sans-serif;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 920px) {
|
||||
body > nav {
|
||||
border: 0;
|
||||
}
|
||||
header {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border-right: 0;
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
}
|
||||
body::after {
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 450px) {
|
||||
#artworks & article {
|
||||
&::before {
|
||||
width: calc(100% + var(--pad-l) * 2) !important;
|
||||
margin: -3rem 0 0 -16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
#gallery {
|
||||
& article {
|
||||
border-radius: 0;
|
||||
border: 0;
|
||||
}
|
||||
& a:has(figure) {
|
||||
font-family: "Urbanist", sans-serif;
|
||||
transition: border-color var(--trans), background-color var(--trans);
|
||||
box-shadow: var(--shadow-light);
|
||||
&:is(:hover, :focus) {
|
||||
& figure {
|
||||
transition: inherit;
|
||||
border-color: currentColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
& a figure {
|
||||
border-width: 4px;
|
||||
&:is(:not(a:hover *, a:focus *)) {
|
||||
border-color: var(--light);
|
||||
background-color: var(--light);
|
||||
}
|
||||
}
|
||||
}
|
||||
#artworks {
|
||||
article {
|
||||
margin: var(--pad-xl) 0 0 0;
|
||||
background-color: var(--light);
|
||||
background-image: var(--noise), var(--lined);
|
||||
background-size: auto, 32px;
|
||||
&:last-child:not(:first-of-type) {
|
||||
margin: calc(var(--pad-xl) + var(--pad-xl)) 0 0 0;
|
||||
}
|
||||
&::before {
|
||||
content: "";
|
||||
display: flex;
|
||||
height: 32px;
|
||||
width: calc(100% + var(--pad-xl) * 2);
|
||||
margin: calc(var(--pad-xxl) * -1) 0 var(--pad-l) calc(var(--pad-xl) * -1);
|
||||
background-image: var(--border), var(--lined), var(--noise);
|
||||
background-size: 32px, 32px;
|
||||
background-blend-mode: darken;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
article#badges {
|
||||
& a:is(:hover,:focus) {
|
||||
transition: box-shadow var(--trans), background-color var(--trans);
|
||||
box-shadow: 0 0 0 2px var(--citrus-secondary), 0 0 0 4px var(--citrus-dark-extra);
|
||||
background-color: var(--citrus-secondary);
|
||||
}
|
||||
}
|
||||
#interests li {
|
||||
width: 16ch;
|
||||
margin: var(--pad-sm);
|
||||
box-shadow: var(--shadow-light);
|
||||
background-image: linear-gradient(color-mix(in lch, var(--citrus-light-extra), var(--citrus-primary) 50%), var(--citrus-primary) 200%);
|
||||
& img {
|
||||
filter: drop-shadow(0 0 1px var(--citrus-dark));
|
||||
}
|
||||
&:nth-child(odd) {
|
||||
transform: rotate(1deg);
|
||||
}
|
||||
& a {
|
||||
align-content: center;
|
||||
& span:has(img)::after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,18 +1,21 @@
|
|||
body > nav {
|
||||
border-right: 4px solid;
|
||||
.navbar {
|
||||
color: var(--citrus-dark);
|
||||
& summary {
|
||||
& section {
|
||||
background: var(--details-bg);
|
||||
box-shadow: var(--details-shine);
|
||||
border: var(--details-border);
|
||||
& h3 {
|
||||
filter: drop-shadow(2px 0 var(--citrus-dark))
|
||||
drop-shadow(-2px 0 var(--citrus-dark))
|
||||
drop-shadow(0 2px var(--citrus-dark))
|
||||
drop-shadow(0px -2px var(--citrus-dark));
|
||||
color: var(--citrus-light);
|
||||
}
|
||||
& li *:is(a ,button) {
|
||||
}
|
||||
& li :is(a, button) {
|
||||
background: var(--button-bg);
|
||||
box-shadow: var(--button-shine);
|
||||
border: var(--button-border);
|
||||
border-radius: var(--round);
|
||||
color: inherit;
|
||||
&[aria-current] {
|
||||
background: var(--button-current-bg);
|
||||
|
|
@ -20,38 +23,69 @@ body > nav {
|
|||
border: var(--button-current-border);
|
||||
color: var(--citrus-light);
|
||||
}
|
||||
&:is(:hover, :focus):not([aria-current="page"]) {
|
||||
&:is(:hover, :focus):not([aria-current]) {
|
||||
background: var(--button-hover-bg);
|
||||
box-shadow: var(--button-hover-shine);
|
||||
border: var(--button-hover-border);
|
||||
transition: background-image var(--trans), border-color var(--trans),
|
||||
transition:
|
||||
background-image var(--trans),
|
||||
border-color var(--trans),
|
||||
box-shadow var(--trans);
|
||||
color: var(--citrus-mix-dark);
|
||||
}
|
||||
}
|
||||
& details,
|
||||
details[open] {
|
||||
background: var(--details-bg);
|
||||
box-shadow: var(--details-shine);
|
||||
border: var(--details-border);
|
||||
}
|
||||
}
|
||||
body > nav,
|
||||
.navbar section,
|
||||
.navbar li :is(a, button) {
|
||||
border-radius: var(--round);
|
||||
}
|
||||
#default,
|
||||
#floating,
|
||||
header {
|
||||
color: var(--citrus-dark);
|
||||
background-attachment: fixed;
|
||||
background-blend-mode: screen;
|
||||
background-image: var(--nav-bg);
|
||||
background-size: 6px;
|
||||
border-color: var(--citrus-dark);
|
||||
}
|
||||
header {
|
||||
width: var(--view);
|
||||
border-right-width: 4px;
|
||||
#floating {
|
||||
border-bottom-style: solid;
|
||||
border-right-style: solid;
|
||||
border-bottom-width: 4px;
|
||||
border-bottom-style: solid;
|
||||
border-bottom-right-radius: 100px;
|
||||
margin-left: calc(var(--view) - 4px);
|
||||
position: relative;
|
||||
padding: calc(var(--pad-m) - 2px) var(--pad-sm);
|
||||
border-right-width: 4px;
|
||||
}
|
||||
#default {
|
||||
border-right-style: solid;
|
||||
border-right-width: 4px;
|
||||
}
|
||||
body {
|
||||
position: relative;
|
||||
z-index: -3;
|
||||
& main {
|
||||
position: inherit;
|
||||
z-index: -2;
|
||||
}
|
||||
& #sidebar {
|
||||
position: inherit;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 916px) {
|
||||
header {
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 916px) {
|
||||
header {
|
||||
border-bottom-right-radius: var(--pad-xl);
|
||||
border-bottom-style: solid;
|
||||
border-bottom-width: 4px;
|
||||
border-right-style: solid;
|
||||
border-right-width: 4px;
|
||||
display: flex;
|
||||
margin-left: calc(var(--view) - 4px);
|
||||
padding: var(--pad-m) 0;
|
||||
width: var(--view);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,9 +5,15 @@
|
|||
--citrus-dark: color-mix(in lch, var(--citrus-secondary), var(--dark) 60%);
|
||||
--citrus-light-extra: color-mix(in lch, var(--citrus-light), var(--light));
|
||||
--citrus-dark-extra: color-mix(in lch, var(--citrus-dark), var(--dark));
|
||||
--citrus-mix: color-mix(in lch,var(--citrus-primary),var(--citrus-secondary));
|
||||
--citrus-mix: color-mix(
|
||||
in lch,
|
||||
var(--citrus-primary),
|
||||
var(--citrus-secondary)
|
||||
);
|
||||
--citrus-mix-light: color-mix(in lch, var(--citrus-light), var(--citrus-mix));
|
||||
--citrus-mix-dark: color-mix(in lch, var(--citrus-dark), var(--citrus-mix));
|
||||
--rot-plus: rotate(0.5deg);
|
||||
--rot-minus: rotate(-0.5deg);
|
||||
--shadow-light: 0.2rem 0.2rem 0.2rem 0.1rem #0002;
|
||||
--shadow-heavy: 0.2rem 0.2rem 0.4rem 0.2rem #0004;
|
||||
--checker: url("/assets/img/theme/citrus/checker.png");
|
||||
|
|
@ -16,17 +22,43 @@
|
|||
--paper: url("/assets/img/theme/citrus/paper.png");
|
||||
--noise: url("/assets/img/theme/citrus/imagedoc-lightnoise.png");
|
||||
--border: url("/assets/img/theme/citrus/border.png");
|
||||
--nav-bg: var(--dot), linear-gradient(var(--citrus-primary), var(--citrus-secondary) 60%, var(--citrus-primary) 120%);
|
||||
--button-bg: linear-gradient(var(--citrus-primary) 30%, var(--citrus-mix) 80%);
|
||||
--nav-bg:
|
||||
var(--dot),
|
||||
linear-gradient(
|
||||
var(--citrus-primary),
|
||||
var(--citrus-secondary) 60%,
|
||||
var(--citrus-primary) 120%
|
||||
);
|
||||
--button-bg: linear-gradient(
|
||||
var(--citrus-primary) 30%,
|
||||
var(--citrus-mix) 80%
|
||||
);
|
||||
--button-border: 2px solid var(--citrus-dark);
|
||||
--button-shine: inset 0px 2px var(--citrus-light), inset 0px -2px var(--citrus-mix);
|
||||
--button-hover-bg: linear-gradient(var(--citrus-light),var(--citrus-primary),var(--citrus-mix-light));
|
||||
--button-shine:
|
||||
inset 0px 2px var(--citrus-light), inset 0px -2px var(--citrus-mix);
|
||||
--button-hover-bg: linear-gradient(
|
||||
var(--citrus-light),
|
||||
var(--citrus-primary),
|
||||
var(--citrus-mix-light)
|
||||
);
|
||||
--button-hover-border: 2px solid var(--citrus-light);
|
||||
--button-hover-shine: inset 0 -2px 0 0 var(--citrus-mix);
|
||||
--button-current-bg: linear-gradient(var(--citrus-mix-dark),var(--citrus-dark-extra) 200%);
|
||||
--button-current-bg: linear-gradient(
|
||||
var(--citrus-mix-dark),
|
||||
var(--citrus-dark-extra) 200%
|
||||
);
|
||||
--button-current-border: 2px solid var(--citrus-dark-extra);
|
||||
--button-current-shine: inset 0px 2px 0 var(--citrus-mix-light), inset 0 -2px 0 var(--citrus-mix-dark);
|
||||
--details-bg: linear-gradient(-45deg,var(--citrus-primary),var(--citrus-mix),var(--citrus-primary));
|
||||
--details-shine: inset 0 2px 0 var(--citrus-light-extra), inset 2px 0 0 var(--citrus-light), inset 0 -2px 0 var(--citrus-primary), inset -2px 0 0 var(--citrus-primary);
|
||||
--button-current-shine:
|
||||
inset 0px 2px 0 var(--citrus-mix-light),
|
||||
inset 0 -2px 0 var(--citrus-mix-dark);
|
||||
--details-bg: linear-gradient(
|
||||
-45deg,
|
||||
var(--citrus-primary),
|
||||
var(--citrus-mix),
|
||||
var(--citrus-primary)
|
||||
);
|
||||
--details-shine:
|
||||
inset 0 2px 0 var(--citrus-light-extra), inset 2px 0 0 var(--citrus-light),
|
||||
inset 0 -2px 0 var(--citrus-primary), inset -2px 0 0 var(--citrus-primary);
|
||||
--details-border: 2px solid var(--citrus-dark);
|
||||
}
|
||||
|
|
@ -1,183 +0,0 @@
|
|||
:root {
|
||||
--avatar: 3rem;
|
||||
}
|
||||
article:not(#blog:has(#posts) *) {
|
||||
margin: 0 auto;
|
||||
}
|
||||
article {
|
||||
max-width: var(--post);
|
||||
& ul {
|
||||
margin: 0;
|
||||
}
|
||||
& > .postscript::after {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
& section:not(section:has(p)) {
|
||||
display: flex;
|
||||
gap: var(--pad-l);
|
||||
}
|
||||
& aside {
|
||||
float: right;
|
||||
border-radius: var(--round);
|
||||
width: 66%;
|
||||
}
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
margin-bottom: var(--pad-m);
|
||||
}
|
||||
& .post-warning {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 1.4rem;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
&::before,
|
||||
&::after {
|
||||
content: "";
|
||||
display: inherit;
|
||||
border-width: 2px;
|
||||
border-style: dashed;
|
||||
}
|
||||
}
|
||||
}
|
||||
.addendum,
|
||||
.post-warning,
|
||||
article aside {
|
||||
margin: var(--pad-l) 0;
|
||||
padding: var(--pad-l);
|
||||
}
|
||||
article > .addendum {
|
||||
border-image-slice: 1;
|
||||
border-image-width: 2px;
|
||||
border-image-outset: 4px;
|
||||
}
|
||||
|
||||
article > .postscript {
|
||||
margin: 0 0 auto auto;
|
||||
padding: var(--pad-xl) 0 var(--pad-xxl) 0;
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
mask-image: var(--paw);
|
||||
mask-size: 100%;
|
||||
mask-repeat: no-repeat;
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
& p {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
transition: background-color var(--trans);
|
||||
margin-top: inherit;
|
||||
margin-left: inherit;
|
||||
margin-right: var(--avatar);
|
||||
margin-bottom: var(--pad-l);
|
||||
border-radius: var(--round);
|
||||
border-bottom-right-radius: 0;
|
||||
width: fit-content;
|
||||
padding: var(--pad-m);
|
||||
background-color: #0060df;
|
||||
color: #fff;
|
||||
font-size: 0.8rem;
|
||||
word-wrap: anywhere;
|
||||
&:hover {
|
||||
background-color: #3a76f0;
|
||||
}
|
||||
|
||||
& a:has(img:nth-child(n + 2)) {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(min(100%, 40%), 1fr));
|
||||
align-items: center;
|
||||
gap: var(--pad-m);
|
||||
}
|
||||
& > img {
|
||||
transition: height var(--trans), border-radius var(--trans),
|
||||
background-color var(--trans);
|
||||
border-radius: var(--round);
|
||||
min-height: fit-content;
|
||||
max-height: var(--image);
|
||||
}
|
||||
}
|
||||
& span:has([alt]) {
|
||||
width: var(--avatar);
|
||||
height: var(--avatar);
|
||||
display: flex;
|
||||
float: right;
|
||||
& [alt="Profile picture"] {
|
||||
display: flex;
|
||||
box-sizing: content-box;
|
||||
margin: 0 0 0 auto;
|
||||
border-radius: 100%;
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#posts {
|
||||
max-width: var(--post);
|
||||
& ul {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--pad-l);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
& a {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-style: solid;
|
||||
border-width: 2px;
|
||||
border-radius: var(--round);
|
||||
padding: var(--pad-m);
|
||||
font-size: 1.125rem;
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
word-break: break-word;
|
||||
& time,
|
||||
p {
|
||||
display: flex;
|
||||
font-size: 1rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 920px) {
|
||||
article aside {
|
||||
float: unset;
|
||||
width: fit-content;
|
||||
}
|
||||
article section {
|
||||
flex-direction: column;
|
||||
}
|
||||
#posts {
|
||||
max-width: unset;
|
||||
width: auto;
|
||||
}
|
||||
article > .postscript {
|
||||
& p {
|
||||
margin-right: var(--pad-sm);
|
||||
& > a img {
|
||||
height: auto;
|
||||
max-height: var(--view);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
article > .postscript {
|
||||
& p,
|
||||
p > img {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
#blog #posts a {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,351 +0,0 @@
|
|||
@import url("./variables.css");
|
||||
@import url("./nav.css");
|
||||
@import url("./motion.css");
|
||||
|
||||
:root {
|
||||
--view: 18rem;
|
||||
}
|
||||
|
||||
/* i hate default styles >:( and also chrome */
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: "Rubik", sans-serif;
|
||||
display: block;
|
||||
font-size: 2rem;
|
||||
margin-block-start: 0;
|
||||
margin-block-end: 0;
|
||||
margin-inline-start: 0;
|
||||
margin-inline-end: 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "Rubik", sans-serif;
|
||||
font-size: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
& a,
|
||||
button {
|
||||
cursor: pointer;
|
||||
transition: background-color var(--trans);
|
||||
|
||||
&:is(:hover, :focus) {
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
svg {
|
||||
fill: currentColor;
|
||||
stroke: currentColor;
|
||||
stroke-width: 0;
|
||||
}
|
||||
|
||||
header {
|
||||
padding-top: var(--pad-xl);
|
||||
padding-left: calc(var(--view) + var(--pad-xl));
|
||||
|
||||
& svg {
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
margin-right: var(--pad-m);
|
||||
}
|
||||
|
||||
& h1 {
|
||||
display: inline-flex;
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
overflow-y: hidden;
|
||||
word-break: break-all;
|
||||
flex-wrap: wrap;
|
||||
font-family: "Nosey Rodent", sans-serif;
|
||||
display: flex;
|
||||
margin-left: var(--view);
|
||||
width: calc(100% - var(--view));
|
||||
justify-content: center;
|
||||
position: sticky;
|
||||
inset-block: 100%;
|
||||
text-align: center;
|
||||
|
||||
& span {
|
||||
background-image: var(--transgender);
|
||||
padding: 0 var(--pad-sm);
|
||||
}
|
||||
}
|
||||
|
||||
main {
|
||||
padding: var(--pad-xl);
|
||||
padding-left: calc(var(--view) + var(--pad-xl));
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
details {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
& summary::marker {
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
|
||||
.header-anchor {
|
||||
display: inline-block;
|
||||
transition:
|
||||
color var(--trans),
|
||||
background-color var(--trans);
|
||||
height: max-content;
|
||||
padding: 0 var(--pad-m);
|
||||
margin: 0 0 0 calc(var(--pad-xl) * -1);
|
||||
border-radius: 0 var(--round) var(--round) 0;
|
||||
}
|
||||
|
||||
article {
|
||||
color: inherit;
|
||||
border-style: solid;
|
||||
border-width: 2px;
|
||||
border-radius: var(--round);
|
||||
height: max-content;
|
||||
padding: var(--pad-xl);
|
||||
|
||||
& a:has(figure) {
|
||||
border-radius: var(--round);
|
||||
|
||||
& figure {
|
||||
border-color: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
& s {
|
||||
text-decoration-style: line-through;
|
||||
text-decoration-thickness: 0.1em;
|
||||
}
|
||||
|
||||
& u {
|
||||
text-decoration-style: double;
|
||||
text-decoration-thickness: 2px;
|
||||
}
|
||||
|
||||
& em {
|
||||
font-weight: 200;
|
||||
}
|
||||
|
||||
& p {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
& p:not(:last-child, [aria-label]) {
|
||||
padding-bottom: var(--pad-sm);
|
||||
}
|
||||
|
||||
& code:not(pre *) {
|
||||
padding: 0 var(--pad-sm);
|
||||
}
|
||||
|
||||
& pre {
|
||||
display: flex;
|
||||
width: auto;
|
||||
padding: var(--pad-m);
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
border-style: solid;
|
||||
border-width: 2px;
|
||||
transition:
|
||||
background-color var(--trans),
|
||||
border-color var(--trans);
|
||||
}
|
||||
|
||||
& pre,
|
||||
code:not(pre *) {
|
||||
border-radius: var(--round);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
& figure {
|
||||
margin: 0;
|
||||
border-style: solid;
|
||||
border-width: 2px;
|
||||
padding: var(--pad-m);
|
||||
border-radius: inherit;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
& ul:not([role="list"]):is(#art *) {
|
||||
padding: 0;
|
||||
margin: 0 0 var(--pad-sm) var(--pad-xl);
|
||||
}
|
||||
|
||||
& li:not([role] *, #changelog *) {
|
||||
&::marker {
|
||||
content: none;
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
position: absolute;
|
||||
mask-image: var(--paw);
|
||||
mask-size: contain;
|
||||
mask-repeat: no-repeat;
|
||||
margin: 0 0 0 calc(var(--pad-xl) * -1);
|
||||
}
|
||||
}
|
||||
|
||||
& section {
|
||||
& a:has(figure) {
|
||||
height: max-content;
|
||||
}
|
||||
|
||||
& figure img {
|
||||
border-radius: inherit;
|
||||
}
|
||||
|
||||
& figcaption {
|
||||
font-weight: normal;
|
||||
font-style: italic;
|
||||
padding-top: var(--pad-sm);
|
||||
}
|
||||
}
|
||||
|
||||
& > :first-child > code {
|
||||
display: flex;
|
||||
width: fit-content;
|
||||
margin: var(--pad-sm) 0;
|
||||
}
|
||||
}
|
||||
|
||||
:is(main article, main section):not(:last-child) {
|
||||
margin-bottom: var(--pad-m);
|
||||
}
|
||||
|
||||
img[src*="/assets/img/flag/"] {
|
||||
height: 32px;
|
||||
border-radius: 2px;
|
||||
|
||||
&:first-child {
|
||||
margin-left: var(--pad-m);
|
||||
}
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-right: var(--pad-m);
|
||||
}
|
||||
}
|
||||
|
||||
.link {
|
||||
display: inline-flex;
|
||||
|
||||
& a {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
& img {
|
||||
position: relative;
|
||||
vertical-align: sub;
|
||||
margin: 0 var(--pad-sm);
|
||||
}
|
||||
}
|
||||
|
||||
article a:not(.link *, a:has(img)) {
|
||||
display: inline-flex;
|
||||
padding: 0 var(--pad-sm);
|
||||
}
|
||||
|
||||
dialog button[commandfor] {
|
||||
width: max-content;
|
||||
padding: 0 var(--pad-sm);
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
dialog#signal {
|
||||
cursor: default;
|
||||
background: black;
|
||||
border: none;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
padding: var(--pad-xl);
|
||||
|
||||
& article {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0 auto;
|
||||
max-width: fit-content;
|
||||
background: none;
|
||||
word-wrap: break-word;
|
||||
color: white;
|
||||
|
||||
& h1 {
|
||||
font-size: 4rem;
|
||||
}
|
||||
|
||||
& p {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
& a {
|
||||
margin: auto 0 0 auto;
|
||||
}
|
||||
& h1,
|
||||
p,
|
||||
a {
|
||||
font-family: "Times New Roman", Times, serif;
|
||||
}
|
||||
|
||||
& img {
|
||||
border: 4px solid white;
|
||||
padding: var(--pad-sm);
|
||||
max-width: 100%;
|
||||
max-height: 250px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 920px) {
|
||||
body::after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
footer {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
header {
|
||||
padding-left: 0;
|
||||
padding-top: var(--pad-m);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
main {
|
||||
padding: var(--pad-l);
|
||||
}
|
||||
|
||||
main > section {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
main > section {
|
||||
width: initial;
|
||||
}
|
||||
|
||||
article {
|
||||
max-width: initial;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
657
_src/assets/css/default/fallback.css
Normal file
657
_src/assets/css/default/fallback.css
Normal file
|
|
@ -0,0 +1,657 @@
|
|||
@import url("./variables.css");
|
||||
@import url("./nav.css");
|
||||
@import url("./motion.css");
|
||||
|
||||
body {
|
||||
font-size: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
& a,
|
||||
button {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
main {
|
||||
overflow: hidden;
|
||||
padding: var(--pad-xl) var(--pad-xl) 0 calc(var(--view) + var(--pad-xl));
|
||||
position: relative;
|
||||
width: fit-content;
|
||||
margin-bottom: var(--pad-xl);
|
||||
|
||||
& ul[role="list"] {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
& article {
|
||||
color: inherit;
|
||||
height: max-content;
|
||||
max-width: var(--main);
|
||||
padding: var(--pad-xl);
|
||||
width: auto;
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-bottom: var(--pad-l);
|
||||
}
|
||||
|
||||
& s {
|
||||
text-decoration-style: line-through;
|
||||
text-decoration-thickness: 0.1em;
|
||||
}
|
||||
|
||||
& u {
|
||||
text-decoration-style: double;
|
||||
text-decoration-thickness: 2px;
|
||||
}
|
||||
|
||||
& em {
|
||||
font-weight: 200;
|
||||
}
|
||||
|
||||
& p {
|
||||
word-wrap: break-word;
|
||||
|
||||
&:not(li p):not(:last-child) {
|
||||
padding-bottom: var(--pad-m);
|
||||
}
|
||||
}
|
||||
|
||||
& pre {
|
||||
display: flex;
|
||||
width: auto;
|
||||
padding: var(--pad-m);
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
& a>img {
|
||||
display: inline-flex;
|
||||
height: auto;
|
||||
vertical-align: middle;
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
& a:has(figure) {
|
||||
height: fit-content;
|
||||
}
|
||||
|
||||
& figure {
|
||||
margin: 0;
|
||||
padding: var(--pad-m);
|
||||
|
||||
& figcaption {
|
||||
width: 100%;
|
||||
padding-top: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
header {
|
||||
& a {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
& svg {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
margin-right: var(--pad-m);
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
color: var(--dark);
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
font-family: "Nosey Rodent", sans-serif;
|
||||
inset-block: 100%;
|
||||
justify-content: center;
|
||||
margin-left: var(--view);
|
||||
overflow-y: hidden;
|
||||
position: sticky;
|
||||
text-align: center;
|
||||
width: calc(100% - var(--view));
|
||||
word-break: break-all;
|
||||
z-index: -1;
|
||||
|
||||
& #message {
|
||||
background-image: var(--transgender);
|
||||
padding: 0 var(--pad-s);
|
||||
}
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
display: block;
|
||||
font-size: 2rem;
|
||||
font-weight: bold;
|
||||
margin: 0;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
details {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
& summary::marker {
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
|
||||
svg {
|
||||
fill: currentColor;
|
||||
stroke: currentColor;
|
||||
stroke-width: 0;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.paws {
|
||||
margin: 0;
|
||||
padding: 0 var(--pad-xl);
|
||||
|
||||
& li::marker {
|
||||
content: none;
|
||||
}
|
||||
|
||||
& li::before {
|
||||
content: "";
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
position: absolute;
|
||||
mask-image: var(--paw);
|
||||
mask-size: contain;
|
||||
mask-repeat: no-repeat;
|
||||
margin: 0 0 0 calc(var(--pad-xl) * -1);
|
||||
}
|
||||
}
|
||||
|
||||
img[src*="/assets/img/flag/"] {
|
||||
height: 32px;
|
||||
border-radius: 2px;
|
||||
|
||||
&:first-child {
|
||||
margin-left: var(--pad-m);
|
||||
}
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-right: var(--pad-m);
|
||||
}
|
||||
}
|
||||
|
||||
/* home.html */
|
||||
#bio .emoji {
|
||||
display: inline-flex;
|
||||
height: 20px;
|
||||
vertical-align: middle;
|
||||
width: 20px;
|
||||
|
||||
&::after,
|
||||
img {
|
||||
filter: drop-shadow(0 0 0.5px #000a);
|
||||
}
|
||||
}
|
||||
|
||||
#badges ul {
|
||||
gap: var(--pad-s);
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#interests details {
|
||||
& a {
|
||||
align-items: center;
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
height: auto;
|
||||
text-align: center;
|
||||
width: 120px;
|
||||
|
||||
&:not(:hover, :focus) {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
& span:has(img)::after {
|
||||
background-image: url("/assets/img/icon/shortcut.png");
|
||||
background-size: 100%;
|
||||
content: "";
|
||||
display: block;
|
||||
height: 24px;
|
||||
margin: -1.5rem 0 0 -0.5rem;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
width: 24px;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.games img {
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
.manga img {
|
||||
height: 128px;
|
||||
}
|
||||
|
||||
#pkmn {
|
||||
background-image: url("/assets/img/pkmn/bg/box.png");
|
||||
border-bottom-color: #78a068;
|
||||
border-left-color: #c8f8c0;
|
||||
border-radius: 4px;
|
||||
border-right-color: #78a068;
|
||||
border-style: solid;
|
||||
border-top-color: #c8f8c0;
|
||||
border-width: 3px;
|
||||
margin: var(--pad-l) 0 0 0;
|
||||
width: fit-content;
|
||||
|
||||
& li {
|
||||
display: flex;
|
||||
margin-left: -12px;
|
||||
margin-top: -8px;
|
||||
|
||||
& span:hover {
|
||||
filter: drop-shadow(0 -2px 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 3px #000a);
|
||||
animation: jump 200ms infinite alternate;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#agender {
|
||||
background-image: var(--agender);
|
||||
}
|
||||
|
||||
#aromantic {
|
||||
background-image: var(--aromantic);
|
||||
}
|
||||
|
||||
#pansexual {
|
||||
background-image: var(--pansexual);
|
||||
}
|
||||
|
||||
#badges img {
|
||||
max-height: 31px;
|
||||
width: 88px;
|
||||
}
|
||||
|
||||
/* changelog.html */
|
||||
#changelog li {
|
||||
&::before {
|
||||
content: none;
|
||||
}
|
||||
|
||||
&::marker {
|
||||
content: initial;
|
||||
}
|
||||
}
|
||||
|
||||
/* gallery.html */
|
||||
#art {
|
||||
& h1 {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
& p {
|
||||
max-width: var(--post);
|
||||
}
|
||||
|
||||
& section:has(a:nth-child(n + 2)) {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: var(--pad-l);
|
||||
}
|
||||
|
||||
& section:has(a:nth-child(n + 3)) {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
& section {
|
||||
margin-top: var(--pad-l);
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-bottom: var(--pad-l);
|
||||
}
|
||||
|
||||
& a {
|
||||
display: flex;
|
||||
width: calc(var(--post) - var(--view));
|
||||
flex-direction: column;
|
||||
height: fit-content;
|
||||
}
|
||||
|
||||
& time {
|
||||
margin: var(--pad-m) 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
& figure img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
#artworks {
|
||||
& ul {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill,
|
||||
minmax(min(var(--thumb), 100%), 1fr));
|
||||
gap: var(--pad-l);
|
||||
|
||||
& a {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
& img {
|
||||
width: 100%;
|
||||
height: var(--thumb);
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
& figcaption {
|
||||
display: inline-flex;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
& .count {
|
||||
margin: auto 0 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
/* blog.html */
|
||||
#blog {
|
||||
& main article {
|
||||
max-width: var(--post);
|
||||
|
||||
& .postscript {
|
||||
margin: 0 0 auto auto;
|
||||
padding: var(--pad-xl) 0 var(--pad-xxl) 0;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
mask-image: var(--paw);
|
||||
mask-size: 100%;
|
||||
mask-repeat: no-repeat;
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
|
||||
& p {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
transition: background-color var(--trans);
|
||||
margin-top: inherit;
|
||||
margin-left: inherit;
|
||||
margin-right: var(--avatar);
|
||||
margin-bottom: var(--pad-l);
|
||||
border-radius: var(--round);
|
||||
border-bottom-right-radius: 0;
|
||||
width: fit-content;
|
||||
padding: var(--pad-m);
|
||||
background-color: #0060df;
|
||||
color: #fff;
|
||||
font-size: 0.8rem;
|
||||
word-wrap: anywhere;
|
||||
|
||||
&:hover {
|
||||
background-color: #3a76f0;
|
||||
}
|
||||
|
||||
& a:has(img:nth-child(n + 2)) {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(min(100%, 40%), 1fr));
|
||||
align-items: center;
|
||||
gap: var(--pad-m);
|
||||
}
|
||||
|
||||
&>img {
|
||||
transition:
|
||||
height var(--trans),
|
||||
border-radius var(--trans),
|
||||
background-color var(--trans);
|
||||
border-radius: var(--round);
|
||||
min-height: fit-content;
|
||||
max-height: var(--image);
|
||||
}
|
||||
}
|
||||
|
||||
& span:has([alt="Profile picture"]) {
|
||||
width: var(--avatar);
|
||||
height: var(--avatar);
|
||||
display: flex;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
& .postscript::after {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
& section:has(figure) {
|
||||
display: flex;
|
||||
gap: var(--pad-l);
|
||||
}
|
||||
|
||||
& aside {
|
||||
float: right;
|
||||
border-radius: var(--round);
|
||||
width: 66%;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
margin-bottom: var(--pad-m);
|
||||
}
|
||||
|
||||
& .post-warning {
|
||||
font-size: 1.4rem;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
|
||||
&::before,
|
||||
&::after {
|
||||
content: "";
|
||||
display: inherit;
|
||||
border-width: 2px;
|
||||
border-style: dashed;
|
||||
}
|
||||
}
|
||||
|
||||
.addendum,
|
||||
.post-warning,
|
||||
aside {
|
||||
margin: var(--pad-l) 0;
|
||||
padding: var(--pad-l);
|
||||
}
|
||||
}
|
||||
|
||||
& #posts {
|
||||
& ul {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--pad-l);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
& a {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 1.125rem;
|
||||
font-weight: bold;
|
||||
padding: var(--pad-m);
|
||||
text-decoration: none;
|
||||
word-break: break-word;
|
||||
|
||||
& time,
|
||||
p {
|
||||
display: flex;
|
||||
font-size: 1rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* easter egg :) */
|
||||
#signal {
|
||||
background: black;
|
||||
border: 0;
|
||||
color: white;
|
||||
font-family: "Times New Roman", Times, serif;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
max-height: 100%;
|
||||
max-width: 100%;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
|
||||
& article {
|
||||
align-content: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
width: fit-content;
|
||||
|
||||
& h1 {
|
||||
display: inline-flex;
|
||||
font-size: 4rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
& p {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
& a {
|
||||
margin: auto 0 0 auto;
|
||||
}
|
||||
|
||||
& img {
|
||||
border: 4px solid white;
|
||||
max-height: 250px;
|
||||
max-width: 100%;
|
||||
padding: var(--pad-s);
|
||||
}
|
||||
|
||||
& button {
|
||||
inset-block: 100%;
|
||||
bottom: 0;
|
||||
position: sticky;
|
||||
margin: var(--pad-xl) auto;
|
||||
width: fit-content;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 916px) {
|
||||
#sidebar {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#floating {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#default button[popovertarget] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 916px) {
|
||||
|
||||
/* Reset */
|
||||
header,
|
||||
footer,
|
||||
main {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
footer #message {
|
||||
margin: 0 auto;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
article {
|
||||
margin: var(--pad-m);
|
||||
padding: var(--pad-l);
|
||||
}
|
||||
|
||||
header {
|
||||
margin: calc(var(--pad-xxl) + var(--pad-l)) 0 0 0;
|
||||
|
||||
& h1 {
|
||||
margin: auto 0 0 auto;
|
||||
padding-right: var(--pad-m);
|
||||
}
|
||||
}
|
||||
|
||||
#default::before {
|
||||
content: none;
|
||||
}
|
||||
|
||||
body::after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
#blog {
|
||||
& main article {
|
||||
max-width: initial;
|
||||
|
||||
& aside {
|
||||
float: unset;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
& section {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
& .postscript {
|
||||
& p {
|
||||
margin-right: var(--pad-sm);
|
||||
|
||||
&>a img {
|
||||
height: auto;
|
||||
max-height: var(--view);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#art {
|
||||
& p {
|
||||
max-width: auto;
|
||||
}
|
||||
|
||||
& a:has(img) {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
& section:has(a:nth-child(n + 2)) {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,93 +0,0 @@
|
|||
:root {
|
||||
--thumb: 16rem;
|
||||
}
|
||||
#gallery {
|
||||
& time {
|
||||
display: flex;
|
||||
align-self: center;
|
||||
}
|
||||
}
|
||||
#artworks {
|
||||
& ul {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(
|
||||
auto-fill,
|
||||
minmax(min(var(--thumb), 100%), 1fr)
|
||||
);
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
gap: var(--pad-l);
|
||||
& a {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
& figure {
|
||||
margin: 0;
|
||||
border-style: solid;
|
||||
& img {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: var(--thumb);
|
||||
object-fit: contain;
|
||||
border-radius: var(--round);
|
||||
}
|
||||
|
||||
& figcaption {
|
||||
font-size: 1.4rem;
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
text-decoration-style: none;
|
||||
}
|
||||
& .count {
|
||||
margin: auto 0 0 auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#art {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: fit-content;
|
||||
& p {
|
||||
max-width: var(--post);
|
||||
}
|
||||
& h3 {
|
||||
display: flex;
|
||||
gap: var(--pad-sm);
|
||||
}
|
||||
& section:has(a:nth-child(n + 2)) {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: var(--pad-l);
|
||||
}
|
||||
& section:has(a:nth-child(n + 3)) {
|
||||
flex-direction: column;
|
||||
}
|
||||
& section {
|
||||
& a {
|
||||
display: flex;
|
||||
width: calc(var(--post) - var(--view));
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1500px) {
|
||||
#art section:has(a:nth-child(n + 2)) {
|
||||
flex-direction: column;
|
||||
& a {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 920px) {
|
||||
#art p {
|
||||
max-width: auto;
|
||||
}
|
||||
#art a:has(img) {
|
||||
width: auto;
|
||||
}
|
||||
#art section:has(a:nth-child(n + 2)) {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,160 +0,0 @@
|
|||
@keyframes jump {
|
||||
0% {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translateY(-4px);
|
||||
}
|
||||
}
|
||||
|
||||
article#bio {
|
||||
& .emoji {
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
display: inline-flex;
|
||||
vertical-align: middle;
|
||||
&::after,
|
||||
img {
|
||||
filter: drop-shadow(0 0 0.5px #000a);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
article#badges {
|
||||
& ul {
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: var(--pad-sm);
|
||||
}
|
||||
|
||||
& a {
|
||||
display: flex;
|
||||
margin: 0;
|
||||
}
|
||||
& img {
|
||||
box-sizing: content-box;
|
||||
}
|
||||
}
|
||||
|
||||
article#interests {
|
||||
& ul {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin: 0;
|
||||
padding: var(--pad-l) 0;
|
||||
}
|
||||
& li {
|
||||
display: flex;
|
||||
width: 14ch;
|
||||
flex-wrap: wrap;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
|
||||
& a {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: var(--pad-sm);
|
||||
width: inherit;
|
||||
&:not(:hover, :focus) {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
& .music img,
|
||||
.games img {
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
& .manga img {
|
||||
height: 128px;
|
||||
}
|
||||
& span:has(img) {
|
||||
width: fit-content;
|
||||
margin: 0 auto;
|
||||
&::after {
|
||||
content: "";
|
||||
background-image: url("/assets/img/icon/shortcut.png");
|
||||
background-size: 100%;
|
||||
display: block;
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin: -1.5rem 0 0 -0.5rem;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
& details:last-child ul {
|
||||
padding: var(--pad-l) 0 0 0;
|
||||
}
|
||||
|
||||
& details h3 {
|
||||
border-bottom-width: 1px;
|
||||
border-bottom-style: solid;
|
||||
}
|
||||
}
|
||||
|
||||
#pkmn {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
background-image: url("/assets/img/pkmn/bg/box.png");
|
||||
border-radius: 5px;
|
||||
width: fit-content;
|
||||
border-bottom-color: #78a068;
|
||||
border-left-color: #c8f8c0;
|
||||
border-right-color: #78a068;
|
||||
border-top-color: #c8f8c0;
|
||||
border-width: 3px;
|
||||
border-style: solid;
|
||||
margin: var(--pad-l) 0 0 0;
|
||||
|
||||
& li {
|
||||
display: flex;
|
||||
margin-top: -8px;
|
||||
margin-left: -12px;
|
||||
|
||||
& span:hover {
|
||||
filter: drop-shadow(0 -2px 0 #fff) drop-shadow(0 2px 0 #fff)
|
||||
drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff)
|
||||
drop-shadow(0 2px 3px #000a);
|
||||
animation: jump 200ms infinite alternate;
|
||||
}
|
||||
}
|
||||
& li:first-child {
|
||||
margin-left: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
#agender {
|
||||
background-image: var(--agender);
|
||||
}
|
||||
|
||||
#aromantic {
|
||||
background-image: var(--aromantic);
|
||||
}
|
||||
|
||||
#pansexual {
|
||||
background-image: var(--pansexual);
|
||||
}
|
||||
#badges img {
|
||||
max-height: 31px;
|
||||
width: 88px;
|
||||
}
|
||||
@media screen and (max-width: 920px) {
|
||||
article#interests {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
& ul {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
& li a {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -14,12 +14,11 @@
|
|||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
|
||||
line-height: 0.5;
|
||||
& footer {
|
||||
position: sticky;
|
||||
bottom: 0;
|
||||
bottom: 1rem;
|
||||
}
|
||||
|
||||
& header {
|
||||
top: 0;
|
||||
display: flex;
|
||||
|
|
@ -27,7 +26,6 @@
|
|||
justify-self: center;
|
||||
& a,
|
||||
img {
|
||||
z-index: 1;
|
||||
display: inherit;
|
||||
flex-direction: inherit;
|
||||
}
|
||||
|
|
@ -38,7 +36,6 @@
|
|||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
& footer,
|
||||
header {
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
@media (prefers-reduced-motion: no-preference) {
|
||||
/* Scrolling pride flag text */
|
||||
article#bio span[id],
|
||||
footer span {
|
||||
#bio span[id],
|
||||
footer #message {
|
||||
font-family: "Nosey Rodent", sans-serif;
|
||||
font-weight: bold;
|
||||
color: transparent;
|
||||
|
|
@ -13,26 +13,26 @@
|
|||
animation: slide 5s linear infinite;
|
||||
transition: color var(--trans);
|
||||
}
|
||||
body {
|
||||
animation: mainbg 10s infinite linear
|
||||
}
|
||||
}
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
body {
|
||||
animation: none !important;
|
||||
}
|
||||
/* Buttons */
|
||||
:is(a, button),
|
||||
span:has(a) {
|
||||
transition: none !important;
|
||||
transition: none;
|
||||
}
|
||||
/* Permalinks */
|
||||
.header-anchor,
|
||||
article pre {
|
||||
transition: none !important;
|
||||
main article pre {
|
||||
transition: none;
|
||||
}
|
||||
/* Images */
|
||||
#gallery a:has(figure),
|
||||
#blog article figure,
|
||||
#blog main article figure,
|
||||
a img {
|
||||
transition: none !important;
|
||||
transition: none;
|
||||
}
|
||||
.emoji:has(img[alt*="🐇"]) {
|
||||
& img {
|
||||
|
|
@ -44,12 +44,12 @@
|
|||
}
|
||||
}
|
||||
/* Scrolling pride flag text */
|
||||
article#bio span[id], footer span {
|
||||
transition: none !important;
|
||||
animation: none !important;
|
||||
#bio span[id] {
|
||||
transition: none;
|
||||
animation: none;
|
||||
color: inherit;
|
||||
background-clip: initial !important;
|
||||
background: initial !important;
|
||||
background-clip: initial;
|
||||
background: initial;
|
||||
&::before {
|
||||
content: "";
|
||||
display: inline-flex;
|
||||
|
|
@ -71,12 +71,21 @@
|
|||
#pansexual::before {
|
||||
background-image: url("/assets/img/flag/pansexual.svg");
|
||||
}
|
||||
footer span::before {
|
||||
background-image: url("/assets/img/flag/trans.svg");
|
||||
}
|
||||
/* Jumping critters */
|
||||
#pkmn span:hover {
|
||||
animation: none !important;
|
||||
animation: none;
|
||||
transform: translateY(-4px);
|
||||
}
|
||||
#art div {
|
||||
transform: none;
|
||||
}
|
||||
main article > .postscript {
|
||||
& p,
|
||||
p > img {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
#blog #posts a {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,146 +1,103 @@
|
|||
body > nav::before,
|
||||
body::after {
|
||||
z-index: -1;
|
||||
content: "";
|
||||
position: absolute;
|
||||
mask-image: url("/assets/img/theme/sundae_sit-lines.png");
|
||||
mask-repeat: no-repeat;
|
||||
margin: 0;
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
body > nav::before {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
mask-size: 160%;
|
||||
-webkit-mask-position-x: -25px;
|
||||
-webkit-mask-position-y: 90%;
|
||||
}
|
||||
|
||||
body::after {
|
||||
content: none;
|
||||
mask-size: 100%;
|
||||
width: 100%;
|
||||
height: 100vw;
|
||||
-webkit-mask-position-x: 0;
|
||||
-webkit-mask-position-y: bottom;
|
||||
}
|
||||
|
||||
body > nav {
|
||||
.navbar {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--pad-m);
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
overflow-x: hidden;
|
||||
overflow-y: scroll;
|
||||
padding: var(--pad-l);
|
||||
position: fixed;
|
||||
width: var(--view);
|
||||
height: 100%;
|
||||
overflow-y: scroll;
|
||||
scrollbar-width: none;
|
||||
& * svg,
|
||||
li img {
|
||||
width: var(--view);
|
||||
& section {
|
||||
font-weight: bold;
|
||||
& h3 {
|
||||
font-size: 1.4rem;
|
||||
height: var(--pad-xl);
|
||||
margin: var(--pad-s) auto 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
& ul {
|
||||
margin: 0 var(--pad-s) var(--pad-s);
|
||||
padding: 0;
|
||||
& li {
|
||||
margin-bottom: inherit;
|
||||
& a,
|
||||
button {
|
||||
display: flex;
|
||||
font-size: 1.125rem;
|
||||
font-weight: bold;
|
||||
height: 36px;
|
||||
line-height: 2.125rem;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
}
|
||||
& img,
|
||||
svg {
|
||||
align-self: center;
|
||||
margin: 0 8px 0 8px;
|
||||
width: 20px;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
& details {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
& ul {
|
||||
margin: var(--pad-sm);
|
||||
padding: 0;
|
||||
|
||||
& li,
|
||||
button {
|
||||
padding: 0;
|
||||
align-items: center;
|
||||
margin-bottom: inherit;
|
||||
|
||||
& img {
|
||||
border-radius: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
& details {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
& li *:is(a ,button) {
|
||||
display: flex;
|
||||
font-size: 1.125rem;
|
||||
width: 100%;
|
||||
font-weight: bold;
|
||||
height: 36px;
|
||||
line-height: var(--pad-xl);
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
& > nav {
|
||||
gap: var(--pad-m);
|
||||
border-right-width: 1px;
|
||||
border-right-style: solid;
|
||||
|
||||
& li *:is(a ,button) {
|
||||
align-items: center;
|
||||
border-style: solid;
|
||||
border-width: 2px;
|
||||
border-radius: var(--round);
|
||||
}
|
||||
|
||||
& details {
|
||||
border-radius: var(--round);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
& details > summary {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
height: var(--pad-xl);
|
||||
}
|
||||
& details[open], details:not([open]) {
|
||||
border-style: solid;
|
||||
border-width: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 920px) {
|
||||
body > nav {
|
||||
position: initial;
|
||||
width: 100%;
|
||||
overflow: initial;
|
||||
flex-direction: row;
|
||||
justify-content: start;
|
||||
& li *:is(a ,button) {
|
||||
line-height: initial;
|
||||
}
|
||||
& details {
|
||||
width: 100%;
|
||||
height: max-content;
|
||||
}
|
||||
}
|
||||
body > nav::before {
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 620px) {
|
||||
body > nav {
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
border: 0;
|
||||
width: 100%;
|
||||
|
||||
& details {
|
||||
height: fit-content;
|
||||
}
|
||||
}
|
||||
|
||||
body::after {
|
||||
#default::before,
|
||||
body::after {
|
||||
content: "";
|
||||
height: inherit;
|
||||
margin: 0;
|
||||
mask-image: url("/assets/img/theme/sundae_sit-lines.png");
|
||||
mask-repeat: no-repeat;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
width: inherit;
|
||||
z-index: -1;
|
||||
}
|
||||
#default::before {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
mask-position-x: -25px;
|
||||
mask-position-y: 90%;
|
||||
mask-size: 160%;
|
||||
}
|
||||
body::after {
|
||||
content: none;
|
||||
height: 100vw;
|
||||
mask-position-x: 0;
|
||||
mask-position-y: bottom;
|
||||
mask-size: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
#floating {
|
||||
border-bottom-right-radius: var(--pad-l);
|
||||
border-bottom-style: solid;
|
||||
border-bottom-width: 2px;
|
||||
border-right-style: solid;
|
||||
border-right-width: 2px;
|
||||
height: fit-content;
|
||||
top: 0;
|
||||
width: var(--float);
|
||||
& button {
|
||||
font-size: 0;
|
||||
width: fit-content;
|
||||
}
|
||||
& a {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
#sidebar {
|
||||
background: none;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
#floating,
|
||||
#sidebar {
|
||||
z-index: 2;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,2 +1,36 @@
|
|||
@import url("./theme-dark.css");
|
||||
@import url("./theme-light.css");
|
||||
body {
|
||||
font-family: "Rubik", sans-serif;
|
||||
}
|
||||
main article,
|
||||
main article a:has(figure),
|
||||
#blog .addendum,
|
||||
#blog #posts a,
|
||||
#gallery #artworks a,
|
||||
header a, .navbar section, .navbar li :is(a, button) {
|
||||
border-radius: var(--round);
|
||||
border-style: solid;
|
||||
border-width: 2px;
|
||||
}
|
||||
main article {
|
||||
& a figure {
|
||||
border-color: inherit;
|
||||
}
|
||||
}
|
||||
header {
|
||||
margin-top: var(--pad-xl);
|
||||
margin-left: calc(var(--view) + var(--pad-xl));
|
||||
& a {
|
||||
padding: var(--pad-s);
|
||||
}
|
||||
}
|
||||
#blog {
|
||||
& [alt="Profile picture"] {
|
||||
border-radius: 100%;
|
||||
}
|
||||
}
|
||||
#default {
|
||||
border-right-style: solid;
|
||||
border-right-width: 2px;
|
||||
}
|
||||
|
|
@ -1,117 +1,86 @@
|
|||
@media (prefers-color-scheme: dark) {
|
||||
article,
|
||||
main article,
|
||||
body,
|
||||
header svg {
|
||||
color: var(--secondary-light-300);
|
||||
}
|
||||
|
||||
article {
|
||||
main article {
|
||||
border-color: var(--secondary-300);
|
||||
background-color: var(--secondary-200);
|
||||
|
||||
& aside {
|
||||
& #default {
|
||||
box-shadow: inset 0 0 0 2px var(--secondary-500);
|
||||
background-color: var(--secondary-300);
|
||||
}
|
||||
|
||||
& s,
|
||||
u {
|
||||
text-decoration-color: color-mix(in lch, red, var(--secondary-500) 20%);
|
||||
}
|
||||
|
||||
& code:not(pre *) {
|
||||
color: var(--secondary-400);
|
||||
background-color: var(--secondary-light-400);
|
||||
}
|
||||
|
||||
& pre {
|
||||
background-color: var(--secondary-100);
|
||||
|
||||
&:hover {
|
||||
border-color: var(--secondary);
|
||||
background-color: var(--secondary-400);
|
||||
}
|
||||
}
|
||||
|
||||
& pre,
|
||||
code {
|
||||
border-color: var(--secondary-400);
|
||||
}
|
||||
|
||||
/* blog.css */
|
||||
& .post-warning {
|
||||
background-color: var(--secondary);
|
||||
color: var(--secondary-100);
|
||||
|
||||
&::before,
|
||||
&::after {
|
||||
background-color: var(--secondary);
|
||||
}
|
||||
}
|
||||
|
||||
& .addendum {
|
||||
box-shadow: inset 0 0 0 2px var(--secondary);
|
||||
border-image-source: linear-gradient(
|
||||
45deg,
|
||||
var(--secondary),
|
||||
var(--secondary-600),
|
||||
var(--secondary)
|
||||
);
|
||||
background-color: var(--secondary-400);
|
||||
border-color: var(--secondary);
|
||||
}
|
||||
& ul li::before {
|
||||
background-color: var(--secondary-light-300);
|
||||
}
|
||||
}
|
||||
|
||||
#posts {
|
||||
& p:not(:last-child) {
|
||||
color: var(--secondary-light-700);
|
||||
}
|
||||
}
|
||||
/* default.css */
|
||||
body {
|
||||
background-color: var(--secondary-100);
|
||||
& :is(a, button):not(span *, .postscript *, dialog *),
|
||||
span:has(a) {
|
||||
& a:not([class]),
|
||||
button {
|
||||
color: var(--secondary-light-400);
|
||||
border-color: var(--secondary-600);
|
||||
background-color: var(--secondary-300);
|
||||
background-color: color-mix(in lch, var(--secondary-300), transparent);
|
||||
&:is(:hover, :focus) {
|
||||
color: var(--secondary-light-500);
|
||||
border-color: currentColor;
|
||||
background-color: var(--secondary-500);
|
||||
}
|
||||
|
||||
&:is(.header-anchor):is(:hover, :focus) {
|
||||
background-color: var(--secondary-light-400);
|
||||
color: var(--secondary-300);
|
||||
box-shadow: 0 0 0 2px var(--secondary-300);
|
||||
}
|
||||
}
|
||||
& span a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
& > nav {
|
||||
background-color: inherit;
|
||||
border-color: var(--secondary);
|
||||
& details {
|
||||
& #default,
|
||||
#floating {
|
||||
background-color: var(--secondary-100);
|
||||
&:not([open]) {
|
||||
color: var(--secondary);
|
||||
}
|
||||
}
|
||||
|
||||
& details[open] {
|
||||
border-color: var(--secondary);
|
||||
& section {
|
||||
border-color: var(--secondary);
|
||||
background-color: var(--secondary-300);
|
||||
color: var(--secondary-light-300);
|
||||
|
||||
& a[aria-current] {
|
||||
color: var(--secondary-500);
|
||||
border-color: var(--secondary-light-500);
|
||||
background-color: var(--secondary-light-500);
|
||||
}
|
||||
}
|
||||
|
||||
&::after {
|
||||
background-image: linear-gradient(
|
||||
to bottom,
|
||||
|
|
@ -120,34 +89,20 @@
|
|||
);
|
||||
}
|
||||
}
|
||||
|
||||
&::after,
|
||||
& > nav::before {
|
||||
& #default::before {
|
||||
background-color: var(--secondary);
|
||||
}
|
||||
}
|
||||
|
||||
/* home.css */
|
||||
ul:not([role]) li::before {
|
||||
background-color: var(--secondary-light-300);
|
||||
}
|
||||
|
||||
#interests {
|
||||
& a:is(:hover, :focus):not(.header-anchor) {
|
||||
box-shadow: 0 0 0 1px currentColor;
|
||||
background-color: var(--secondary-500);
|
||||
}
|
||||
|
||||
& img {
|
||||
box-shadow: 0 0 0 1px
|
||||
color-mix(in lch, transparent, var(--secondary-500) 70%);
|
||||
}
|
||||
|
||||
& details h3 {
|
||||
border-color: var(--secondary-600);
|
||||
}
|
||||
}
|
||||
|
||||
a:has(img[src*="/assets/img/button"]) {
|
||||
background-color: unset;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,117 +1,86 @@
|
|||
@media (prefers-color-scheme: light) {
|
||||
article,
|
||||
main article,
|
||||
body,
|
||||
header svg {
|
||||
color: var(--primary-dark-300);
|
||||
}
|
||||
|
||||
article {
|
||||
main article {
|
||||
border-color: var(--primary-300);
|
||||
background-color: var(--primary-200);
|
||||
|
||||
& aside {
|
||||
& #default {
|
||||
box-shadow: inset 0 0 0 2px var(--primary-500);
|
||||
background-color: var(--primary-300);
|
||||
}
|
||||
|
||||
& s,
|
||||
u {
|
||||
text-decoration-color: color-mix(in lch, red, var(--primary-500) 20%);
|
||||
}
|
||||
|
||||
& code:not(pre *) {
|
||||
color: var(--primary-400);
|
||||
background-color: var(--primary-dark-400);
|
||||
}
|
||||
|
||||
& pre {
|
||||
background-color: var(--primary-100);
|
||||
|
||||
&:hover {
|
||||
border-color: var(--primary);
|
||||
background-color: var(--primary-400);
|
||||
}
|
||||
}
|
||||
|
||||
& pre,
|
||||
code {
|
||||
border-color: var(--primary-400);
|
||||
}
|
||||
|
||||
/* blog.css */
|
||||
& .post-warning {
|
||||
background-color: var(--primary);
|
||||
color: var(--primary-dark-100);
|
||||
|
||||
&::before,
|
||||
&::after {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
}
|
||||
|
||||
& .addendum {
|
||||
box-shadow: inset 0 0 0 2px var(--primary);
|
||||
border-image-source: linear-gradient(
|
||||
45deg,
|
||||
var(--primary),
|
||||
var(--primary-600),
|
||||
var(--primary)
|
||||
);
|
||||
background-color: var(--primary-400);
|
||||
border-color: var(--primary);
|
||||
}
|
||||
& ul:not([role]) li::before {
|
||||
background-color: var(--primary-dark-300);
|
||||
}
|
||||
}
|
||||
|
||||
#posts {
|
||||
& p:not(:last-child) {
|
||||
color: var(--primary-dark-700);
|
||||
}
|
||||
}
|
||||
/* default.css */
|
||||
body {
|
||||
background-color: var(--primary-100);
|
||||
& :is(a, button):not(span *, .postscript *, dialog *),
|
||||
span:has(a) {
|
||||
& a:not([class]),
|
||||
button {
|
||||
color: var(--primary-dark-400);
|
||||
border-color: var(--primary-600);
|
||||
background-color: var(--primary-400);
|
||||
background-color: color-mix(in lch, var(--primary-400), transparent);
|
||||
&:is(:hover, :focus) {
|
||||
color: var(--primary-dark-500);
|
||||
border-color: currentColor;
|
||||
background-color: var(--primary-600);
|
||||
}
|
||||
|
||||
&:is(.header-anchor):is(:hover, :focus) {
|
||||
background-color: var(--primary-dark-400);
|
||||
color: var(--primary-300);
|
||||
box-shadow: 0 0 0 2px var(--primary-300);
|
||||
}
|
||||
}
|
||||
& span a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
& > nav {
|
||||
background-color: inherit;
|
||||
border-color: var(--primary-dark-500);
|
||||
& details {
|
||||
& #default,
|
||||
#floating {
|
||||
background-color: var(--primary-100);
|
||||
&:not([open]) {
|
||||
color: var(--primary-dark-500);
|
||||
}
|
||||
}
|
||||
|
||||
& details[open] {
|
||||
border-color: var(--primary-dark-500);
|
||||
& section {
|
||||
border-color: var(--primary-dark-800);
|
||||
background-color: var(--primary-300);
|
||||
color: var(--primary-dark-300);
|
||||
|
||||
& a[aria-current] {
|
||||
color: var(--primary-500);
|
||||
border-color: var(--primary-dark-500);
|
||||
background-color: var(--primary-dark-500);
|
||||
}
|
||||
}
|
||||
|
||||
&::after {
|
||||
background-image: linear-gradient(
|
||||
to bottom,
|
||||
|
|
@ -120,34 +89,20 @@
|
|||
);
|
||||
}
|
||||
}
|
||||
|
||||
&::after,
|
||||
& > nav::before {
|
||||
& #default::before {
|
||||
background-color: var(--primary-dark-500);
|
||||
}
|
||||
}
|
||||
|
||||
/* home.css */
|
||||
ul:not([role]) li::before {
|
||||
background-color: var(--primary-dark-300);
|
||||
}
|
||||
|
||||
#interests {
|
||||
& a:is(:hover, :focus):not(.header-anchor) {
|
||||
box-shadow: 0 0 0 1px currentColor;
|
||||
background-color: var(--primary-500);
|
||||
}
|
||||
|
||||
& img {
|
||||
box-shadow: 0 0 0 1px
|
||||
color-mix(in lch, transparent, var(--primary-dark-500) 30%);
|
||||
}
|
||||
|
||||
& details h3 {
|
||||
border-color: var(--primary-dark-600);
|
||||
}
|
||||
}
|
||||
|
||||
a:has(img[src*="/assets/img/button"]) {
|
||||
background-color: unset;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -39,17 +39,21 @@
|
|||
--secondary-700: color-mix(in lch, var(--secondary), var(--dark) 30%);
|
||||
--secondary-800: color-mix(in lch, var(--secondary), var(--dark) 20%);
|
||||
--secondary-900: color-mix(in lch, var(--secondary), var(--dark) 10%);
|
||||
--trans: 300ms;
|
||||
--image: 24rem;
|
||||
--post: 75ch;
|
||||
--round: 16px;
|
||||
--pad-xxl: 4rem;
|
||||
--pad-xl: 2rem;
|
||||
--pad-lm: 1.4rem;
|
||||
--pad-l: 1rem;
|
||||
--avatar: 64px; /* Blog avatar */
|
||||
--flag: 45deg; /* Pride flag */
|
||||
--image: 24rem; /* Postscript images */
|
||||
--main: 108rem; /* Main width */
|
||||
--post: 75ch; /* Article text width */
|
||||
--view: 300px; /* Sidebar width */
|
||||
--float: 88px; /* Floating sidebar width */
|
||||
--thumb: 16rem; /* Gallery artwork thumbnail */
|
||||
--pad-s: 0.4rem;
|
||||
--pad-m: 0.8rem;
|
||||
--pad-sm: 0.4rem;
|
||||
--flag: 45deg;
|
||||
--pad-l: 1rem;
|
||||
--pad-xl: 2rem;
|
||||
--pad-xxl: 4rem;
|
||||
--round: 16px; /* Border radius */
|
||||
--trans: 300ms;
|
||||
--paw: url("/assets/img/theme/paw.svg");
|
||||
--paw-tiled: url("/assets/img/theme/paw-tiled.png");
|
||||
--outlined: drop-shadow(0 0.5px var(--dark)) drop-shadow(0 -0.5px var(--dark))
|
||||
|
|
@ -98,7 +102,15 @@
|
|||
#00d2ff 0
|
||||
);
|
||||
}
|
||||
@keyframes slide {
|
||||
0% {
|
||||
background-position: 0% 100%;
|
||||
}
|
||||
|
||||
100% {
|
||||
background-position: 200% 100%;
|
||||
}
|
||||
}
|
||||
@keyframes mainbg {
|
||||
0% {
|
||||
background-position: 0rem 0rem;
|
||||
|
|
@ -109,32 +121,24 @@
|
|||
}
|
||||
}
|
||||
|
||||
@keyframes slide {
|
||||
@keyframes jump {
|
||||
0% {
|
||||
background-position: 0% 100%;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
100% {
|
||||
background-position: 200% 100%;
|
||||
transform: translateY(-4px);
|
||||
}
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Rubik;
|
||||
src: url("/assets/fonts/Rubik.ttf") format("truetype");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Urbanist;
|
||||
src: url("/assets/fonts/Urbanist-Bold.ttf") format("truetype");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Nosey Rodent;
|
||||
src: url("/assets/fonts/noseyrodent-Regular.ttf") format("truetype");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Impact;
|
||||
src: url("/assets/fonts/Impact-Regular.ttf") format("truetype");
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,14 +6,12 @@
|
|||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* Prevent font size inflation */
|
||||
html {
|
||||
-moz-text-size-adjust: none;
|
||||
-webkit-text-size-adjust: none;
|
||||
text-size-adjust: none;
|
||||
}
|
||||
|
||||
/* Remove default margin in favour of better control in authored CSS */
|
||||
body,
|
||||
h1,
|
||||
|
|
@ -26,21 +24,17 @@ blockquote,
|
|||
dl,
|
||||
dd {
|
||||
margin-block-end: 0;
|
||||
margin-block-start: 0;
|
||||
}
|
||||
|
||||
/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
|
||||
ul[role='list'],
|
||||
ol[role='list'] {
|
||||
ul[role="list"],
|
||||
ol[role="list"] {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
/* Set core body defaults */
|
||||
body {
|
||||
min-height: 100vh;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
/* Set shorter line heights on headings and interactive elements */
|
||||
h1,
|
||||
h2,
|
||||
|
|
@ -51,7 +45,6 @@ input,
|
|||
label {
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
/* Balance text wrapping on headings */
|
||||
h1,
|
||||
h2,
|
||||
|
|
@ -59,20 +52,17 @@ h3,
|
|||
h4 {
|
||||
text-wrap: balance;
|
||||
}
|
||||
|
||||
/* A elements that don't have a class get default styles
|
||||
/* A elements that don't have a class get default styles */
|
||||
a:not([class]) {
|
||||
text-decoration-skip-ink: auto;
|
||||
color: currentColor;
|
||||
}
|
||||
*/
|
||||
|
||||
/* Make images easier to work with */
|
||||
img,
|
||||
picture {
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Inherit fonts for inputs and buttons */
|
||||
input,
|
||||
button,
|
||||
|
|
@ -81,12 +71,10 @@ select {
|
|||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
/* Make sure textareas without a rows attribute are not tiny */
|
||||
textarea:not([rows]) {
|
||||
min-height: 10em;
|
||||
}
|
||||
|
||||
/* Anything that has been anchored to should have extra scroll margin */
|
||||
:target {
|
||||
scroll-margin-block: 5ex;
|
||||
|
|
|
|||
136
_src/assets/img/icon/listenbrainz.svg
Normal file
136
_src/assets/img/icon/listenbrainz.svg
Normal file
|
|
@ -0,0 +1,136 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
width="512"
|
||||
height="512"
|
||||
version="1.1"
|
||||
id="svg17"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<defs
|
||||
id="defs17">
|
||||
<clipPath
|
||||
id="b-5">
|
||||
<path
|
||||
id="use2-3"
|
||||
d="m 75.354,33.239 h 51.433 v 90.792 H 75.354 Z" />
|
||||
</clipPath>
|
||||
<clipPath
|
||||
id="clipPath1">
|
||||
<path
|
||||
id="use1"
|
||||
d="m 75.354,33.239 h 51.433 v 90.792 H 75.354 Z" />
|
||||
</clipPath>
|
||||
<clipPath
|
||||
id="clipPath3">
|
||||
<path
|
||||
id="use3"
|
||||
d="m 75.354,33.239 h 51.433 v 90.792 H 75.354 Z" />
|
||||
</clipPath>
|
||||
<path
|
||||
id="path4-1"
|
||||
d="m 75.354,33.239 h 51.433 v 90.792 H 75.354 Z" />
|
||||
</defs>
|
||||
<rect
|
||||
width="512"
|
||||
height="512"
|
||||
id="rect1"
|
||||
x="0"
|
||||
y="0"
|
||||
style="fill:#ffffff" />
|
||||
<path
|
||||
fill="#eb743b"
|
||||
d="M 261.91399,85.677124 V 426.32288 L 406.21532,343.52703 V 168.47297 Z"
|
||||
id="path1-6"
|
||||
style="stroke-width:2.3656" />
|
||||
<path
|
||||
fill="#353070"
|
||||
d="M 250.08602,85.677124 105.78469,168.47297 v 175.05406 l 144.30133,82.79585 z"
|
||||
id="path2-3"
|
||||
style="stroke-width:2.3656" />
|
||||
<g
|
||||
opacity="0.07"
|
||||
id="g5-2"
|
||||
transform="matrix(2.3655955,0,0,2.3655955,83.65691,67.17107)">
|
||||
<defs
|
||||
id="defs2-9">
|
||||
<path
|
||||
id="path17"
|
||||
d="m 75.354,33.239 h 51.433 v 90.792 H 75.354 Z" />
|
||||
</defs>
|
||||
<clipPath
|
||||
id="clipPath4">
|
||||
<path
|
||||
id="use4"
|
||||
d="m 75.354,33.239 h 51.433 v 90.792 H 75.354 Z" />
|
||||
</clipPath>
|
||||
<path
|
||||
clip-path="url(#b-5)"
|
||||
d="m 92.657,99.557 a 2.1,2.1 0 0 1 1.819,-1.03 c 0.378,0 0.752,0.104 1.078,0.297 a 2.12,2.12 0 0 1 0.735,2.898 2.097,2.097 0 0 1 -1.817,1.032 c -0.379,0 -0.755,-0.105 -1.084,-0.301 a 2.092,2.092 0 0 1 -0.964,-1.294 2.1,2.1 0 0 1 0.233,-1.602 m 12.602,22.362 a 2.121,2.121 0 0 1 -2.981,-0.225 2.116,2.116 0 0 1 0.231,-2.981 2.08,2.08 0 0 1 1.373,-0.512 2.117,2.117 0 0 1 2.109,2.278 2.086,2.086 0 0 1 -0.732,1.44 M 95.734,63.08 a 2.128,2.128 0 0 1 2.916,-0.656 2.12,2.12 0 0 1 0.66,2.919 2.115,2.115 0 0 1 -2.919,0.661 2.128,2.128 0 0 1 -0.657,-2.924 m 6.379,-20.187 c -0.6,0.951 -1.937,1.271 -2.912,0.653 l -0.096,-0.062 a 2.107,2.107 0 0 1 -0.557,-2.851 2.093,2.093 0 0 1 1.784,-0.98 2.11,2.11 0 0 1 1.781,3.24 m 16.767,11.598 a 2.096,2.096 0 0 1 1.783,-0.98 c 0.4,0 0.79,0.113 1.125,0.325 0.481,0.304 0.813,0.775 0.937,1.33 a 2.08,2.08 0 0 1 -0.28,1.584 c -0.597,0.951 -1.938,1.273 -2.912,0.653 l -0.093,-0.062 a 2.105,2.105 0 0 1 -0.56,-2.85 m 0,23.463 a 2.096,2.096 0 0 1 1.783,-0.98 c 0.4,0 0.79,0.112 1.125,0.326 0.481,0.304 0.813,0.774 0.937,1.329 a 2.083,2.083 0 0 1 -0.28,1.585 c -0.597,0.95 -1.938,1.271 -2.912,0.652 l -0.093,-0.062 a 2.105,2.105 0 0 1 -0.56,-2.85 m 0,26.303 a 2.099,2.099 0 0 1 1.783,-0.98 c 0.4,0 0.79,0.113 1.125,0.326 0.481,0.304 0.813,0.775 0.937,1.33 a 2.08,2.08 0 0 1 -0.28,1.584 c -0.597,0.951 -1.938,1.271 -2.912,0.653 l -0.093,-0.062 a 2.107,2.107 0 0 1 -0.56,-2.851"
|
||||
id="path3-7" />
|
||||
<path
|
||||
clip-path="url(#b-5)"
|
||||
d="m 108.53,113.927 a 6.11,6.11 0 0 0 -8.631,-0.662 6.12,6.12 0 0 0 -2.087,5.396 c -1.949,0.701 -4.258,1.366 -5.328,1.332 -0.822,-0.043 -1.302,-0.345 -2.224,-0.971 -1.172,-0.795 -2.418,-1.512 -4.149,-1.847 2.936,-2.761 6.009,-6.83 8.584,-12.834 a 6.15,6.15 0 0 0 5.039,-2.972 c 1.724,-2.896 0.773,-6.659 -2.124,-8.394 a 6.133,6.133 0 0 0 -3.134,-0.864 6.154,6.154 0 0 0 -5.261,2.986 6.079,6.079 0 0 0 -0.678,4.636 6.075,6.075 0 0 0 2.302,3.429 c -4.053,9.218 -9.219,13.08 -12.565,14.685 a 2.016,2.016 0 0 0 -0.361,0.168 c -1.186,0.531 -2.05,0.704 -2.558,0.808 v 4 c 0.275,-0.03 1.884,-0.118 4.247,-1.192 5.347,-1.357 6.839,-0.354 8.407,0.709 1.021,0.692 2.291,1.554 4.263,1.655 0.099,0.006 0.204,0.009 0.308,0.009 2.11,0 5.172,-1.022 7.021,-1.723 a 6.132,6.132 0 0 0 4.285,1.75 6.112,6.112 0 0 0 3.983,-1.476 6.072,6.072 0 0 0 2.119,-4.176 6.072,6.072 0 0 0 -1.458,-4.452 M 92.657,97.151 a 2.1141576,2.1141576 0 0 1 3.632,2.165 2.097,2.097 0 0 1 -1.817,1.032 c -0.379,0 -0.755,-0.105 -1.084,-0.301 a 2.092,2.092 0 0 1 -0.964,-1.294 2.101,2.101 0 0 1 0.233,-1.602 m 12.602,22.363 a 2.121,2.121 0 0 1 -2.981,-0.225 2.116,2.116 0 0 1 0.231,-2.981 2.08,2.08 0 0 1 1.373,-0.512 2.117,2.117 0 0 1 2.109,2.278 2.086,2.086 0 0 1 -0.732,1.44 m 1.045,-81.487 a 6.088,6.088 0 0 0 -2.708,-3.844 6.12,6.12 0 0 0 -3.264,-0.944 6.076,6.076 0 0 0 -5.174,2.85 6.108,6.108 0 0 0 0.144,6.758 c -3.646,4.124 -8.707,4.314 -9.943,4.293 -3.692,-1.604 -7.234,-2.164 -10.005,-2.317 v 3.996 c 2.442,0.144 5.553,0.686 8.748,2.136 0.005,0.002 0.01,0.002 0.015,0.005 3.445,1.562 6.334,3.927 8.607,7.041 a 6.364,6.364 0 0 0 -0.381,0.538 c -1.796,2.854 -0.943,6.643 1.903,8.444 0.98,0.622 2.111,0.951 3.269,0.951 a 6.105,6.105 0 0 0 5.183,-2.851 c 1.806,-2.851 0.951,-6.642 -1.908,-8.453 -1.384,-0.872 -3.092,-1.114 -4.667,-0.755 -1.538,-2.155 -3.323,-4.017 -5.345,-5.567 2.517,-0.778 5.401,-2.268 7.78,-5.095 a 6.18,6.18 0 0 0 1.77,0.266 6.08,6.08 0 0 0 5.172,-2.848 6.053,6.053 0 0 0 0.804,-4.604 m -10.57,22.647 a 2.128,2.128 0 0 1 2.916,-0.656 2.12,2.12 0 0 1 0.66,2.919 2.115,2.115 0 0 1 -2.919,0.661 2.128,2.128 0 0 1 -0.657,-2.924 m 6.379,-20.187 c -0.6,0.951 -1.937,1.271 -2.912,0.653 l -0.096,-0.062 a 2.107,2.107 0 0 1 -0.557,-2.851 2.093,2.093 0 0 1 1.784,-0.98 2.11,2.11 0 0 1 1.781,3.24"
|
||||
id="path5-2" />
|
||||
<path
|
||||
clip-path="url(#b-5)"
|
||||
d="m 115,79.011 a 6.036,6.036 0 0 0 2.11,2.649 6.098,6.098 0 0 0 3.55,1.14 6.083,6.083 0 0 0 5.173,-2.848 6.064,6.064 0 0 0 0.805,-4.605 6.103,6.103 0 0 0 -2.709,-3.844 6.128,6.128 0 0 0 -3.266,-0.944 c -0.125,0 -0.25,0.008 -0.375,0.018 -0.71,-3.158 -0.919,-7.769 0.035,-11.265 0.113,0.011 0.225,0.024 0.337,0.024 a 6.08,6.08 0 0 0 5.173,-2.848 6.062,6.062 0 0 0 0.805,-4.604 6.103,6.103 0 0 0 -2.709,-3.844 6.128,6.128 0 0 0 -3.266,-0.944 6.079,6.079 0 0 0 -5.173,2.85 6.104,6.104 0 0 0 1.025,7.764 c 0.021,0.02 0.048,0.037 0.071,0.059 -1.349,4.518 -1.145,10.324 -0.036,14.417 -0.144,0.132 -0.294,0.254 -0.426,0.399 a 6.327,6.327 0 0 0 -0.634,0.825 6.2,6.2 0 0 0 -0.71,1.578 c -3.371,0.488 -5.198,1.671 -6.824,2.729 -2.035,1.324 -3.961,2.572 -9.636,2.666 -1.963,-0.23 -3.552,-0.178 -5.29,-0.116 -1.43,0.052 -2.91,0.105 -4.848,0.003 -1.335,-0.071 -2.104,-0.882 -3.458,-2.424 -1.803,-2.055 -4.219,-4.648 -9.369,-5.022 v 4 c 3.295,0.299 4.796,1.887 6.356,3.667 1.487,1.694 3.175,3.615 6.256,3.782 2.118,0.114 3.76,0.052 5.208,0.001 2.491,-0.092 4.453,-0.161 7.855,0.683 2.608,0.644 12.099,9.674 14.774,14.323 -0.109,0.142 -0.219,0.282 -0.314,0.434 -1.743,2.755 -1.026,6.385 1.62,8.251 0.072,0.052 0.151,0.104 0.283,0.191 0.981,0.621 2.11,0.948 3.267,0.948 a 6.081,6.081 0 0 0 5.173,-2.849 6.06,6.06 0 0 0 0.805,-4.603 6.1,6.1 0 0 0 -2.709,-3.845 6.128,6.128 0 0 0 -4.809,-0.749 c -2.56,-4.188 -8.652,-10.455 -13.189,-13.792 1.813,-0.628 3.05,-1.436 4.212,-2.188 1.427,-0.93 2.614,-1.69 4.857,-2.067 m 3.88,-26.926 a 2.096,2.096 0 0 1 1.783,-0.98 c 0.4,0 0.79,0.113 1.125,0.325 0.481,0.304 0.813,0.775 0.937,1.33 a 2.08,2.08 0 0 1 -0.28,1.584 c -0.597,0.951 -1.938,1.273 -2.912,0.653 l -0.093,-0.062 a 2.105,2.105 0 0 1 -0.56,-2.85 m 0,23.463 a 2.096,2.096 0 0 1 1.783,-0.98 c 0.4,0 0.79,0.112 1.125,0.326 0.481,0.304 0.813,0.774 0.937,1.329 a 2.083,2.083 0 0 1 -0.28,1.585 c -0.597,0.95 -1.938,1.272 -2.912,0.652 l -0.093,-0.062 a 2.105,2.105 0 0 1 -0.56,-2.85 m 0,26.304 a 2.099,2.099 0 0 1 1.783,-0.98 c 0.4,0 0.79,0.113 1.125,0.326 0.481,0.304 0.813,0.775 0.937,1.33 a 2.08,2.08 0 0 1 -0.28,1.584 c -0.597,0.951 -1.938,1.271 -2.912,0.653 l -0.093,-0.062 a 2.107,2.107 0 0 1 -0.56,-2.851"
|
||||
id="path6-7" />
|
||||
</g>
|
||||
<path
|
||||
fill="#d3562c"
|
||||
d="m 340.39499,343.77306 a 14.453789,14.453789 0 0 0 -20.41746,-1.56603 14.477444,14.477444 0 0 0 -4.93699,12.76475 c -4.61055,1.65829 -10.07271,3.23141 -12.6039,3.15098 -1.94452,-0.10172 -3.08,-0.81613 -5.26108,-2.297 -2.77248,-1.88064 -5.72001,-3.57678 -9.81486,-4.36925 6.94539,-6.53141 14.21487,-16.15702 20.30628,-30.36005 a 14.548412,14.548412 0 0 0 11.92023,-7.03055 c 4.07829,-6.85077 1.82861,-15.7525 -5.02452,-19.85681 a 14.508197,14.508197 0 0 0 -7.41378,-2.04388 14.557875,14.557875 0 0 0 -12.4454,7.06367 14.380455,14.380455 0 0 0 -1.60387,10.9669 14.370993,14.370993 0 0 0 5.4456,8.11163 c -9.58776,21.80606 -21.80843,30.94199 -29.72371,34.73877 a 4.7690405,4.7690405 0 0 0 -0.85398,0.39742 c -2.80559,1.25613 -4.84947,1.66538 -6.05119,1.9114 v 9.46238 c 0.65054,-0.071 4.45678,-0.27914 10.04668,-2.81979 12.64884,-3.21011 16.17831,-0.83742 19.88756,1.67721 2.41528,1.63699 5.41958,3.67614 10.08454,3.91506 0.23419,0.0142 0.48258,0.0213 0.7286,0.0213 4.99141,0 12.23486,-2.41764 16.60885,-4.07592 a 14.505832,14.505832 0 0 0 10.13657,4.13979 14.45852,14.45852 0 0 0 9.42217,-3.49162 14.363896,14.363896 0 0 0 5.0127,-9.87872 14.363896,14.363896 0 0 0 -3.44904,-10.53163 m -37.5491,-39.68523 a 5.0012417,5.0012417 0 0 1 8.59184,5.12151 4.9606538,4.9606538 0 0 1 -4.29828,2.44129 c -0.89656,0 -1.78603,-0.24838 -2.56431,-0.71204 a 4.9488258,4.9488258 0 0 1 -2.28043,-3.06108 4.9701161,4.9701161 0 0 1 0.55118,-3.78968 m 29.81124,52.90181 a 5.0174281,5.0174281 0 0 1 -7.05184,-0.53226 5.0056001,5.0056001 0 0 1 0.54645,-7.05184 4.9204386,4.9204386 0 0 1 3.24796,-1.21119 5.0079657,5.0079657 0 0 1 4.98904,5.38883 4.9346322,4.9346322 0 0 1 -1.73161,3.40646"
|
||||
id="path7-0"
|
||||
style="stroke-width:2.3656" />
|
||||
<path
|
||||
d="M 283.20672,193.5743"
|
||||
id="path8-9"
|
||||
style="stroke-width:2.3656" />
|
||||
<path
|
||||
fill="#d3562c"
|
||||
d="m 335.12917,161.86822 a 14.401745,14.401745 0 0 0 -6.40603,-9.09335 14.477444,14.477444 0 0 0 -7.7213,-2.23312 14.373358,14.373358 0 0 0 -12.23959,6.74195 14.449057,14.449057 0 0 0 0.34064,15.98669 c -8.62496,9.75572 -20.59724,10.20518 -23.52111,10.15551 -8.73378,-3.79442 -17.11272,-5.11915 -23.66779,-5.48109 v 9.45292 c 5.77679,0.34065 13.13615,1.6228 20.69423,5.05291 0.0118,0.005 0.0237,0.005 0.0355,0.0118 8.14947,3.69506 14.98368,9.28969 20.36068,16.65616 a 14.680886,14.680886 0 0 0 -0.9013,1.27269 c -4.2486,6.75141 -2.23075,15.71465 4.50173,19.97509 2.31829,1.4714 4.99378,2.24968 7.73313,2.24968 a 14.441961,14.441961 0 0 0 12.26089,-6.74431 c 4.27226,-6.74432 2.24968,-15.71229 -4.51356,-19.99638 -3.27398,-2.0628 -7.31442,-2.63528 -11.04023,-1.78603 -3.63829,-5.09786 -7.86088,-9.50259 -12.64411,-13.16927 5.9542,-1.84043 12.77658,-5.36517 18.40433,-12.05271 a 14.61938,14.61938 0 0 0 4.18711,0.62925 14.382821,14.382821 0 0 0 12.23485,-6.73958 14.311853,14.311853 0 0 0 1.90194,-10.88884 m -25.00434,53.57365 a 5.0339872,5.0339872 0 0 1 6.89808,-1.55184 5.0150625,5.0150625 0 0 1 1.56129,6.90518 5.0032345,5.0032345 0 0 1 -6.90517,1.56366 5.0339872,5.0339872 0 0 1 -1.5542,-6.917 m 15.09013,-47.75428 c -1.41935,2.24968 -4.58216,3.00667 -6.88861,1.54473 l -0.2271,-0.14666 a 4.9843097,4.9843097 0 0 1 -1.31763,-6.74432 4.9511914,4.9511914 0 0 1 4.22022,-2.31828 4.9914065,4.9914065 0 0 1 4.21312,7.66453"
|
||||
id="path9-3"
|
||||
style="stroke-width:2.3656" />
|
||||
<path
|
||||
fill="#d3562c"
|
||||
d="m 355.70039,261.17592 a 14.278734,14.278734 0 0 0 4.99141,6.26647 14.425401,14.425401 0 0 0 8.39786,2.69677 14.385186,14.385186 0 0 0 12.23723,-6.73958 14.342606,14.342606 0 0 0 1.9043,-10.8912 14.437229,14.437229 0 0 0 -6.4084,-9.09335 14.496369,14.496369 0 0 0 -7.72603,-2.23312 c -0.2957,0 -0.5914,0.0189 -0.8871,0.0426 -1.67957,-7.47055 -2.17398,-18.37831 0.0828,-26.64843 0.26731,0.026 0.53226,0.0568 0.7972,0.0568 a 14.382821,14.382821 0 0 0 12.23723,-6.73721 14.34024,14.34024 0 0 0 1.9043,-10.89121 14.437229,14.437229 0 0 0 -6.4084,-9.09335 14.496369,14.496369 0 0 0 -7.72603,-2.23312 14.380455,14.380455 0 0 0 -12.23723,6.74195 14.439595,14.439595 0 0 0 2.42474,18.36648 c 0.0497,0.0473 0.11355,0.0875 0.16796,0.13957 -3.19119,10.68776 -2.70861,24.42241 -0.0852,34.10479 -0.34065,0.31226 -0.69549,0.60086 -1.00775,0.94388 a 14.967123,14.967123 0 0 0 -1.49979,1.95161 14.666692,14.666692 0 0 0 -1.67957,3.73291 c -7.97442,1.15441 -12.29636,3.95291 -16.14282,6.45571 -4.81399,3.12969 -9.37013,6.08195 -22.79488,6.30431 -4.64366,-0.54408 -8.4026,-0.42107 -12.514,-0.2744 -3.3828,0.12301 -6.88388,0.24838 -11.46841,0.007 -3.15807,-0.16796 -4.97721,-2.08645 -8.18023,-5.7342 -4.26517,-4.8613 -9.98044,-10.99529 -22.16326,-11.88002 V 256 c 7.79464,0.70495 11.34539,4.46388 15.03572,8.67464 3.51764,4.00732 7.51077,8.55163 14.79917,8.94668 5.01033,0.26968 8.89464,0.12301 12.32002,0.002 5.8927,-0.21764 10.534,-0.38086 18.58175,1.6157 6.16948,1.52344 28.62134,22.88477 34.94931,33.88242 -0.25785,0.33592 -0.51806,0.6671 -0.7428,1.02667 -4.12323,6.51722 -2.4271,15.10433 3.83227,19.51853 0.17032,0.12301 0.3572,0.24602 0.66946,0.45183 2.32065,1.46903 4.99141,2.24258 7.7284,2.24258 a 14.385186,14.385186 0 0 0 12.23723,-6.73958 14.335509,14.335509 0 0 0 1.9043,-10.88883 14.430133,14.430133 0 0 0 -6.4084,-9.09572 14.496369,14.496369 0 0 0 -11.37614,-1.77183 c -6.05593,-9.90711 -20.46714,-24.7323 -31.19984,-32.62629 4.28882,-1.4856 7.21506,-3.397 9.96388,-5.17593 3.37571,-2.19763 6.18367,-3.99549 11.4897,-4.88732 m 9.17851,-63.69602 a 4.9582882,4.9582882 0 0 1 4.21786,-2.31829 c 0.94624,0 1.86882,0.26732 2.66129,0.76882 1.13786,0.71914 1.92323,1.83334 2.21657,3.14625 a 4.9204386,4.9204386 0 0 1 -0.66237,3.7471 c -1.41226,2.24968 -4.58452,3.0114 -6.88861,1.54473 l -0.22,-0.14666 a 4.9795785,4.9795785 0 0 1 -1.32474,-6.74195 m 0,55.50397 a 4.9582882,4.9582882 0 0 1 4.21786,-2.31829 c 0.94624,0 1.86882,0.26495 2.66129,0.77119 1.13786,0.71914 1.92323,1.83097 2.21657,3.14387 a 4.929901,4.929901 0 0 1 -0.66237,3.74947 c -1.41226,2.24732 -4.58452,3.00667 -6.88861,1.54237 l -0.22,-0.14667 a 4.9795785,4.9795785 0 0 1 -1.32474,-6.74194 m 0,62.22462 a 4.965385,4.965385 0 0 1 4.21786,-2.31828 c 0.94624,0 1.86882,0.26731 2.66129,0.77118 1.13786,0.71914 1.92323,1.83334 2.21657,3.14624 a 4.9204386,4.9204386 0 0 1 -0.66237,3.74711 c -1.41226,2.24968 -4.58452,3.00667 -6.88861,1.54473 l -0.22,-0.14667 a 4.9843097,4.9843097 0 0 1 -1.32474,-6.74431"
|
||||
id="path10-6"
|
||||
style="stroke-width:2.3656" />
|
||||
<path
|
||||
fill="#fffedb"
|
||||
d="m 340.39499,336.67627 a 14.453789,14.453789 0 0 0 -20.41746,-1.56603 14.477444,14.477444 0 0 0 -4.93699,12.76476 c -4.61055,1.65828 -10.07271,3.2314 -12.6039,3.15097 -1.94452,-0.10172 -3.08,-0.81613 -5.26108,-2.29699 -2.77248,-1.88065 -5.72001,-3.57678 -9.81486,-4.36926 6.94539,-6.53141 14.21487,-16.15701 20.30628,-30.36005 a 14.548412,14.548412 0 0 0 11.92023,-7.03055 c 4.07829,-6.85076 1.82861,-15.7525 -5.02452,-19.85681 a 14.508197,14.508197 0 0 0 -7.41378,-2.04387 14.557875,14.557875 0 0 0 -12.4454,7.06367 14.380455,14.380455 0 0 0 -1.60387,10.9669 14.370993,14.370993 0 0 0 5.4456,8.11162 c -9.58776,21.80606 -21.80843,30.94199 -29.72371,34.73877 a 4.7690405,4.7690405 0 0 0 -0.85398,0.39742 c -2.80559,1.25613 -4.84947,1.66538 -6.05119,1.9114 v 9.46239 c 0.65054,-0.071 4.45678,-0.27914 10.04668,-2.81979 12.64884,-3.21012 16.17831,-0.83742 19.88756,1.6772 2.41528,1.637 5.41958,3.67614 10.08454,3.91506 0.23419,0.0142 0.48258,0.0213 0.7286,0.0213 4.99141,0 12.23486,-2.41763 16.60885,-4.07592 a 14.505832,14.505832 0 0 0 10.13657,4.1398 14.45852,14.45852 0 0 0 9.42217,-3.49162 14.363896,14.363896 0 0 0 5.0127,-9.87873 14.363896,14.363896 0 0 0 -3.44904,-10.53163 m -37.5491,-39.68523 a 5.0012417,5.0012417 0 0 1 8.59184,5.12151 4.9606538,4.9606538 0 0 1 -4.29828,2.4413 c -0.89656,0 -1.78603,-0.24839 -2.56431,-0.71205 a 4.9488258,4.9488258 0 0 1 -2.28043,-3.06108 4.9701161,4.9701161 0 0 1 0.55118,-3.78968 m 29.81124,52.90181 a 5.0174281,5.0174281 0 0 1 -7.05184,-0.53226 5.0056001,5.0056001 0 0 1 0.54645,-7.05184 4.9204386,4.9204386 0 0 1 3.24796,-1.21118 5.0079657,5.0079657 0 0 1 4.98904,5.38882 4.9346322,4.9346322 0 0 1 -1.73161,3.40646 m 2.47204,-192.76528 a 14.401745,14.401745 0 0 0 -6.40603,-9.09335 14.477444,14.477444 0 0 0 -7.7213,-2.23312 14.373358,14.373358 0 0 0 -12.23959,6.74195 14.449057,14.449057 0 0 0 0.34064,15.98669 c -8.62496,9.75572 -20.59724,10.20518 -23.52111,10.1555 -8.73378,-3.79441 -17.11272,-5.11915 -23.66779,-5.48108 v 9.45292 c 5.77679,0.34064 13.13615,1.6228 20.69423,5.05291 0.0118,0.005 0.0237,0.005 0.0355,0.0118 8.14947,3.69506 14.98368,9.28969 20.36068,16.65615 a 15.05465,15.05465 0 0 0 -0.9013,1.2727 c -4.2486,6.7514 -2.23075,15.71465 4.50173,19.97508 2.31829,1.4714 4.99378,2.24969 7.73313,2.24969 a 14.441961,14.441961 0 0 0 12.26089,-6.74432 c 4.27226,-6.74431 2.24968,-15.71228 -4.51356,-19.99638 -3.27398,-2.0628 -7.31442,-2.63527 -11.04023,-1.78602 -3.63829,-5.09786 -7.86088,-9.5026 -12.64411,-13.16927 5.9542,-1.84043 12.77658,-5.36517 18.40433,-12.05271 a 14.61938,14.61938 0 0 0 4.18711,0.62925 14.382821,14.382821 0 0 0 12.23485,-6.73722 14.31895,14.31895 0 0 0 1.90194,-10.8912 m -25.00434,53.57364 a 5.0339872,5.0339872 0 0 1 6.89808,-1.55183 5.0150625,5.0150625 0 0 1 1.56129,6.90517 5.0032345,5.0032345 0 0 1 -6.90517,1.56366 5.0339872,5.0339872 0 0 1 -1.5542,-6.917 m 15.09013,-47.75427 c -1.41935,2.24968 -4.58216,3.00667 -6.88861,1.54473 l -0.2271,-0.14667 a 4.9843097,4.9843097 0 0 1 -1.31763,-6.74431 4.9511914,4.9511914 0 0 1 4.22022,-2.31828 4.9914065,4.9914065 0 0 1 4.21312,7.66453"
|
||||
id="path11-0"
|
||||
style="stroke-width:2.3656" />
|
||||
<path
|
||||
fill="#fffedb"
|
||||
d="m 355.70039,254.07914 a 14.278734,14.278734 0 0 0 4.99141,6.26646 14.425401,14.425401 0 0 0 8.39786,2.69678 14.389917,14.389917 0 0 0 12.23723,-6.73722 14.344971,14.344971 0 0 0 1.9043,-10.89357 14.437229,14.437229 0 0 0 -6.4084,-9.09334 14.496369,14.496369 0 0 0 -7.72603,-2.23313 c -0.2957,0 -0.5914,0.0189 -0.8871,0.0426 -1.67957,-7.47055 -2.17398,-18.37831 0.0828,-26.64843 0.26731,0.026 0.53226,0.0568 0.7972,0.0568 a 14.382821,14.382821 0 0 0 12.23723,-6.73721 14.34024,14.34024 0 0 0 1.9043,-10.8912 14.437229,14.437229 0 0 0 -6.4084,-9.09335 14.496369,14.496369 0 0 0 -7.72603,-2.23312 14.380455,14.380455 0 0 0 -12.23723,6.74194 14.439595,14.439595 0 0 0 2.42474,18.36649 c 0.0497,0.0473 0.11355,0.0875 0.16796,0.13957 -3.19119,10.68776 -2.70861,24.4224 -0.0852,34.10479 -0.34065,0.31226 -0.69549,0.60086 -1.00775,0.94387 a 14.967123,14.967123 0 0 0 -1.49979,1.95162 14.666692,14.666692 0 0 0 -1.67957,3.73291 c -7.97442,1.15441 -12.29636,3.95291 -16.14282,6.45571 -4.81399,3.13204 -9.37013,6.08431 -22.79488,6.30667 -4.64366,-0.54408 -8.4026,-0.42107 -12.514,-0.27441 -3.3828,0.12302 -6.88388,0.24839 -11.46841,0.007 -3.15807,-0.16796 -4.97721,-2.08645 -8.18023,-5.7342 -4.26517,-4.8613 -9.98044,-10.99529 -22.16326,-11.88002 v 9.46238 c 7.79464,0.70731 11.34539,4.46388 15.03572,8.67464 3.51764,4.00732 7.51077,8.55163 14.79917,8.94668 5.01033,0.26968 8.89464,0.12301 12.32002,0.002 5.8927,-0.21764 10.534,-0.38087 18.58175,1.6157 6.16948,1.52344 28.62134,22.88477 34.94931,33.88242 -0.25785,0.33592 -0.51806,0.6671 -0.7428,1.02667 -4.12323,6.51722 -2.4271,15.10433 3.83227,19.51853 0.17032,0.12301 0.3572,0.24602 0.66946,0.45183 2.32065,1.46903 4.99141,2.24258 7.7284,2.24258 a 14.385186,14.385186 0 0 0 12.23723,-6.73958 14.335509,14.335509 0 0 0 1.9043,-10.88884 14.430133,14.430133 0 0 0 -6.4084,-9.09571 14.496369,14.496369 0 0 0 -11.37614,-1.77183 c -6.05593,-9.90712 -20.46714,-24.7323 -31.19984,-32.62629 4.28882,-1.4856 7.21506,-3.397 9.96388,-5.17593 3.37571,-2.2 6.18367,-3.99785 11.4897,-4.88968 m 9.17851,-63.69603 a 4.9582882,4.9582882 0 0 1 4.21786,-2.31828 c 0.94624,0 1.86882,0.26731 2.66129,0.76882 1.13786,0.71914 1.92323,1.83333 2.21657,3.14624 a 4.9204386,4.9204386 0 0 1 -0.66237,3.7471 c -1.41226,2.24968 -4.58452,3.01141 -6.88861,1.54474 l -0.22,-0.14667 a 4.9795785,4.9795785 0 0 1 -1.32474,-6.74195 m 0,55.50397 a 4.9582882,4.9582882 0 0 1 4.21786,-2.31828 c 0.94624,0 1.86882,0.26494 2.66129,0.77118 1.13786,0.71914 1.92323,1.83097 2.21657,3.14388 a 4.9275354,4.9275354 0 0 1 -0.66237,3.74947 c -1.41226,2.24731 -4.58452,3.00903 -6.88861,1.54236 l -0.22,-0.14666 a 4.9795785,4.9795785 0 0 1 -1.32474,-6.74195 m 0,62.22462 a 4.965385,4.965385 0 0 1 4.21786,-2.31828 c 0.94624,0 1.86882,0.26731 2.66129,0.77118 1.13786,0.71914 1.92323,1.83334 2.21657,3.14625 a 4.9204386,4.9204386 0 0 1 -0.66237,3.7471 c -1.41226,2.24968 -4.58452,3.00667 -6.88861,1.54473 l -0.22,-0.14666 a 4.9843097,4.9843097 0 0 1 -1.32474,-6.74432"
|
||||
id="path12-6"
|
||||
style="stroke-width:2.3656" />
|
||||
<g
|
||||
opacity="0.25"
|
||||
id="g12-2"
|
||||
transform="matrix(2.3655955,0,0,2.3655955,83.65691,67.17107)">
|
||||
<path
|
||||
d="m 53.783,104.537 c -0.239,0 -0.48,-0.072 -0.691,-0.219 a 1.21,1.21 0 0 1 -0.29,-1.684 c 0.273,-0.387 0.519,-0.799 0.73,-1.227 a 9.028,9.028 0 0 0 -0.501,-8.961 1.2080225,1.2080225 0 1 1 2.032,-1.307 c 2.176,3.389 2.42,7.736 0.633,11.34 a 11.833,11.833 0 0 1 -0.92,1.547 1.204,1.204 0 0 1 -0.993,0.511 m 5.556,2.877 a 1.207,1.207 0 0 1 -0.968,-1.922 c 0.453,-0.615 0.854,-1.279 1.198,-1.973 a 13.243,13.243 0 0 0 -1.251,-13.846 1.2071091,1.2071091 0 1 1 1.937,-1.441 15.643,15.643 0 0 1 1.478,16.357 c -0.404,0.818 -0.88,1.604 -1.414,2.33 a 1.213,1.213 0 0 1 -0.98,0.495 m -10.994,-5.928 a 1.21,1.21 0 0 1 -1.045,-1.802 4.802,4.802 0 0 0 0.18,-4.369 1.208,1.208 0 0 1 2.193,-1.01 7.22,7.22 0 0 1 -0.271,6.57 1.209,1.209 0 0 1 -1.057,0.611"
|
||||
id="path13-6" />
|
||||
</g>
|
||||
<g
|
||||
fill="#eb743b"
|
||||
id="g13-1"
|
||||
transform="matrix(2.3655955,0,0,2.3655955,83.65691,67.17107)">
|
||||
<path
|
||||
d="m 53.783,101.537 c -0.239,0 -0.48,-0.072 -0.691,-0.219 a 1.21,1.21 0 0 1 -0.29,-1.684 c 0.273,-0.387 0.519,-0.799 0.73,-1.227 a 9.028,9.028 0 0 0 -0.501,-8.961 1.2080225,1.2080225 0 1 1 2.032,-1.307 c 2.176,3.389 2.42,7.736 0.633,11.34 a 11.833,11.833 0 0 1 -0.92,1.547 1.204,1.204 0 0 1 -0.993,0.511 m 5.556,2.877 a 1.207,1.207 0 0 1 -0.968,-1.922 c 0.453,-0.615 0.854,-1.279 1.198,-1.973 a 13.243,13.243 0 0 0 -1.251,-13.846 1.2071091,1.2071091 0 1 1 1.937,-1.441 15.643,15.643 0 0 1 1.478,16.357 c -0.404,0.818 -0.88,1.604 -1.414,2.33 a 1.213,1.213 0 0 1 -0.98,0.495 M 48.345,98.486 a 1.21,1.21 0 0 1 -1.045,-1.802 4.802,4.802 0 0 0 0.18,-4.369 1.208,1.208 0 0 1 2.193,-1.01 7.22,7.22 0 0 1 -0.271,6.57 1.209,1.209 0 0 1 -1.057,0.611"
|
||||
id="path14-8" />
|
||||
</g>
|
||||
<g
|
||||
id="g15-7"
|
||||
transform="matrix(2.3655955,0,0,2.3655955,83.65691,67.17107)">
|
||||
<path
|
||||
d="m 66.082,47.24 c -10.12,0 -20.365,3.656 -26.736,9.543 -6.886,6.361 -10.521,16.245 -10.348,27.989 a 3.99,3.99 0 0 0 -3.41,3.941 v 18.119 a 4,4 0 0 0 4,4 h 2.033 c 0.316,0 0.619,-0.047 0.914,-0.115 v 1.602 c 0,2.209 1.565,4 3.495,4 h 1.898 c 1.93,0 3.495,-1.791 3.495,-4 V 82.65 c 0,-2.209 -1.565,-4 -3.495,-4 H 36.03 c -1.717,0 -3.138,1.42 -3.432,3.288 0.065,-1.855 0.204,-3.652 0.435,-5.096 1.154,-7.232 4.119,-13.268 8.688,-17.488 5.664,-5.232 15.226,-8.613 24.361,-8.613 1.042,0 3.241,0.043 4.277,0.143 v -3.49 c -1.2,-0.117 -3.163,-0.154 -4.277,-0.154 z m -34.459,59.188 a 2.652,2.652 0 0 1 -2.651,-2.65 v -12.01 a 2.651,2.651 0 0 1 2.651,-2.652 h 0.913 v 17.312 z"
|
||||
opacity="0.25"
|
||||
id="path15-9" />
|
||||
<path
|
||||
fill="#fffedb"
|
||||
d="m 66.082,44.24 c -10.12,0 -20.365,3.656 -26.736,9.543 -6.886,6.361 -10.521,16.245 -10.348,27.989 a 3.99,3.99 0 0 0 -3.41,3.941 v 18.119 a 4,4 0 0 0 4,4 h 2.033 c 0.316,0 0.619,-0.047 0.914,-0.115 v 1.602 c 0,2.209 1.565,4 3.495,4 h 1.898 c 1.93,0 3.495,-1.791 3.495,-4 V 79.65 c 0,-2.209 -1.565,-4 -3.495,-4 H 36.03 c -1.717,0 -3.138,1.42 -3.432,3.287 0.065,-1.854 0.204,-3.651 0.435,-5.096 1.154,-7.232 4.119,-13.268 8.688,-17.488 5.664,-5.232 15.226,-8.613 24.361,-8.613 1.042,0 3.241,0.043 4.277,0.143 v -3.49 c -1.2,-0.116 -3.163,-0.153 -4.277,-0.153 z m -34.459,59.188 a 2.652,2.652 0 0 1 -2.651,-2.65 v -12.01 a 2.651,2.651 0 0 1 2.651,-2.652 h 0.913 v 17.312 z"
|
||||
id="path16" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 23 KiB |
|
|
@ -1,21 +1,32 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
width="149.66901"
|
||||
height="149.66901"
|
||||
viewBox="0 0 149.66901 149.66901"
|
||||
width="512"
|
||||
height="512"
|
||||
viewBox="0 0 512.00001 512.00001"
|
||||
version="1.1"
|
||||
id="svg24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<defs
|
||||
id="defs24" />
|
||||
<rect
|
||||
width="512"
|
||||
height="512"
|
||||
id="rect1"
|
||||
x="0"
|
||||
y="0"
|
||||
style="fill:#ffffff" />
|
||||
<g
|
||||
id="g1"
|
||||
transform="matrix(2.4364349,0,0,2.4364349,73.670604,73.670607)">
|
||||
<path
|
||||
d="m 119.52304,13.84136 c 0.779,-0.605 1.832,-0.908 2.783,-0.531 0.885,0.4 1.143,1.402 1.572,2.187 1.478,2.804 2.5,5.823 4.013,8.614 2.073,5.077 2.949,10.521 4.407,15.784 0.115,0.702 0.818,0.986 1.336,1.356 1.715,1.081 3.244,2.435 4.574,3.962 4.074,3.888 7.042,9.04 7.843,14.643 0.854,3.539 -0.245,7.172 0.272,10.725 0.921,2.439 1.179,5.044 1.907,7.535 0.622,3.902 1.663,7.793 1.396,11.779 -0.178,2.523 -0.289,5.084 -0.904,7.551 -1.588,4.329 -3.433,8.685 -6.579,12.137 -3.337,4.027 -7.785,6.887 -11.991,9.914 -1.062,0.812 -2.324,1.311 -3.449,2.025 -2.238,1.418 -4.41,3.018 -6.924,3.939 -3.214,1.251 -6.336,2.747 -9.621,3.82 -3.105,0.927 -6.19,1.938 -9.227,3.068 -5.207001,1.447 -10.475001,2.96 -15.921001,3.066 -2.742,0.344 -5.461,0.918 -8.231,1.023 -6.59,0.116 -13.281,0.35 -19.742,-1.172 -2.515,-0.786 -5.003,-1.65 -7.541,-2.354 -4.577,-1.938 -8.942,-4.516 -12.486,-8.029 a 72.275,72.275 0 0 1 -6.632,-6.369 c -1.059,-1.08 -1.523,-2.545 -2.229,-3.847 -0.861,0.183 -1.775,0.612 -2.623,0.133 -1.043,-0.473 -2.302,-0.792 -2.939,-1.827 -2.143,-3.174 -3.766,-6.645 -5.238,-10.165 -1.131,-2.259 -2.21,-4.562 -2.836,-7.021 -0.906,-3.774 -1.898,-7.608 -1.648,-11.521 0.148,-1.05 0.476,-2.068 0.543,-3.131 -1.16,-2.787 -3.783,-5.17 -4.98,-7.943 -2.558,-5.577 -4.979,-11.23 -6.812,-17.086 -0.80899995,-2.761 -1.55199995,-5.512 -1.61599995094,-8.416 C 0.31103905,46.59836 0.64503905,45.15536 1.750039,44.51136 c 1.168,-0.383 2.43,-0.07 3.615,0.099 2.756,0.601 5.584,0.76 8.353,1.282 2.614,0.471 5.079,1.501 7.657,2.112 0.977,-1.527 1.678,-3.225 2.837,-4.637 1.659,-2.309 3.477,-4.495 5.246,-6.722 1.555,-1.992 3.485,-3.228 5.275,-4.986 0.943,-0.883 2.013,-1.979 3.074,-2.739 1.866,-1.321 3.47,-3.021 5.578,-3.98 1.69,-0.754 3.129,-1.961 4.833,-2.686 2.416,-0.953 4.246,-2.861 6.416,-4.226 1.918,-1.75 4.345,-2.918 6.888,-3.436 1.711,-0.098 3.452,-0.217 5.147,0.021 2.23,0.311 3.679,0.985 5.531,1.417 1.353,-0.103 2.676,-0.406 4.066,-0.396 2.572,0.018 4.729,0.141 7.039,0.666 2.803,0.432 5.469,1.425 8.216,2.075 2.755,0.582 5.413,1.743 7.923,3.056 1.578001,0.823 3.137001,1.496 4.622001,2.49 1.086,0.698 2.044,1.577 3.169,2.227 1.094,-1.506 2.562,-2.677 3.71,-4.138 1.007,-1.271 2.392,-2.169 3.421,-3.419 1.511,-1.789 3.292,-3.333 5.157,-4.75 z"
|
||||
id="path2" />
|
||||
id="path2-7-6"
|
||||
style="fill:#000000" />
|
||||
<path
|
||||
fill="#f59c32"
|
||||
d="m 118.78404,21.38636 c 0.622,-0.801 1.385,-1.475 2.163,-2.119 0.656,1.279 1.318,2.573 1.721,3.961 0.605,2.301 1.428,4.538 2.059,6.832 1.043,2.905 1.615,5.943 2.27,8.953 -1.432,-0.317 -2.92,-0.361 -4.331,-0.764 -1.531,-1.319 -2.88,-2.833 -4.179,-4.375 -1.875,-1.783 -3.822,-3.513 -6.072,-4.82 1.993,-2.661 4.317,-5.054 6.369,-7.668 z"
|
||||
id="path3" />
|
||||
id="path3-9-1" />
|
||||
<path
|
||||
fill="#ffcf38"
|
||||
d="m 59.734039,21.55936 c 1.594,-0.861 3.43,-1.111 5.201,-1.34 1.312,-0.18 2.583,0.321 3.879,0.474 3.342,0.384 6.576,1.604 9.393,3.417 3.111,2.377 6.551,4.321 9.427,6.999 2.375,2.261 4.823,4.463 6.916,6.999 -2.989,0.026 -5.901,0.713 -8.828,1.245 -1.542,0.304 -3.058,0.875 -4.644,0.865 -1.524,-1.752 -3.076,-3.475 -4.403,-5.382 -3.047,-2.901 -6.065,-5.936 -9.766,-8.031 -1.974,-1.106 -4.204,-1.673 -6.44,-1.917 -0.654,-0.095 -1.199,0.228 -1.633,0.681 2.453,1.038 5.073,1.799 7.191,3.479 2.178,1.798 4.393,3.628 6.018,5.962 1.609,2.254 3.492,4.311 4.921,6.693 -7.098,3.181 -13.051,8.314 -18.634,13.624 -2.578,2.341 -4.932,4.969 -6.771,7.933 -1.382,1.944 -2.793,3.878 -3.889,6.004 -1.12,2.277 -2.686,4.323 -3.614,6.704 -0.879,2.245 -2.525,4.056 -3.842,6.053 -0.766,1.244 -1.928,2.164 -2.896,3.244 -2.741,3.002 -5.488,6.078 -7.384,9.699 -2.165,3.654 -3.723,7.633 -4.897,11.709 -1.398,-3.762 -3.238,-7.33 -4.804,-11.019 -0.962,-2.656 -1.06,-5.515 -1.243,-8.304 1.242,0.714 2.4,1.611 3.749,2.117 1.372,0.279 2.983,0.338 4.079,-0.688 1.701,-1.453 2.549,-3.604 3.859,-5.373 1.719,-2.235 3.006,-4.748 4.486,-7.134 1.696,-2.739 3.471,-5.421 5.187,-8.146 1.995,-2.557 4.353,-4.868 5.977,-7.694 a 9.924,9.924 0 0 0 -0.13,-0.447 c -1.427,-1.159 -3.128,-1.927 -4.705,-2.857 a 306.321,306.321 0 0 0 -7.873,-4.456 c -2.007,-0.923 -4.096,-1.659 -6.193,-2.341 a 221.137,221.137 0 0 0 2.617,-4.46 c 4.104,-6.479 10.01,-11.705 16.656,-15.501 2.457,-1.559 4.936,-3.085 7.479,-4.495 1.886,-1.387 3.616,-2.993 5.554,-4.316 z m 21.603,-0.502 c 2.884,-0.151 5.574,1.042 8.229,1.991 3.501,1.131 6.962,2.454 10.219,4.179 3.090001,1.938 6.304001,3.687 9.343001,5.701 1.665,1.407 3.64,2.409 5.2,3.946 -4.932,0.27 -9.887,0.137 -14.801001,0.641 -1.354,-1.762 -3.006,-3.246 -4.584,-4.797 -2.332,-2.684 -4.916,-5.165 -7.78,-7.276 -1.772,-1.682 -3.974,-2.805 -5.826,-4.385 z"
|
||||
|
|
@ -42,12 +53,15 @@
|
|||
id="path12" />
|
||||
<path
|
||||
d="m 103.40904,74.39736 c 1.733,-0.941 3.95,-0.041 4.941,1.551 0.635,1.148 1.032,2.438 1.229,3.731 -0.029,1.655 -0.352,3.371 -1.163,4.837 -0.694,1.323 -2.372,1.938 -3.733,1.23 -1.788,-0.939 -3.664,-2.521 -3.756,-4.693 -0.07,-1.408 -0.317,-2.869 0.127,-4.244 0.459,-1.051 1.323,-1.916 2.355,-2.412 z m -27.471001,5.364 c 1.817,-0.521 3.579,0.554 4.672,1.931 1.066,2.48 1.509,5.403 0.465,7.96 -1.311,2.053 -4.714,2.958 -6.626,1.228 -1.651,-1.84 -1.851,-4.475 -1.645,-6.826 0.063,-1.886 1.453,-3.559 3.134,-4.293 z"
|
||||
id="path14" />
|
||||
id="path14"
|
||||
style="fill:#000000" />
|
||||
<path
|
||||
d="m 99.351039,95.62336 c 0.598,-0.45 1.401001,-0.436 2.117001,-0.509 1.174,-0.169 2.158,0.901 2.345,1.977 0.479,2.198 1.981,3.941 3.165,5.788 0.91,1.436 2.801,2.967 4.463,2.379 1.941,-0.688 3.198,-2.412 4.892,-3.571 1.216,-0.198 1.44,1.399 1.674,2.259 0.097,1.73 -1.798,2.366 -2.854,3.359 -1.646,1.54 -3.902,2.599 -6.195,2.171 a 11.674,11.674 0 0 1 -0.676,6.003 c -1.114,1.648 -2.553,3.516 -4.742,3.596 -1.797,-0.018 -3.856001,-0.124 -5.148001,-1.538 -1.574,-1.75 -2.883,-3.916 -2.882,-6.336 -3.329,-0.05 -6.884,0.271 -9.896,-1.431 -0.9,-0.982 -1.731,-2.559 -0.893,-3.812 1.317,-1.335 3.045,0.256 4.5,0.489 2.014,0.321 4.456,0.829 6.076,-0.85 1.611,-1.909 2.625,-4.252 3.387,-6.591 0.403,-1.246 -0.247,-2.465 0.667,-3.383 z"
|
||||
id="path17" />
|
||||
id="path17"
|
||||
style="fill:#000000" />
|
||||
<path
|
||||
fill="#f31e3e"
|
||||
d="m 101.90604,103.36436 c 0.918,1.404 1.867,2.792 2.708,4.246 0.401,0.621 0.392,1.378 0.435,2.092 0.053,1.264 0.111,2.621 -0.533,3.764 -0.732,1.081 -2.539,1.43 -3.475,0.412 -0.842,-0.914 -1.533001,-2.031 -1.815001,-3.248 -0.29,-0.899 0.396,-1.648 0.774001,-2.398 0.89,-1.513 1.442,-3.189 1.906,-4.868 z"
|
||||
id="path18" />
|
||||
</g>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 12 KiB |
|
|
@ -1,14 +0,0 @@
|
|||
const detailsElements = document.getElementsByTagName("details");
|
||||
const dropdown = Array.from(detailsElements);
|
||||
|
||||
const save = () => {
|
||||
dropdown.forEach((details, i) => {
|
||||
localStorage.setItem(`details${i}`, details.hasAttribute("open"));
|
||||
});
|
||||
};
|
||||
|
||||
dropdown.forEach((details, i) => {
|
||||
const isOpen = JSON.parse(localStorage.getItem(`details${i}`)) || false;
|
||||
details.toggleAttribute("open", isOpen);
|
||||
details.addEventListener("toggle", save);
|
||||
});
|
||||
|
|
@ -1,10 +1,10 @@
|
|||
const basePath = "/assets/css";
|
||||
const themeToggle = document.getElementById("theme-toggle");
|
||||
const themeToggles = document.querySelectorAll(".theme-toggle");
|
||||
const themeStylesheet = document.getElementById("themed");
|
||||
|
||||
const themes = [
|
||||
{ name: "system", file: "default/system.css" },
|
||||
{ name: "citrus", file: "citrus/default.css" },
|
||||
{ name: "citrus", file: "citrus/citrus.css" },
|
||||
];
|
||||
|
||||
let currentTheme = localStorage.getItem("theme") || themes[0].name;
|
||||
|
|
@ -12,13 +12,15 @@ setTheme(currentTheme);
|
|||
|
||||
function setTheme(themeName) {
|
||||
const theme = themes.find(t => t.name === themeName);
|
||||
if (theme) {
|
||||
if (theme && themeStylesheet) {
|
||||
themeStylesheet.href = `${basePath}/${theme.file}`;
|
||||
}
|
||||
}
|
||||
|
||||
themeToggle.addEventListener("click", () => {
|
||||
themeToggles.forEach(btn =>
|
||||
btn.addEventListener("click", () => {
|
||||
currentTheme = themes[(themes.findIndex(t => t.name === currentTheme) + 1) % themes.length].name;
|
||||
setTheme(currentTheme);
|
||||
localStorage.setItem("theme", currentTheme);
|
||||
});
|
||||
})
|
||||
);
|
||||
|
|
@ -4,6 +4,7 @@ images:
|
|||
alt: Various pixel art animations of Sundae as a character from Nuclear Throne.
|
||||
date: 2021-01-25
|
||||
pixel: true
|
||||
fit: contain
|
||||
programs:
|
||||
- name: paint.net
|
||||
src: https://www.getpaint.net/
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
{
|
||||
"permalink": "/gallery/{{page.fileSlug|slug}}/",
|
||||
"permalink": "/gallery/original/{{page.fileSlug|slug}}/",
|
||||
"tags": "artworks"
|
||||
}
|
||||
|
|
@ -3,6 +3,7 @@ images:
|
|||
- src: /assets/img/art/sundae_bunbee.png
|
||||
alt: Full body portrait of Sundae as a three-way hybrid between a bunny, bee and qilin.
|
||||
date: 2026-03-02
|
||||
position: 0 -20px
|
||||
- src: /assets/img/art/sundae_bunbee-old.png
|
||||
alt: Older version, flat colors and a solid color background. His head is further back, neck fluff is spiky and his lop ears are bigger.
|
||||
date: 2026-02-18
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ images:
|
|||
- src: /assets/img/art/sundae_refsheet-new-unfinished.png
|
||||
alt: Reference/model sheet of Sundae with a full-length front portrait, T-posed.
|
||||
date: 2025-02-11
|
||||
fit: scale-down
|
||||
programs:
|
||||
- name: Krita
|
||||
src: https://krita.org/
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ images:
|
|||
alt: Half-length portrait of Sundae getting a head pat from a disembodied white hand.
|
||||
date: 2021-11-18
|
||||
pixel: true
|
||||
fit: scale-down
|
||||
programs:
|
||||
- name: MS Paint
|
||||
src: https://www.microsoft.com/en-us/windows/paint
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ images:
|
|||
alt: Side portrait of Kass, looking back at the player.
|
||||
date: 2023-02-23
|
||||
pixel: true
|
||||
position: -25px
|
||||
attachments:
|
||||
- src: /assets/img/blog/kass.jpg
|
||||
alt: In-game screenshot of Kass that I took as reference.
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ images:
|
|||
- src: /assets/img/art/petscii_sue.png
|
||||
alt: Sue Sakamoto sitting and looking out from the Outer Wall.
|
||||
date: 2023-01-16
|
||||
position: right
|
||||
palettes:
|
||||
- name: Commodore 64
|
||||
---
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
{
|
||||
"permalink": "/gallery/{{page.fileSlug|slug}}/",
|
||||
"permalink": "/gallery/fanart/{{page.fileSlug|slug}}/",
|
||||
"tags": "fanarts"
|
||||
}
|
||||
|
|
@ -3,6 +3,7 @@ images:
|
|||
- src: /assets/img/art/klonoa_sitting.png
|
||||
alt: Klonoa sitting on a ledge, with a hand on his knee and right leg dangling from the viewer's side.
|
||||
date: 2021-11-18
|
||||
fit: scale-down
|
||||
programs:
|
||||
- name: MS Paint
|
||||
src: https://www.microsoft.com/en-us/windows/paint
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ images:
|
|||
- src: /assets/img/art/mallow.png
|
||||
alt: Mallow from Cavern Crusher, sitting on the ledge of a mossy stone pit with water at the bottom.
|
||||
date: 2025-08-03
|
||||
position: left
|
||||
programs:
|
||||
- name: Krita
|
||||
src: https://krita.org/
|
||||
|
|
|
|||
|
|
@ -1,16 +0,0 @@
|
|||
## Bio
|
||||
|
||||
<img src="/assets/img/art/sundae_icon.svg" alt="Vector icon of Sunny" style="width: 128px;">
|
||||
|
||||
Hi! My name's Sunny. I'm:
|
||||
|
||||
- an artist
|
||||
- a writer
|
||||
- an audio and video editor
|
||||
- a graphic designer
|
||||
- a web designer
|
||||
- a bunny <span class="emoji"><img src="/assets/img/icon/rabbit_1f407.gif" alt="🐇"></span>
|
||||
|
||||
I identify as: <span id="agender">agender</span>, <span id="aromantic">aromantic</span> and <span id="pansexual">pansexual</span>.
|
||||
|
||||
_TO DO: add more text here plz. kthxbai ^\_^_
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
## Fan art
|
||||
|
||||
Various artworks featuring characters from other media
|
||||
11
_src/data/articles/home-bio.html
Normal file
11
_src/data/articles/home-bio.html
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
<img src="/assets/img/art/sundae_icon.svg" alt="Vector icon of Sunny" style="width: 128px;">
|
||||
<p>Hi! My name's Sunny. I'm:</p>
|
||||
<ul class="paws">
|
||||
<li>an artist</li>
|
||||
<li>a writer</li>
|
||||
<li>an audio and video editor</li>
|
||||
<li>a graphic designer</li>
|
||||
<li>a web designer</li>
|
||||
<li>a bunny <span class="emoji"><img src="/assets/img/icon/rabbit_1f407.gif" alt="🐇"></span></li>
|
||||
</ul>
|
||||
<p>I identify as: <span id="agender">agender</span>, <span id="aromantic">aromantic</span> and <span id="pansexual">pansexual</span>.</p>
|
||||
4
_src/data/articles/home-interests.html
Normal file
4
_src/data/articles/home-interests.html
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
<p>Below are lists of media that I've enjoyed and/or still enjoy.</p>
|
||||
<p>It is a non-exclusive list, so not everything ever is on here. Just whatever comes to mind to recommend.</p>
|
||||
<p>If you're looking for music that I listen to, I've decided to remove them from being listed in my interests.</p>
|
||||
<p>Look through my {{"ListenBrainz"|link:"https://listenbrainz.org/user/sunbun/"}} instead (it's a bit sparse for now).</p>
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
## Interests
|
||||
|
||||
Below are lists of media that I've enjoyed and/or still enjoy.
|
||||
|
||||
It is a non-exclusive list, so not everything ever is on here. Just whatever comes to mind to recommend.
|
||||
|
||||
There will be **a lot** of music, though.
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
## Original characters
|
||||
|
||||
My own characters that I've drawn
|
||||
|
|
@ -44,7 +44,7 @@ I wasn't exactly a fan of how I laid out my [interests](/home#interests), previo
|
|||
|
||||
I've changed them to be more minimal, mimicking Windows desktop entries with the shortcut icon.
|
||||
|
||||
If you'd like to implement the shelving for your own website, you can find the source files in the {{"old branch"|link:"https://moth.ink/forgejo/sundae/website/src/branch/old"}}.
|
||||
If you'd like to implement the shelving for your own website, you can find the source files in the {{"old branch"|link:"https://bunsin.space/forgejo/sundae/website/src/branch/old"}}.
|
||||
|
||||
<section><a href="/assets/img/blog/shelf.png"><figure><img src="/assets/img/blog/shelf.png" alt=""><figcaption>How the shelving featuring my personal favorite games and music looked before.</figcaption></figure></a>
|
||||
<a href="/assets/img/blog/media.png"><figure><img src="/assets/img/blog/media.png" alt=""><figcaption>How it looks now.<br>Note: the cut-off in the middle is meant to showcase the light and dark theme.</figcaption></figure></a></section>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"layout": "blog",
|
||||
"permalink": "/blog/{{ page.fileSlug | slug }}/",
|
||||
"permalink": "/blog/{{page.fileSlug|slug}}/",
|
||||
"tags": "posts"
|
||||
}
|
||||
|
|
@ -1,3 +1 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Created my Neocities account!
|
||||
|
|
|
|||
|
|
@ -1,5 +1,3 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Added [Home](/home), [Gallery](/gallery) and ~~About~~
|
||||
- ~~About~~ contains Pokémon boxes and a small bio
|
||||
- Added links to other pages
|
||||
|
|
|
|||
|
|
@ -1,9 +1,6 @@
|
|||
---
|
||||
title: Version 0
|
||||
---
|
||||
|
||||
## {{page.fileSlug|readable}} <code>{{title}}</code>
|
||||
|
||||
|
||||
|
||||
- Added sidebar
|
||||
|
|
|
|||
|
|
@ -1,5 +1,3 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Working on my [interests](/home#interests)...
|
||||
- Added ~~Favorite Pokémon~~
|
||||
- Moved Pokémon boxes from ~~About~~
|
||||
|
|
|
|||
|
|
@ -1,3 +1 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- [Gallery](/gallery) implemented
|
||||
|
|
|
|||
|
|
@ -2,8 +2,6 @@
|
|||
title: Version 1
|
||||
---
|
||||
|
||||
## {{page.fileSlug|readable}} <code>{{title}}</code>
|
||||
|
||||
|
||||
|
||||
- Changed backgrounds
|
||||
|
|
|
|||
|
|
@ -1,5 +1,3 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Changed [Gallery](/gallery)
|
||||
- Now implementing {{"CSS grid layout"|link:"https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout"}}
|
||||
- Removed Sunny's portrait from the sidebar
|
||||
|
|
|
|||
|
|
@ -1,5 +1,3 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Changed ~~About~~
|
||||
- Added a collection of games and music that I enjoy
|
||||
- Added 88x31 buttons to the footer of the page
|
||||
|
|
|
|||
|
|
@ -1,3 +1 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Made a 88x31 button! [](/)
|
||||
|
|
@ -1,5 +1,3 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Re-added and moved Sunny's portrait to my [bio](/home#bio)
|
||||
- Changed [Gallery](/gallery)
|
||||
- Added sections for [original characters](/gallery/#original-characters) and [fan art](/gallery#fan-art)
|
||||
|
|
|
|||
|
|
@ -1,3 +1 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Wrote more about my [interests](/home#interests)
|
||||
|
|
@ -1,3 +1 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Starting work on a re-design. I fixed a few inconsistencies beforehand
|
||||
|
|
@ -2,8 +2,6 @@
|
|||
title: Version 2
|
||||
---
|
||||
|
||||
## {{page.fileSlug|readable}} <code>{{title}}</code>
|
||||
|
||||
|
||||
|
||||
Added a lot of visual flair with to page elements to look like everyday objects, with the exception being: the header, sidebar and topbar, as they're supposed to be UI.
|
||||
|
|
|
|||
|
|
@ -2,8 +2,6 @@
|
|||
title: Version 3
|
||||
---
|
||||
|
||||
## {{page.fileSlug|readable}} <code>{{title}}</code>
|
||||
|
||||
|
||||
|
||||
Some considerations were put into making page elements stand out more. I tried to remove redundant rules and nesting when necessary, and tried my best to conform to {{"semantic HTML"|link:"https://developer.mozilla.org/en-US/curriculum/core/semantic-html/"}}.
|
||||
|
|
|
|||
|
|
@ -1,4 +1,2 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Changed ~~About~~
|
||||
- Updated the look of the jewel CD cases in my [interests](/home#interests)
|
||||
|
|
|
|||
|
|
@ -1,5 +1,3 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Fixed a couple of small issues regarding mobile view
|
||||
- Changed [Gallery](/gallery)
|
||||
- Artworks now work (ha) with keyboard navigation
|
||||
|
|
|
|||
|
|
@ -1,4 +1,2 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Added ~~Jukebox~~
|
||||
- A page with a music player featuring a pre-defined track list from various video games and accompanying backgrounds that fade-in on track change
|
||||
|
|
|
|||
|
|
@ -1,4 +1,2 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Drafted ~~Jukebox~~
|
||||
- I am bad at JavaScript
|
||||
|
|
|
|||
|
|
@ -2,8 +2,6 @@
|
|||
title: Version 4
|
||||
---
|
||||
|
||||
## {{page.fileSlug|readable}} <code>{{title}}</code>
|
||||
|
||||
|
||||
|
||||
- Shiny buttons are BACK!
|
||||
|
|
|
|||
|
|
@ -2,8 +2,6 @@
|
|||
title: Version 5
|
||||
---
|
||||
|
||||
## {{page.fileSlug|readable}} <code>{{title}}</code>
|
||||
|
||||
|
||||
|
||||
Re-wrote the website with {{"Eleventy"|link:"https://11ty.dev/"}}.
|
||||
|
|
|
|||
|
|
@ -2,8 +2,6 @@
|
|||
title: Version 6
|
||||
---
|
||||
|
||||
## {{page.fileSlug|readable}} <code>{{title}}</code>
|
||||
|
||||
|
||||
|
||||
Re-wrote the site, again.
|
||||
|
|
|
|||
|
|
@ -1,5 +1,3 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
Polished the old theme
|
||||
|
||||
- Changed [Home](/home)
|
||||
|
|
|
|||
|
|
@ -1,5 +1,3 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Changed sidebar
|
||||
- Added icon for [Changelog](/changelog)
|
||||
- For some reason I forgot give it an icon, it previously used the Gallery icon
|
||||
|
|
|
|||
|
|
@ -1,5 +1,3 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
Website (hopefully) fixed for Chromium-based browsers _...grr_
|
||||
|
||||
- Changed sidebar
|
||||
|
|
|
|||
|
|
@ -1,5 +1,3 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
Actively trying to accommodate for accessibility
|
||||
|
||||
- Added `header` to pages back in
|
||||
|
|
|
|||
|
|
@ -2,8 +2,6 @@
|
|||
title: Version 7
|
||||
---
|
||||
|
||||
## {{page.fileSlug|readable}} <code>{{title}}</code>
|
||||
|
||||
|
||||
|
||||
Overhauled the old theme
|
||||
|
|
|
|||
|
|
@ -1,5 +1,3 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Changed [Index](/) and [Blog](/blog)
|
||||
- Updated with miscellaneous disclaimers
|
||||
- Implemented proper off-site links everywhere with favicons as an Eleventy filter **(FINALLY)**
|
||||
|
|
@ -1,5 +1,3 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Updated to {{"Eleventy v3.1.2"|link:"https://github.com/11ty/eleventy/releases/tag/v3.1.2"}}
|
||||
- Should hopefully be able to be compiled without throwing errors now.
|
||||
- Updated [Gallery](/gallery)
|
||||
|
|
|
|||
|
|
@ -1,4 +1,2 @@
|
|||
## {{page.fileSlug|readable}}
|
||||
|
||||
- Updated a few links, due to moving domains
|
||||
- Started working on a redesign for the sidebar, mostly intended for easier mobile navigation
|
||||
4
_src/data/changelog/2026-04-07.md
Normal file
4
_src/data/changelog/2026-04-07.md
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
- Changed sidebar
|
||||
- Now toggleable on lower resolutions
|
||||
- Changed [Gallery](/gallery)
|
||||
- Redesigned to look like a corkboard
|
||||
5
_src/data/changelog/2026-06-04.md
Normal file
5
_src/data/changelog/2026-06-04.md
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
- Combined page-specific styles into one main stylesheet
|
||||
- Changed sidebar
|
||||
- Added {{"ListenBrainz"|link:"https://listenbrainz.org/user/sunbun/"}}
|
||||
- Changed [Home](/home)
|
||||
- Removed music lists in favor of ListenBrainz
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<title>{{site.name}}{% if title %} - {{title}}{% endif %}</title>
|
||||
<title>{{site.name}}</title>
|
||||
{% include "meta.njk" %}
|
||||
<link rel="icon" href="/assets/img/icon/sundae.png" />
|
||||
<link rel="stylesheet" href="/assets/css/reset.css" />
|
||||
|
|
@ -10,28 +10,16 @@
|
|||
<header>
|
||||
<h1>
|
||||
<a href="/home">
|
||||
<img
|
||||
src="/assets/img/theme/citrus/enter.png"
|
||||
alt="Link to home page"
|
||||
/>
|
||||
<img src="/assets/img/theme/citrus/enter.png" alt="Link to home page"/>
|
||||
</a>
|
||||
</h1>
|
||||
</header>
|
||||
<main>
|
||||
<a rel="me" href="{{outgoing.mastodon[0].src}}" style="display: none"
|
||||
>Mastodon</a
|
||||
>
|
||||
<a rel="me" href="{{outgoing.mastodon[0].src}}" style="display: none">Mastodon</a>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<p>
|
||||
This site eats cookies for breakfast.
|
||||
<br />
|
||||
<i>*nom nom nom*</i>
|
||||
<br />
|
||||
<sub>(only used for simple interactivity)</sub>
|
||||
<br />Best viewed with an up-to-date browser!
|
||||
</p>
|
||||
<p>This website uses JavaScript and local storage for simple interactivity.</p>
|
||||
<p>Best viewed with an up-to-date browser!</p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,8 @@
|
|||
---
|
||||
title: "Blog"
|
||||
order: 3
|
||||
icon: "m5 3h15l7 7v20H5zm5 22h12v-3H10zm0-6h12v-3H10zm0-6h9v-3h-9z"
|
||||
---
|
||||
<section id="posts">
|
||||
<article id="posts">
|
||||
<nav>
|
||||
<ul role="list">
|
||||
{% for post in collections.posts reversed %}
|
||||
<li>
|
||||
|
|
@ -17,8 +16,9 @@ icon: "m5 3h15l7 7v20H5zm5 22h12v-3H10zm0-6h12v-3H10zm0-6h9v-3h-9z"
|
|||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
<article>
|
||||
<p>...I'll eventually write more stuff worth talking about on here when the motivation strikes.</p>
|
||||
</article>
|
||||
</ul>
|
||||
</section>
|
||||
</nav>
|
||||
</article>
|
||||
<article>
|
||||
<p>...I'll eventually write more stuff worth talking about on here when the motivation strikes.</p>
|
||||
</article>
|
||||
|
|
|
|||
|
|
@ -1,11 +1,10 @@
|
|||
---
|
||||
title: "Changelog"
|
||||
order: 2
|
||||
icon: "M10 25H21V22H10Zm4-13H10v3h4v4h3V15h4V12H17V8H14ZM5 3H20l7 7V30H5Z"
|
||||
---
|
||||
|
||||
{%for update in collections.updates reversed%}
|
||||
<article>
|
||||
{{ update.content }}
|
||||
<h2><time datetime="{{update.fileSlug}}">{{update.fileSlug|readable}}</time></h2>
|
||||
{%if update.data.title%}<span>{{update.data.title}}</span>{%endif%}
|
||||
{{update.content}}
|
||||
</article>
|
||||
{%endfor%}
|
||||
|
|
@ -1,49 +1,26 @@
|
|||
---
|
||||
title: "Gallery"
|
||||
order: 4
|
||||
icon: "M2 2V30H30V2H2M5 26l6-9 5 6 5-9 6 12H5"
|
||||
---
|
||||
|
||||
<section id="artworks">
|
||||
<article>
|
||||
{%for article in collections.articles%} {%if article.fileSlug == 'ocs'%}
|
||||
{{ article.content }} {%endif%} {%endfor%}
|
||||
<nav>
|
||||
<ul role="list">
|
||||
{% assign sortedArtworks = collections.artworks | sortByFirstDate %} {%for artwork in sortedArtworks %}
|
||||
<li>
|
||||
<a href="{{artwork.page.url}}">
|
||||
<figure>
|
||||
{%if artwork.data.images[0]%}
|
||||
<img src="{{artwork.data.images[0].src}}" alt="{{artwork.data.images[0].alt}}" {%if artwork.data.images[0].pixel%} style="image-rendering: pixelated" {%endif%} />
|
||||
<figcaption>{{artwork.page.fileSlug}}{%if artwork.data.images.size > 1%}<p class="count">(+{{artwork.data.images.size| minus: 1}})</p>{%endif%}</figcaption>
|
||||
{% if artwork.data.images[0].date %}
|
||||
<time datetime="{{artwork.data.images[0].date|ISO}}">{{artwork.data.images[0].date|readable}}</time>
|
||||
{%endif%} {%endif%}
|
||||
</figure>
|
||||
</a>
|
||||
</li>
|
||||
{% assign sortedArtworks = collections.artworks | sortByFirstDate %}
|
||||
{% for item in sortedArtworks %}
|
||||
{% include '_includes/gallery-cat.njk' %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</nav>
|
||||
</article>
|
||||
<article>
|
||||
{%for article in collections.articles%} {%if article.fileSlug == 'fanart'%}
|
||||
{{ article.content }} {%endif%} {%endfor%}
|
||||
<nav>
|
||||
<ul role="list">
|
||||
{%assign sortedFanarts = collections.fanarts|sortByFirstDate%} {%for
|
||||
fanart in sortedFanarts%}
|
||||
<li>
|
||||
<a href="{{fanart.page.url}}">
|
||||
<figure>
|
||||
{%if fanart.data.images[0]%}
|
||||
<img src="{{fanart.data.images[0].src}}" alt="{{fanart.data.images[0].alt}}" />
|
||||
<figcaption>{{fanart.page.fileSlug}}</figcaption>
|
||||
{%if fanart.data.images[0].date%}
|
||||
<time datetime="{{fanart.data.images[0].date|ISO}}">{{fanart.data.images[0].date|readable}}</time>
|
||||
{%endif%} {%endif%}
|
||||
</figure>
|
||||
</a>
|
||||
</li>
|
||||
{% assign sortedFanarts = collections.fanarts | sortByFirstDate %}
|
||||
{% for item in sortedFanarts %}
|
||||
{% include '_includes/gallery-cat.njk' %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</nav>
|
||||
</article>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -1,15 +1,11 @@
|
|||
---
|
||||
title: "Home"
|
||||
order: 1
|
||||
icon: "M20 20V30h8V12L16 2 4 12V30h8V20Z"
|
||||
---
|
||||
<article id="bio">
|
||||
{%for article in collections.articles%} {%if article.fileSlug == 'bio'%} {{
|
||||
article.content }} {%endif%} {%endfor%}
|
||||
{%include "../data/articles/home-bio.html"%}
|
||||
</article>
|
||||
<article id="interests">
|
||||
{%for article in collections.articles%} {%if article.fileSlug == 'interests'%}
|
||||
{{ article.content }} {%endif%} {%endfor%}
|
||||
{%include "../data/articles/home-interests.html"%}
|
||||
<details open="">
|
||||
<summary>
|
||||
<h3>Games</h3>
|
||||
|
|
@ -18,35 +14,7 @@ icon: "M20 20V30h8V12L16 2 4 12V30h8V20Z"
|
|||
{%for item in media-games.items%}
|
||||
<li>
|
||||
<a href="{{item.src}}">
|
||||
<span><img src="/assets/img/media/games/{{item.cover}}" alt="Game icon for {{item.title}}"/></span><span>{{item.title}}</span>
|
||||
</a>
|
||||
</li>
|
||||
{%endfor%}
|
||||
</ul>
|
||||
</details>
|
||||
<details open="">
|
||||
<summary>
|
||||
<h3>Albums</h3>
|
||||
</summary>
|
||||
<ul class="music" role="list">
|
||||
{%for item in media-albums.items%}
|
||||
<li>
|
||||
<a href="{{item.src}}">
|
||||
<span><img src="/assets/img/media/music/albums/{{item.cover}}" alt="Album art cover for {{item.title}}"/></span><span>{{item.artist}} - {{item.title}}</span>
|
||||
</a>
|
||||
</li>
|
||||
{%endfor%}
|
||||
</ul>
|
||||
</details>
|
||||
<details open="">
|
||||
<summary>
|
||||
<h3>Tracker modules</h3>
|
||||
</summary>
|
||||
<ul class="music" role="list">
|
||||
{%for item in media-modules.items%}
|
||||
<li>
|
||||
<a href="{{item.src}}">
|
||||
<span><img src="/assets/img/media/music/{{item.tracker}}.png" alt="{{item.tracker|capitalize}} module"/></span><span>{{item.artist}} - {{item.title}}</span>
|
||||
<span><img src="/assets/img/media/games/{{item.cover}}" alt=""/></span><span>{{item.title}}</span>
|
||||
</a>
|
||||
</li>
|
||||
{%endfor%}
|
||||
|
|
@ -60,7 +28,7 @@ icon: "M20 20V30h8V12L16 2 4 12V30h8V20Z"
|
|||
{%for item in media-manga.items%}
|
||||
<li>
|
||||
<a href="{{item.src}}">
|
||||
<span><img src="/assets/img/media/manga/{{item.cover}}" alt="Manga art cover for {{item.alt}}"/></span><span>{{item.title}}</span>
|
||||
<span><img src="/assets/img/media/manga/{{item.cover}}" alt=""/></span><span>{{item.title}}</span>
|
||||
</a>
|
||||
</li>
|
||||
{%endfor%}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"layout": "base",
|
||||
"permalink": "/{{ title | slug }}/",
|
||||
"permalink": "/{{page.fileSlug}}/",
|
||||
"tags": "pages"
|
||||
}
|
||||
|
|
@ -1,41 +1,36 @@
|
|||
import markdownIt from "markdown-it";
|
||||
import markdownItAnchor from "markdown-it-anchor";
|
||||
import slugify from "slugify";
|
||||
import { format } from "date-fns";
|
||||
|
||||
export default async function (eleventyConfig) {
|
||||
const markdownItOptions = {
|
||||
html: true
|
||||
};
|
||||
const markdownItAnchorOptions = {
|
||||
permalink: true, permalinkBefore: true, permalinkSymbol: '#'
|
||||
};
|
||||
const markdownLib = markdownIt(markdownItOptions).use(
|
||||
markdownItAnchor,
|
||||
markdownItAnchorOptions
|
||||
);
|
||||
eleventyConfig.setLibrary("md", markdownLib);
|
||||
const assets = "./_src/assets/";
|
||||
eleventyConfig.addPassthroughCopy(assets);
|
||||
eleventyConfig.addWatchTarget(assets);
|
||||
eleventyConfig.addFilter("sortByFirstDate", items => items.sort((a, b) => new Date(b.data.images[0].date) - new Date(a.data.images[0].date)));
|
||||
eleventyConfig.addFilter("link", function(text, url) {
|
||||
return `<span class="link"><a href="${url}"><img src="https://www.google.com/s2/favicons?domain=${url}" alt=""/>${text}</a></span>`;
|
||||
eleventyConfig.addFilter("sortByFirstDate", (items) =>
|
||||
items.sort(
|
||||
(a, b) =>
|
||||
new Date(b.data.images[0].date) -
|
||||
new Date(a.data.images[0].date),
|
||||
),
|
||||
);
|
||||
eleventyConfig.addFilter("link", function (text, url) {
|
||||
return `<a href="${url}"><img src="https://www.google.com/s2/favicons?domain=${url}" alt="" aria-hidden="true"/>${text}</a>`;
|
||||
});
|
||||
eleventyConfig.addFilter("ISO", (dateObj) => {
|
||||
return format(dateObj, ("yyyy-LL-dd"));
|
||||
return format(dateObj, "yyyy-LL-dd");
|
||||
});
|
||||
eleventyConfig.addFilter("readable", (dateObj) => {
|
||||
return format(dateObj, ("LLLL do, yyyy"));
|
||||
return format(dateObj, "LLLL do, yyyy");
|
||||
});
|
||||
eleventyConfig.setBrowserSyncConfig({
|
||||
open: true,
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
export const config = {
|
||||
dir: {
|
||||
input: "_src",
|
||||
output: "_site"
|
||||
}
|
||||
output: "_site",
|
||||
},
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue