Compare commits
4 commits
a652971a27
...
5f8f54c174
| Author | SHA1 | Date | |
|---|---|---|---|
5f8f54c174
|
|||
|
4d754de96b
|
|||
|
5c1e5af05a
|
|||
|
189f1fe4bf
|
16 changed files with 115 additions and 162 deletions
|
|
@ -1,19 +1,19 @@
|
|||
{% set css %}
|
||||
{% include "styles/accessibility.css" %}
|
||||
{% include "styles/animations.css" %}
|
||||
{% include "styles/base.css" %}
|
||||
{% include "styles/colors.css" %}
|
||||
{% include "styles/footer.css" %}
|
||||
{% include "styles/icons.css" %}
|
||||
{% include "styles/navbar.css" %}
|
||||
{% include "styles/base/accessibility.css" %}
|
||||
{% include "styles/base/animations.css" %}
|
||||
{% include "styles/base/base.css" %}
|
||||
{% include "styles/base/colors.css" %}
|
||||
{% include "styles/base/footer.css" %}
|
||||
{% include "styles/base/icons.css" %}
|
||||
{% include "styles/base/navbar.css" %}
|
||||
{% include "styles/base/prism-a11y-dark.css" %}
|
||||
{% include "styles/base/settings.css" %}
|
||||
{% include "styles/base/windows.css" %}
|
||||
{% include "styles/pages/admins.css" %}
|
||||
{% include "styles/pages/home.css" %}
|
||||
{% include "styles/pages/notebook.css" %}
|
||||
{% include "styles/pages/services.css" %}
|
||||
{% include "styles/pages/sneexy.css" %}
|
||||
{% include "styles/prism-a11y-dark.css" %}
|
||||
{% include "styles/settings.css" %}
|
||||
{% include "styles/windows.css" %}
|
||||
{% endset %}
|
||||
{% set js %}
|
||||
{% include "scripts/alt-popup.js" %}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@
|
|||
<settings-model>
|
||||
<h2 style="margin-bottom: 0;">Settings</h2>
|
||||
<p class="caption" style="color: var(--red); margin-top: .4rem;">Settings are saved with JavaScript enabled.</p>
|
||||
<hr class="solid">
|
||||
<div class="container">
|
||||
<settings-section theme>
|
||||
<h3>Theme</h3>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<!-- content warned introduction -->
|
||||
<article window id="warning">
|
||||
<article window id="warning" sneexy-page>
|
||||
<div class="header">
|
||||
<titlebar-icon aria-hidden="true">
|
||||
<icon-tabler alert-triangle></icon-tabler>
|
||||
|
|
@ -13,15 +13,15 @@
|
|||
</close-button>
|
||||
</window-controls>
|
||||
</div>
|
||||
<section>
|
||||
<div class="info-box warn">
|
||||
<p><span class="icon tabler--alert-triangle"></span> <b>Welcome to my <span class="_info" title="Not-safe-for-Work">NSFW</span> page of my random various kinks and fetishes I like,</b> mainly just for the curious. It should be obvious what type of content will be here, but just to make sure: things about <b>Fat/related, inflation/related, vore and other general/common NSFW topics</b> will be on this page.</p>
|
||||
<p>A fair warning, I've also turned off my own limiter here. Full-blown sounds and actions and descriptions of things, I'm a fat fuck who needs to be fed pure food/energy and data. <i aria-hidden="true" style="color:var(--accent);">Breep, sloosh~</i></p>
|
||||
<p>Toggle the checkbox below if you consent to viewing this page's content <small>or are <i>not</i> a minor</small>. Otherwise, you can just back out.</p>
|
||||
<fieldset>
|
||||
<input type="checkbox" id="view-nsfw-page" name="view-nsfw-page" />
|
||||
<label for="view-nsfw-page">Open the way, and show me your weirdness!</label>
|
||||
</fieldset>
|
||||
</div>
|
||||
</section>
|
||||
<window-contents>
|
||||
<section notice-card warning>
|
||||
<h3><icon-tabler alert-triangle></icon-tabler> Welcome to "The Slosh Zone"</h3>
|
||||
<p>This is a dedicated <span title="Not-safe-for-Work">NSFW</span> page going over my random various kinks and fetishes I like,</b> mainly just for the curious. It should be obvious what type of content will be here, but just to make sure: things about <b>Fat/related, inflation/related, vore and other general/common NSFW topics</b> will be on this page.</p>
|
||||
<p>A fair warning, I've also turned off my own limiter here. Full-blown sounds and actions and descriptions of things, I'm a fat fuck who needs to be fed pure energy and data. <i aria-hidden="true" style="color:var(--accent);">Breep, slosh~</i></p>
|
||||
<p>Toggle the checkbox below if you consent to viewing this page's content <small>or are <i>not</i> a minor</small>. Otherwise, just back out.</p>
|
||||
<checkbox-button-group style="margin-top: 1rem;">
|
||||
<label for="view-nsfw-page"><input type="checkbox" id="view-nsfw-page" name="view-nsfw-page"> Open the way, and show me your weirdness!</label>
|
||||
</checkbox-button-group>
|
||||
</section>
|
||||
</window-contents>
|
||||
</article>
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
<!-- nsfw -->
|
||||
<article window id="nsfw">
|
||||
<article window id="nsfw" style="display: none;">
|
||||
<div class="header">
|
||||
<titlebar-icon aria-hidden="true">
|
||||
<icon-tabler user></icon-tabler>
|
||||
|
|
@ -13,7 +13,7 @@
|
|||
</close-button>
|
||||
</window-controls>
|
||||
</div>
|
||||
<section>
|
||||
<window-contents>
|
||||
<h2><a href="#nsfw">"the slosh zone"</a></h2>
|
||||
<p>In the case that it wasn't obvious, I like <i>big</i> things, as a whole, although I'm not very open about the other things I'm into <small>because why would I?</small> But specifically, I'm into:</p>
|
||||
<ul>
|
||||
|
|
@ -37,5 +37,5 @@
|
|||
<p>...and a variety of other things. I'm mostly flexible with my kinks/fetishes, and I fuck around with a good amount of things. <small>And yes, the general "NSFW" stuff like sex or whatever is cool by me.</small></p>
|
||||
<p>In general, I do my best to keep my open/public spaces and interactions clean, and avoid talking or going deep into these types of subjects. If I ever do on those spaces, I do so with a content-warning whenever possible. <small>So basically, only Fedi.</small></p>
|
||||
<p>I <i>do</i> have NSFW focused spaces/accounts for myself. Feel free to tease or be lewd or roleplay with me if you'd like on those accounts, although only if we know each other a decent amount. <small>In that case though, doing so in our direct messages is also fine. Poke at my belly, rub me... fill me full of zip bombs, <span style="color:var(--accent);">breeeeep~</span></small> Otherwise I'll just ignore or block you, especially if you keep trying to make things horny when <span style="text-transform:none;">I Do Not Know You.</span></p>
|
||||
</section>
|
||||
</window-contents>
|
||||
</article>
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
<!-- socials -->
|
||||
<article window id="links">
|
||||
<article window id="links" sneexy-page>
|
||||
<div class="header">
|
||||
<titlebar-icon aria-hidden="true">
|
||||
<icon-tabler link></icon-tabler>
|
||||
|
|
@ -15,19 +15,23 @@
|
|||
</div>
|
||||
<window-contents>
|
||||
<h2><a href="#links">Links</a></h2>
|
||||
<p>My links to all of my public facing socials and contacts. If I know you well, you may ask me for anything more private, like Signal or Matrix, etc. <small>The fastest way to get this is by checking my <i>followers only</i> pinned post if you follow me/we're mutuals on the Fediverse.</small></span></p>
|
||||
<div class="socials-contacts-list">
|
||||
<a class="fedi-icon" href="https://booping.synth.download/@sneexy" style="background-color: color-mix(in srgb, var(--orange) 25%, transparent); color: var(--orange);" aria-label="Fediverse/Mastodon"><span class="icon tabler--universe" style="pointer-events: none;"></span></a>
|
||||
<a class="fedi-icon-2" href="https://booping.synth.download/@sneexy" style="background-color: color-mix(in srgb, var(--teal) 25%, transparent); color: var(--teal);" aria-label="Fediverse/Mastodon" aria-hidden="true"><span class="icon tabler--brand-mastodon" style="pointer-events: none;"></span></a>
|
||||
<a href="mailto:sneexy@synth.download" style="background-color: color-mix(in srgb, var(--red) 25%, transparent); color: var(--red);" aria-label="Email"><span class="icon tabler--mail" style="pointer-events: none;"></span></a>
|
||||
<a href="https://listenbrainz.org/user/Sneexy" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" aria-label="ListenBraniz"><span class="icon tabler--brand-metabrainz" style="pointer-events: none;"></span></a>
|
||||
<a href="https://www.last.fm/user/sneexy_is_gay" style="background-color: color-mix(in srgb, var(--red) 25%, transparent); color: var(--red);" aria-label="Last.fm"><span class="icon tabler--brand-lastfm" style="pointer-events: none;"></span></a>
|
||||
<a href="https://git.gay/sneexy" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" aria-label="Git"><span class="icon tabler--brand-git" style="pointer-events: none;"></span></a>
|
||||
<a href="https://github.com/sneexy-boi" style="background-color: color-mix(in srgb, var(--lavender) 25%, transparent); color: var(--lavender);" aria-label="GitHub"><span class="icon tabler--brand-github" style="pointer-events: none;"></span></a>
|
||||
<a href="https://archive.org/details/@sneexy" style="background-color: color-mix(in srgb, var(--foreground) 25%, transparent); color: var(--foreground);" aria-label="Internet Archive"><span class="icon tabler--building-bank" style="pointer-events: none;"></span></a>
|
||||
<p>All of my public facing profiles and contacts that are worth checking or if in need of contacting me. <small>I have other contacts that are private for mutuals, I'll share if you ask.</small></p>
|
||||
<div class="container">
|
||||
<socials-links>
|
||||
<a button fedi href="https://booping.synth.download/@sneexy"><icon-tabler social></icon-tabler> Fediverse <small username>@sneexy@booping.synth.download</small></a>
|
||||
<a button bsky href="https://bsky.app/profile/sneexy.synth.download"><icon-tabler brand-bluesky></icon-tabler> Bluesky <small username>@sneexy.synth.download</small></a>
|
||||
<a button email href="mailto:sneexy@synth.download"><icon-tabler mail></icon-tabler> Email <small username>sneexy@synth.download</small></a>
|
||||
<a button listenbrainz href="https://listenbrainz.org/user/Sneexy"><icon-tabler brand-metabrainz></icon-tabler> ListenBrainz <small username>Sneexy</small></a>
|
||||
<a button lastfm href="https://www.last.fm/user/sneexy_is_gay"><icon-tabler brand-lastfm></icon-tabler> Last.fm <small username>sneexy_is_gay</small></a>
|
||||
<a button git href="https://forged.synth.download/sneexy"><icon-tabler brand-git></icon-tabler> Git <small username>sneexy@forged.synth.download</small></a>
|
||||
<a button gitgay href="https://git.gay/sneexy"><icon-tabler brand-git></icon-tabler> Git.gay <small username>sneexy@git.gay</small></a>
|
||||
<a button github href="https://github.com/sneexy-boi"><icon-tabler brand-github></icon-tabler> GitHub <small username>sneexy-boi</small></a>
|
||||
<a button archive href="https://archive.org/details/@sneexy"><icon-tabler building-bank></icon-tabler> Internet Archive <small username>sneexy</small></a>
|
||||
</socials-links>
|
||||
<socials-fedi>
|
||||
<iframe src="https://booping.synth.download/embed/user-timeline/9zy33jqk7ljg0001?maxHeight=o" data-misskey-embed-id="v1_8a5d48c6-2549-4fd1-b2a9-a37194567beb" loading="lazy" referrerpolicy="strict-origin-when-cross-origin" style="border: none; width: 100%; max-width: 500px; height: 300px; color-scheme: light dark;"></iframe>
|
||||
<script defer src="https://booping.synth.download/embed.js"></script>
|
||||
</socials-fedi>
|
||||
</div>
|
||||
<p><span class="icon tabler--corner-down-right"></span> You may observe my Fediverse activity below:</p>
|
||||
<script defer src="https://booping.synth.download/embed.js"></script>
|
||||
<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>
|
||||
</window-contents>
|
||||
</article>
|
||||
|
|
@ -168,10 +168,11 @@ small a {
|
|||
/* lists need some styling */
|
||||
ul {
|
||||
margin-left: -1.3rem;
|
||||
ul { margin-bottom: .5rem; }
|
||||
|
||||
li {
|
||||
margin-bottom: .5rem;
|
||||
&:last-of-type { margin-bottom: 0; }
|
||||
&:last-child { margin-bottom: 0; }
|
||||
|
||||
&::marker {
|
||||
color: var(--accent);
|
||||
|
|
@ -414,6 +415,7 @@ card-container {
|
|||
--n-bg: var(--accent);
|
||||
border-radius: 1rem;
|
||||
border: .15rem solid color-mix(in srgb, var(--yellow) 20%, transparent);
|
||||
color: var(--foreground);
|
||||
margin-bottom: .8rem;
|
||||
padding: .5rem;
|
||||
|
||||
|
|
@ -423,9 +425,10 @@ card-container {
|
|||
}
|
||||
p, ul { &:last-of-type { margin-bottom: 0; } }
|
||||
|
||||
&[important] {
|
||||
&[important], &[warning] {
|
||||
--n-bg: var(--yellow);
|
||||
background-color: color-mix(in srgb, var(--n-bg) 15%, transparent);
|
||||
h3 { color: var(--yellow); }
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -690,18 +693,18 @@ buttons-container {
|
|||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
gap: .4rem;
|
||||
}
|
||||
|
||||
[button] {
|
||||
background: light-dark(color-mix(in srgb,var(--accent)60%,transparent), color-mix(in srgb,var(--accent)25%,transparent));
|
||||
padding: .2rem .5rem;
|
||||
border-radius: 10rem;
|
||||
transition: .2s;
|
||||
text-decoration: none !important;
|
||||
[button] {
|
||||
background: light-dark(color-mix(in srgb,var(--accent)40%,transparent), color-mix(in srgb,var(--accent)25%,transparent));
|
||||
border-radius: 10rem;
|
||||
padding: .2rem .5rem;
|
||||
text-decoration: none !important;
|
||||
transition: .2s;
|
||||
|
||||
&:hover {
|
||||
background: var(--accent);
|
||||
color: light-dark(var(--foreground), var(--background));
|
||||
}
|
||||
&:hover {
|
||||
background: var(--accent);
|
||||
color: light-dark(var(--foreground), var(--background));
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -38,9 +38,10 @@ footer {
|
|||
p:last-child { margin-bottom: 0; }
|
||||
|
||||
h3 {
|
||||
border-bottom: unset;
|
||||
font-size: 1.5rem;
|
||||
margin-top: 0;
|
||||
margin-bottom: .8rem;
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -29,6 +29,7 @@ icon-tabler {
|
|||
&[article] { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 6a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2zm4 2h10M7 12h10M7 16h10'/%3E%3C/svg%3E"); }
|
||||
&[battery-filled] { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17 6a3 3 0 0 1 2.995 2.824L20 9v.086l.052.019a1.5 1.5 0 0 1 .941 1.25L21 10.5v3a1.5 1.5 0 0 1-.948 1.395l-.052.018V15a3 3 0 0 1-2.824 2.995L17 18H6a3 3 0 0 1-2.995-2.824L3 15V9a3 3 0 0 1 2.824-2.995L6 6z'/%3E%3C/svg%3E"); }
|
||||
&[bell] { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M10 5a2 2 0 1 1 4 0a7 7 0 0 1 4 6v3a4 4 0 0 0 2 3H4a4 4 0 0 0 2-3v-3a7 7 0 0 1 4-6M9 17v1a3 3 0 0 0 6 0v-1'/%3E%3C/svg%3E"); }
|
||||
&[brand-bluesky] { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6.335 5.144C4.681 3.945 2 3.017 2 5.97c0 .59.35 4.953.556 5.661C3.269 14.094 5.686 14.381 8 14c-4.045.665-4.889 3.208-2.667 5.41C6.363 20.428 7.246 21 8 21c2 0 3.134-2.769 3.5-3.5q.5-1 .5-1.5q0 .5.5 1.5c.366.731 1.5 3.5 3.5 3.5c.754 0 1.637-.571 2.667-1.59C20.889 17.207 20.045 14.664 16 14c2.314.38 4.73.094 5.444-2.369c.206-.708.556-5.072.556-5.661c0-2.953-2.68-2.025-4.335-.826C15.372 6.806 12.905 10.192 12 12c-.905-1.808-3.372-5.194-5.665-6.856'/%3E%3C/svg%3E"); }
|
||||
&[brand-git] { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M15 12a1 1 0 1 0 2 0a1 1 0 1 0-2 0m-4-4a1 1 0 1 0 2 0a1 1 0 1 0-2 0m0 8a1 1 0 1 0 2 0a1 1 0 1 0-2 0m1-1V9m3 2l-2-2m-2-2L9.1 5.1'/%3E%3Cpath d='m13.446 2.6l7.955 7.954a2.045 2.045 0 0 1 0 2.892l-7.955 7.955a2.045 2.045 0 0 1-2.892 0l-7.955-7.955a2.045 2.045 0 0 1 0-2.892l7.955-7.955a2.045 2.045 0 0 1 2.892 0z'/%3E%3C/g%3E%3C/svg%3E"); }
|
||||
&[brand-github] { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 19c-4.3 1.4-4.3-2.5-6-3m12 5v-3.5c0-1 .1-1.4-.5-2c2.8-.3 5.5-1.4 5.5-6a4.6 4.6 0 0 0-1.3-3.2a4.2 4.2 0 0 0-.1-3.2s-1.1-.3-3.5 1.3a12.3 12.3 0 0 0-6.2 0C6.5 2.8 5.4 3.1 5.4 3.1a4.2 4.2 0 0 0-.1 3.2A4.6 4.6 0 0 0 4 9.5c0 4.6 2.7 5.7 5.5 6c-.6.6-.6 1.2-.5 2V21'/%3E%3C/svg%3E"); }
|
||||
&[brand-lastfm] { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M20 8c-.83-1-1.388-1-2-1s-2 .271-2 2s1.384 2.233 3 3s2.125 1.812 2 3s-1 2-3 2s-3-1-3.5-2s-1.585-4.78-2.497-6a5 5 0 1 0-1 7'/%3E%3C/svg%3E"); }
|
||||
|
|
@ -41,6 +41,14 @@ settings-area {
|
|||
outline-color: var(--accent);
|
||||
}
|
||||
|
||||
h2, h3 {
|
||||
margin-top: 0;
|
||||
|
||||
&:not(h2:first-child) {
|
||||
border-bottom: unset !important;
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
/ ~sneexy - breeeep! my page! slooosh~ */
|
||||
|
||||
/* my page has goop in html to set goopy colors */
|
||||
html:has(article#sneexy) {
|
||||
html:has(article[sneexy-page]) {
|
||||
--accent: light-dark(#00d131, #65ff88) !important;
|
||||
|
||||
article#sneexy window-contents {
|
||||
|
|
@ -54,124 +54,61 @@ html:has(article#sneexy) {
|
|||
}
|
||||
|
||||
/* socials and links sections */
|
||||
.socials-contacts-list {
|
||||
a {
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
align-content: center;
|
||||
text-align: center;
|
||||
border-radius: .5rem;
|
||||
article#links {
|
||||
window-contents {
|
||||
.container {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
gap: 1rem;
|
||||
|
||||
span {
|
||||
transform: scale(1.58) translateY(.07rem);
|
||||
}
|
||||
}
|
||||
socials-links {
|
||||
display: flex;
|
||||
flex-flow: column wrap;
|
||||
flex: content;
|
||||
gap: .8rem;
|
||||
min-width: 10rem;
|
||||
|
||||
.fedi-icon {
|
||||
anchor-name: --fedi-icon;
|
||||
animation: opacity-blink 4s infinite;
|
||||
}
|
||||
[button] {
|
||||
height: fit-content;
|
||||
padding: .4rem .8rem;
|
||||
|
||||
.fedi-icon-2 {
|
||||
position-anchor: --fedi-icon;
|
||||
position: absolute;
|
||||
margin-left: -3.681rem;
|
||||
z-index: 2;
|
||||
animation: opacity-blink-reverse 4s infinite;
|
||||
}
|
||||
}
|
||||
small[username] {
|
||||
float: right;
|
||||
margin-left: 2rem;
|
||||
}
|
||||
|
||||
/* sharkey iframe embed */
|
||||
#links > section > iframe {
|
||||
display: flex;
|
||||
margin-top: 1rem;
|
||||
margin-bottom: .3crem;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
border: var(--accent) solid .15rem !important;
|
||||
border-radius: .6rem;
|
||||
transition: .2s box-shadow;
|
||||
}
|
||||
|
||||
#links > section > iframe:hover {
|
||||
box-shadow: var(--accent) 0px 0px 0px .3rem;
|
||||
transition: .2s box-shadow;
|
||||
}
|
||||
|
||||
/* nsfw page */
|
||||
#warning {
|
||||
fieldset {
|
||||
background-color: color-mix(in srgb, var(--background) 95%, white);
|
||||
border-radius: 1rem;
|
||||
border: .2rem solid var(--border);
|
||||
color: var(--foreground);
|
||||
max-width: fit-content;
|
||||
padding: .5rem;
|
||||
}
|
||||
}
|
||||
|
||||
#nsfw {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 59em) {
|
||||
#sneexy > section {
|
||||
#logo {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.selfinfo {
|
||||
grid-template-areas:
|
||||
"pronouns"
|
||||
"names";
|
||||
div {
|
||||
text-align: center;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
ul {
|
||||
text-align: left !important;
|
||||
&[fedi] { --accent: var(--yellow); }
|
||||
&[bsky] { --accent: var(--blue); }
|
||||
&[listenbrainz] { --accent: var(--purple); }
|
||||
&[lastfm] {
|
||||
--accent: var(--red);
|
||||
&:hover { color: var(--background); }
|
||||
}
|
||||
&[gitgay] { --accent: var(--green); }
|
||||
&[github] { --accent: light-dark(color-mix(in srgb, var(--white) 10%, var(--black)), var(--white)); }
|
||||
&[archive] {
|
||||
--accent: light-dark(color-mix(in srgb, var(--dark-white) 30%, var(--black)), color-mix(in srgb, var(--dark-white) 15%, var(--black)));
|
||||
&:hover { color: light-dark(var(--foreground), var(--foreground)); }
|
||||
}
|
||||
}
|
||||
}
|
||||
div:first-child {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
div:last-child {
|
||||
margin-left: auto !important;
|
||||
|
||||
socials-fedi {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
height: 27rem;
|
||||
overflow-y: scroll;
|
||||
width: 25rem;
|
||||
border-radius: .5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.socials-contacts-list {
|
||||
text-align: center;
|
||||
a {
|
||||
margin-top: .5rem;
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
/* enable nsfw window on nsfw page when checkbox is toggled */
|
||||
&:has(input[type="checkbox"]#view-nsfw-page:checked) {
|
||||
article#nsfw {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* enable nsfw window on nsfw page when checkbox is toggled */
|
||||
html[page-is="goopy"]:has(input[type="checkbox"]#view-nsfw-page:checked) {
|
||||
#nsfw {
|
||||
display: inherit !important;
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme="light"][page-is="goopy"] {
|
||||
--accent: #00d131 !important;
|
||||
--link: #008d21 !important;
|
||||
|
||||
.nav-baselink, .nav-accessibility {
|
||||
background-color: var(--accent) !important;
|
||||
color: var(--foreground) !important;
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme="dark"][page-is="goopy"] {
|
||||
--accent: #65ff88 !important;
|
||||
--link: var(--accent) !important;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue