sd/site
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

clean up, redo windows so it's not "invalid"
All checks were successful
/ build (push) Successful in 1m26s
Details

Browse source
This commit is contained in:
Ruben 2025-06-03 00:05:15 -05:00
commit 87fa720865
No known key found for this signature in database
GPG key ID: 8EA836555FB6D9A5
16 changed files with 160 additions and 182 deletions
Download patch file Download diff file Expand all files Collapse all files

8
_includes/layouts/base.njk
View file

@ -10,11 +10,13 @@ title: base
<body>
{% include "layouts/navbar.njk" %}
{% include "layouts/navbar.njk" %}
{{ content | safe }}
<main>
{{ content | safe }}
</main>
{% include "layouts/footer.njk" %}
{% include "layouts/footer.njk" %}
</body>

8
_includes/layouts/donate/base.njk
View file

@ -11,11 +11,13 @@ title: base
<body>
{% include "layouts/navbar.njk" %}
{% include "layouts/navbar.njk" %}
{{ content | safe }}
<main>
{{ content | safe }}
</main>
{% include "layouts/footer.njk" %}
{% include "layouts/footer.njk" %}
</body>

14
_includes/layouts/donate/page.njk
View file

@ -5,20 +5,20 @@ permalink: "/donate/"
---
<!-- donation window -->
<details open id="donate" class="window">
<summary>
<div aria-hidden="true">
<div id="donate" class="window">
<div class="header">
<div class="icon" aria-hidden="true">
<span class="tabler--message-chatbot"></span>
</div>
<a href="#donate">donate</a>
<div aria-hidden="true">
<div class="window-buttons" aria-hidden="true">
<span class="tabler--minimize"></span>
<span class="tabler--maximize"></span>
</div>
<div aria-hidden="true">
<div class="close-button" aria-hidden="true">
<span class="tabler--x"></span>
</div>
</summary>
</div>
<section>
<p>Hi! I'm <a href="/~sneexy">Ruben</a>. Currently just a student running synth.download in my spare time because I like doing so.</p>
@ -26,4 +26,4 @@ permalink: "/donate/"
<stripe-buy-button buy-button-id="buy_btn_1R9UrrGPbe5QWVnnm6jC3XUf" publishable-key="pk_live_51QFpvEGPbe5QWVnnCUUlT1nEYhVy2F4z30BVaG3LHD8o4qNc7IL67QcPUzBUeptEYpFOtYs6Jc1GvM3ujqsFltYb00oUvMTDMM"></stripe-buy-button>
<p>Please don't feel like you need to donate. Currently, I am able to pay things on my own, but donations do help. <span aria-hidden="true">^^</span></p>
</section>
</details>
</div>

8
_includes/layouts/footer.njk
View file

@ -1,9 +1,9 @@
<!-- webrings and credits -->
<footer>
<details open id="footer" class="window">
<summary>
<div id="footer" class="window">
<div class="header">
<a href="#footer">Footer</a>
</summary>
</div>
<section>
<p class="fediring"><b><a href="https://fediring.net/previous?host=synth.download" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://fediring.net">Fediring</a> <a href="https://fediring.net/next?host=synth.download" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
@ -21,7 +21,7 @@
<p>♡2025 All wrongs reversed. Please copy and share.</p>
<img src="/assets/dumpysynth.gif" alt="GIF of a synth with a massive butt, shaking it towards the viewer" />
</section>
</details>
</div>
</footer>
<!-- element used for our alt popup -->

32
_includes/layouts/home.njk
View file

@ -5,22 +5,22 @@ permalink: "/index.html"
---
<!-- simple site introduction -->
<details open id="site" class="window home">
<summary>
<div aria-hidden="true">
<div id="site" class="window home">
<div class="header">
<div class="icon" aria-hidden="true">
<span class="tabler--message-chatbot"></span>
</div>
<a href="#site">Welcome!</a>
<div aria-hidden="true">
<div class="window-buttons" aria-hidden="true">
<span class="tabler--minimize"></span>
<span class="tabler--maximize"></span>
</div>
<div aria-hidden="true">
<div class="close-button" aria-hidden="true">
<span class="tabler--x"></span>
</div>
</summary>
</div>
<main>
<section>
<p>Hey! Welcome to...</p>
<a href="https://forged.synth.download/sneexy/synth"><img id="logo" loading="lazy" src="/assets/synth.download/logo_web.svg" alt="Synth.Download" /></a>
<p>This is a website managed by <a href="/~sneexy">sneexy</a> with some services hosted here and there, mainly for friends.</p>
@ -34,24 +34,24 @@ permalink: "/index.html"
<li><a href="https://asking.synth.download" style="padding: .2rem; color: var(--sapphire); background-color: color-mix(in srgb, var(--sapphire) 20%, transparent); border-radius: .2rem;">ask-js</a>, a platform for asking other users questions,</li>
<li><small><a href="https://adarkroom.synth.download" style="padding: .2rem; color: var(--foreground); background-color: color-mix(in srgb, var(--foreground) 10%, transparent); border-radius: .2rem;">a dark room</a>, a text adventure game.</small></li>
</ul>
</main>
</details>
</section>
</div>
<!-- buttons -->
<details open id="buttons" class="window home">
<summary>
<div aria-hidden="true">
<div id="buttons" class="window home">
<div class="header">
<div class="icon" aria-hidden="true">
<span class="tabler--link"></span>
</div>
<a href="#buttons">Buttons</a>
<div aria-hidden="true">
<div class="window-buttons" aria-hidden="true">
<span class="tabler--minimize"></span>
<span class="tabler--maximize"></span>
</div>
<div aria-hidden="true">
<div class="close-button" aria-hidden="true">
<span class="tabler--x"></span>
</div>
</summary>
</div>
<section>
<span style="color: var(--red);">If any are broken and/or missing, poke me.</span>
@ -163,4 +163,4 @@ permalink: "/index.html"
</button>
</div>
</section>
</details>
</div>

18
_includes/layouts/notebook.njk
View file

@ -7,22 +7,22 @@ permalink: "/notebook/"
{% set postslist = collections.post %}
<!-- notebook index -->
<details open id="notebook" class="window">
<summary>
<div aria-hidden="true">
<div id="notebook" class="window">
<div class="header">
<div class="icon" aria-hidden="true">
<span class="tabler--article"></span>
</div>
<a href="#notebook">Notebook</a>
<div aria-hidden="true">
<div class="window-buttons" aria-hidden="true">
<span class="tabler--minimize"></span>
<span class="tabler--maximize"></span>
</div>
<div aria-hidden="true">
<div class="close-button" aria-hidden="true">
<span class="tabler--x"></span>
</div>
</summary>
</div>
<main data-pagefind-body>
<section data-pagefind-body>
<div id="search"></div>
<h1><a href="#notebook">Notebook</a> <a href="./rss.xml"><span class="tabler--rss" style="transform: scale(1.5) translateY(.5rem);"></span></a></h1>
<h2><b>NOTE:</b> This page is still heavily a work in progress, nothing on here is functional or what is meant to be.</h2>
@ -49,8 +49,8 @@ permalink: "/notebook/"
<a class="read" href="./read">read more</a>
</div>
</details>
</main>
</details>
</section>
</div>
<!-- pagefind -->
<script>

8
_includes/layouts/sneexy/base.njk
View file

@ -11,11 +11,13 @@ title: base
<body>
{% include "layouts/navbar.njk" %}
{% include "layouts/navbar.njk" %}
{{ content | safe }}
<main>
{{ content | safe }}
</main>
{% include "layouts/footer.njk" %}
{% include "layouts/footer.njk" %}
</body>

56
_includes/layouts/sneexy/page.njk
View file

@ -5,20 +5,20 @@ permalink: "/~sneexy/"
---
<!-- simple introduction -->
<details open id="sneexy" class="window">
<summary>
<div aria-hidden="true">
<div id="sneexy" class="window">
<div class="header">
<div class="icon" aria-hidden="true">
<span class="tabler--user"></span>
</div>
<a href="#sneexy">Sneexy info</a>
<div aria-hidden="true">
<div class="window-buttons" aria-hidden="true">
<span class="tabler--minimize"></span>
<span class="tabler--maximize"></span>
</div>
<div aria-hidden="true">
<div class="close-button" aria-hidden="true">
<span class="tabler--x"></span>
</div>
</summary>
</div>
<section>
<img id="logo" loading="lazy" src="/assets/sneexy.webp" alt="Sneexy" /> <br>
@ -49,23 +49,23 @@ permalink: "/~sneexy/"
</div>
</div>
</section>
</details>
</div>
<!-- about me -->
<details open id="about-me" class="window">
<summary>
<div aria-hidden="true">
<div id="about-me" class="window">
<div class="header">
<div class="icon" aria-hidden="true">
<span class="tabler--info-circle"></span>
</div>
<a href="#about-me">About me</a>
<div aria-hidden="true">
<div class="window-buttons" aria-hidden="true">
<span class="tabler--minimize"></span>
<span class="tabler--maximize"></span>
</div>
<div aria-hidden="true">
<div class="close-button" aria-hidden="true">
<span class="tabler--x"></span>
</div>
</summary>
</div>
<section>
<h2><a href="#about-me">about me</a></h2>
@ -81,23 +81,23 @@ permalink: "/~sneexy/"
<p>I'm usually pretty much both mentally and physically tired all of the time, while also usually being full of ideas that I try to execute and tire myself even more, making things even worse in the end.</p>
<p>With this, I do sometimes make things, but honestly don't expect much from me. <small>I'll make some type of gallery page soon for the things I <i>do</i> make and the things others do for me, I promise.</small></p>
</section>
</details>
</div>
<!-- socials -->
<details open id="links" class="window">
<summary>
<div aria-hidden="true">
<div id="links" class="window">
<div class="header">
<div class="icon" aria-hidden="true">
<span class="tabler--link"></span>
</div>
<a href="#links">links</a>
<div aria-hidden="true">
<div class="window-buttons" aria-hidden="true">
<span class="tabler--minimize"></span>
<span class="tabler--maximize"></span>
</div>
<div aria-hidden="true">
<div class="close-button" aria-hidden="true">
<span class="tabler--x"></span>
</div>
</summary>
</div>
<section>
<h2><a href="#links">Links</a></h2>
@ -115,23 +115,23 @@ permalink: "/~sneexy/"
<p><span class="tabler--corner-down-right"></span> You may observe my Fediverse activity below:</p>
<iframe aria-hidden="true" src="https://booping.synth.download/embed/user-timeline/9zy33jqk7ljg0001?header=false&maxHeight=800&rounded=false&border=false" data-misskey-embed-id="v1_902c0e81-d9d7-4c03-af0e-a6e71c21e95b" loading="lazy" referrerpolicy="strict-origin-when-cross-origin" style="border: none; width: 100%; max-width: 500px; height: 300px; color-scheme: light dark;"></iframe>
</section>
</details>
</div>
<!-- "fun" facts -->
<details open id="fun-facts" class="window">
<summary>
<div aria-hidden="true">
<div id="fun-facts" class="window">
<div class="header">
<div class="icon" aria-hidden="true">
<span class="tabler--mood-empty"></span>
</div>
<a href="#fun-facts">"Fun" facts</a>
<div aria-hidden="true">
<div class="window-buttons" aria-hidden="true">
<span class="tabler--minimize"></span>
<span class="tabler--maximize"></span>
</div>
<div aria-hidden="true">
<div class="close-button" aria-hidden="true">
<span class="tabler--x"></span>
</div>
</summary>
</div>
<section>
<h2><a href="#fun-facts">"Fun" facts</a></h2>
@ -144,4 +144,4 @@ permalink: "/~sneexy/"
<li>I am <b><i>terrible</i></b> at spelling.</li>
</ul>
</section>
</details>
</div>

42
_includes/layouts/sneexy/ruben/page-ruben.njk
View file

@ -5,20 +5,20 @@ permalink: "/~sneexy/ruben/"
---
<!-- intro -->
<details open id="intro" class="window">
<summary>
<div aria-hidden="true">
<div id="intro" class="window">
<div class="header">
<div class="icon" aria-hidden="true">
<span class="tabler--robot-face"></span>
</div>
<a href="#intro">ruben's introduction</a>
<div aria-hidden="true">
<div class="window-buttons" aria-hidden="true">
<span class="tabler--minimize"></span>
<span class="tabler--maximize"></span>
</div>
<div aria-hidden="true">
<div class="close-button" aria-hidden="true">
<span class="tabler--x"></span>
</div>
</summary>
</div>
<section>
<h1>ruben</h1>
@ -42,23 +42,23 @@ permalink: "/~sneexy/ruben/"
</ul>
<p style="text-align: end;">download the <a href="/pub/shared/synth.zip">blockbench model</a> here!</p>
</section>
</details>
</div>
<!-- features -->
<details open id="features" class="window">
<summary>
<div aria-hidden="true">
<div id="features" class="window">
<div class="header">
<div class="icon" aria-hidden="true">
<span class="tabler--notes"></span>
</div>
<a href="#features">features</a>
<div aria-hidden="true">
<div class="window-buttons" aria-hidden="true">
<span class="tabler--minimize"></span>
<span class="tabler--maximize"></span>
</div>
<div aria-hidden="true">
<div class="close-button" aria-hidden="true">
<span class="tabler--x"></span>
</div>
</summary>
</div>
<section>
<h2>features (general)</h2>
@ -104,23 +104,23 @@ permalink: "/~sneexy/ruben/"
<p>the goo has an activated thin outside layer that prevents itself from dripping or allowing things to simply get sucked into it. it gets lost if he is under intense feelings/emotions or simply starts losing energy to keep it activated.</p>
<p>the goo itself is known to have <i>many</i> more features, although most are experimental and best to leave disabled. a notable one is to be able to use the goo as expandable, dynamic storage, however this is not stable and is prone to easy data loss. <small>although ruben likes to keep it enabled for <i>other</i> reasons. :)</small></p>
</section>
</details>
</div>
<!-- personality -->
<details open id="personality" class="window">
<summary>
<div aria-hidden="true">
<div id="personality" class="window">
<div class="header">
<div class="icon" aria-hidden="true">
<span class="tabler--mood-look-up"></span>
</div>
<a href="#personality">personality</a>
<div aria-hidden="true">
<div class="window-buttons" aria-hidden="true">
<span class="tabler--minimize"></span>
<span class="tabler--maximize"></span>
</div>
<div aria-hidden="true">
<div class="close-button" aria-hidden="true">
<span class="tabler--x"></span>
</div>
</summary>
</div>
<section>
<h2>personality</h2>
@ -131,4 +131,4 @@ permalink: "/~sneexy/ruben/"
<p><i>VERY</i> affectionate. all types of (positive) teasing, love, kindness or anything related to that is enough to make him blush and beep. also tends to nuzzle and cuddle friends at random whenever he wants.</p>
<p>mostly lazy. sometimes may try to do something else and is well known for slacking off and doing other things that aren't important and avoiding the things that are important.</p>
</section>
</details>
</div>

29
_includes/styles/base.css
View file

@ -464,7 +464,7 @@ html[data-theme="dark"] {
}
.nav-mobile-menu {
display: inline-block;
display: inline-block !important;
max-width: 3rem;
min-width: 3rem;
position: relative;
@ -592,40 +592,36 @@ html[data-theme="dark"] {
}
.window:not(#footer) {
summary {
div:first-child {
.header {
.icon {
padding: .3rem .4rem .3rem .4rem;
}
div:nth-child(3) {
.window-buttons {
display: none !important;
}
div:nth-child(4) {
.close-button {
margin-left: auto !important;
}
}
animation: unset !important;
main,
section,
article {
main, section, article {
padding: .5rem;
}
border-top: var(--accent) solid .15rem;
animation: unset !important;
border-bottom: var(--accent) solid .15rem;
border-left: unset !important;
border-right: unset !important;
border-radius: unset !important;
border-right: unset !important;
border-top: var(--accent) solid .15rem;
margin-bottom: .8em;
}
/* window when its the first one on the page */
.window:nth-child(2) {
margin-top: 4rem;
.window:first-child {
margin-top: 3.4rem !important;
}
@media (prefers-color-scheme: dark) {
@ -666,13 +662,12 @@ html[data-theme="dark"] {
}
@media screen and (max-width: 540px) {
details#footer.window {
#footer {
border-top: var(--accent) solid .15rem;
border-bottom: var(--accent) solid .15rem;
border-left: unset !important;
border-right: unset !important;
border-radius: unset !important;
margin-bottom: .8em;
}
}

9
_includes/styles/footer.css
View file

@ -12,13 +12,11 @@ footer {
margin-left: auto;
margin-right: auto;
details>summary>a {
.header > a {
padding: .3rem 0rem .3rem 1rem !important;
}
main,
section,
article {
main, section, article {
padding: 1rem !important;
}
@ -73,8 +71,7 @@ footer {
}
}
p,
a {
p, a {
text-align: center;
font-size: 0.938rem;
margin: .2em 0px .2em;

1
_includes/styles/navbar.css
View file

@ -27,7 +27,6 @@
.nav-base {
padding: 0px .2em !important;
max-width: fit-content;
align-content: center;
outline: .13rem solid var(--border);
border-radius: 1rem;

8
_includes/styles/pages/home.css
View file

@ -8,9 +8,7 @@
/ home - specific styling for the main synth.download home page (index.md) */
#site.window.home {
main,
section {
main, section {
a:nth-child(2) {
cursor: default;
}
@ -69,9 +67,7 @@
}
@media screen and (max-width: 59em) {
#site.window.home>main,
#site.window.home>section {
#site.window.home>main, #site.window.home>section {
#logo {
max-width: 100%;
}

3
_includes/styles/pages/notebook.css
View file

@ -91,8 +91,7 @@ details.notebook.article-category {
opacity: .8;
}
p:first-child,
p:last-child {
p:first-child, p:last-child {
opacity: .5;
}
}

97
_includes/styles/windows.css
View file

@ -8,17 +8,16 @@
/ windows - related styling for the windows on pages */
.window {
summary {
.header {
background-color: color-mix(in srgb, var(--accent) 20%, var(--background));
border-bottom: .1rem solid var(--accent);
display: inline-flex;
min-width: 100%;
background-color: color-mix(in srgb, var(--accent) 20%, var(--background));
opacity: .8;
overflow: clip;
text-align: center;
vertical-align: middle;
overflow: clip;
transition: .2s opacity;
div:first-child {
.icon {
background: color-mix(in srgb, var(--accent) 40%, transparent);
padding: .4rem .4rem .2rem 1rem;
border-right: .2rem solid var(--accent);
@ -45,7 +44,7 @@
transform: scale(1.1);
}
div:nth-child(3) {
.window-buttons {
margin-left: auto !important;
padding: .2rem .5rem .2rem 0rem;
@ -62,8 +61,7 @@
}
}
/* close button */
div:nth-child(4) {
.close-button {
background: color-mix(in srgb, var(--accent) 40%, transparent);
padding: .4rem .5rem .2rem .6rem;
border-left: .2rem solid var(--accent);
@ -77,7 +75,7 @@
}
/* close button (animated on hover) */
div:nth-child(4):hover {
.close-button:hover {
background: var(--red);
transition: background .2s;
@ -89,59 +87,33 @@
}
}
main,
section,
article {
section, article {
padding: .8rem;
}
animation-fill-mode: backwards;
background-color: var(--background);
color: var(--foreground);
border-radius: 2rem .6rem 2rem .6rem;
border: var(--accent) solid .15rem;
border-radius: .6rem;
max-width: 60em;
overflow: clip;
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
color: var(--foreground);
margin-bottom: 2em;
margin-left: auto;
margin-right: auto;
margin-bottom: 2em;
transition: .2s box-shadow;
animation-fill-mode: backwards;
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
max-width: 60em;
outline: var(--accent) solid 0rem;
overflow: clip;
transition: .2s outline;
}
/* window styling when hovered */
.window:hover {
summary {
opacity: 1;
transition: .2s opacity;
}
}
/* window styling when open (default state) */
.window[open] {
summary {
opacity: 1;
border-bottom: .1rem solid var(--accent);
transition: .2s opacity;
}
border-radius: 2rem .6rem 2rem .6rem;
}
.window:hover {
box-shadow: var(--accent) 0px 0px 0px .3rem;
transition: .2s box-shadow;
outline: var(--accent) solid .5rem;
transition: .2s outline;
}
/* window when its the first one on the page */
.window:nth-child(2) {
.window:first-child {
margin-top: 5rem;
animation: .3s ease-out .2s 1 window-appear;
@ -149,32 +121,47 @@
}
/* rest of the windows if they exist, to finish the rest of the animations */
.window:nth-child(3) {
.window:nth-child(2) {
animation: .3s ease-out .4s 1 window-appear;
animation-fill-mode: backwards;
}
.window:nth-child(4) {
.window:nth-child(3) {
animation: .3s ease-out .6s 1 window-appear;
animation-fill-mode: backwards;
}
.window:nth-child(5) {
.window:nth-child(4) {
animation: .3s ease-out .8s 1 window-appear;
animation-fill-mode: backwards;
}
.window:nth-child(6) {
.window:nth-child(5) {
animation: .3s ease-out 1s 1 window-appear;
animation-fill-mode: backwards;
}
.window:nth-child(7) {
.window:nth-child(6) {
animation: .3s ease-out 1.2s 1 window-appear;
animation-fill-mode: backwards;
}
.window:nth-child(8) {
.window:nth-child(7) {
animation: .3s ease-out 1.4s 1 window-appear;
animation-fill-mode: backwards;
}
.window:nth-child(8) {
animation: .3s ease-out 1.6s 1 window-appear;
animation-fill-mode: backwards;
}
.window:nth-child(9) {
animation: .3s ease-out 1.8s 1 window-appear;
animation-fill-mode: backwards;
}
.window:nth-child(10) {
animation: .3s ease-out 2s 1 window-appear;
animation-fill-mode: backwards;
}

1
eleventy.config.js
View file

@ -5,7 +5,6 @@ import eleventyNavigationPlugin from "@11ty/eleventy-navigation";
export default function(eleventyConfig) {
eleventyConfig.addPassthroughCopy("assets/");
eleventyConfig.addPassthroughCopy("scripts/");
eleventyConfig.addFilter("cssmin", function (code) {
const result = transform({