Compare commits
4 Commits
92e077bc57
...
72f8eee9cd
| Author | SHA1 | Date | |
|---|---|---|---|
| 72f8eee9cd | |||
| 0909926bde | |||
| 874ec4c434 | |||
| 0cec181ec3 |
@@ -8,4 +8,3 @@
|
|||||||
<meta name="generator" content="{{ eleventy.generator }}">
|
<meta name="generator" content="{{ eleventy.generator }}">
|
||||||
<link rel="alternate" href="/feed/feed.xml" type="application/atom+xml" title="{{ metadata.title }}">
|
<link rel="alternate" href="/feed/feed.xml" type="application/atom+xml" title="{{ metadata.title }}">
|
||||||
<link rel="alternate" href="/feed/feed.json" type="application/json" title="{{ metadata.title }}">
|
<link rel="alternate" href="/feed/feed.json" type="application/json" title="{{ metadata.title }}">
|
||||||
<script type="module" src="/js/main.js"></script>
|
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
export default {
|
export default {
|
||||||
tags: ["posts", "metadata", "profilePic", "tags"],
|
tags: ["posts", "metadata", "profilePic", "tagList"],
|
||||||
layout: "layouts/post.njk",
|
layout: "layouts/post.njk",
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -7,6 +7,8 @@ includeTOC: true
|
|||||||
---
|
---
|
||||||
## 2026
|
## 2026
|
||||||
### April
|
### April
|
||||||
|
* 2026-04-20
|
||||||
|
* Updated [/links](/links).
|
||||||
* 2026-04-17
|
* 2026-04-17
|
||||||
* Added tables of contents to list pages where it makes sense.
|
* Added tables of contents to list pages where it makes sense.
|
||||||
* Refactored CSS so that unnecessary styles are not loaded on every page.
|
* Refactored CSS so that unnecessary styles are not loaded on every page.
|
||||||
|
|||||||
@@ -2,7 +2,8 @@
|
|||||||
layout: layouts/base.njk
|
layout: layouts/base.njk
|
||||||
title: Nathan Upchurch | Guestbook
|
title: Nathan Upchurch | Guestbook
|
||||||
structuredData: none
|
structuredData: none
|
||||||
tag: guestbook
|
tags:
|
||||||
|
- guestbook
|
||||||
---
|
---
|
||||||
<h1>Sign My Guestbook</h1>
|
<h1>Sign My Guestbook</h1>
|
||||||
<!-- Guestbook Script -->
|
<!-- Guestbook Script -->
|
||||||
|
|||||||
@@ -259,3 +259,8 @@ Unlimited creativity, zero ads.
|
|||||||
* VPN
|
* VPN
|
||||||
## Random cool stuff
|
## Random cool stuff
|
||||||
* [intertapes.net](https://intertapes.net/)—An updating collection of found cassette tapes from different locations. The audio fragments include: voice memos, field recordings, mixtapes, bootlegs and more.
|
* [intertapes.net](https://intertapes.net/)—An updating collection of found cassette tapes from different locations. The audio fragments include: voice memos, field recordings, mixtapes, bootlegs and more.
|
||||||
|
## Sounds & Samples
|
||||||
|
* [FreeSound](https://freesound.org/)
|
||||||
|
* [LooperMan](https://www.looperman.com/)
|
||||||
|
* [Pixabay](https://pixabay.com/sound-effects/)
|
||||||
|
* [SampleSwap](https://sampleswap.org/index.php)
|
||||||
|
|||||||
7
content/now-burning/Now Burning_2026-04-18_19:16.md
Normal file
7
content/now-burning/Now Burning_2026-04-18_19:16.md
Normal file
@@ -0,0 +1,7 @@
|
|||||||
|
---
|
||||||
|
title: Nag Champa Cotton Candy
|
||||||
|
manufacturer: Satya
|
||||||
|
date: 2026-04-18 19:15:00
|
||||||
|
time: 7:15 PM
|
||||||
|
---
|
||||||
|
Smells like burning sugar.
|
||||||
5
content/status/Status_2026-04-18_09:31.md
Normal file
5
content/status/Status_2026-04-18_09:31.md
Normal file
@@ -0,0 +1,5 @@
|
|||||||
|
---
|
||||||
|
date: 2026-04-18 9:29:00
|
||||||
|
emoji: 🍵
|
||||||
|
comment: Starting the day with some pinhead oats with banana and peanut butter, Middle Mountain Duck Shit Aroma Dan Cong Oolong from Yunnan Sourcing, and a stick of Tennendo's Kyara. Got to love Saturday mornings.
|
||||||
|
---
|
||||||
48
public/css/audio-player.css
Normal file
48
public/css/audio-player.css
Normal file
@@ -0,0 +1,48 @@
|
|||||||
|
.albumCover {
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.albumCover,
|
||||||
|
.coverContainer {
|
||||||
|
width: var(--space-4xl);
|
||||||
|
height: var(--space-4xl);
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
}
|
||||||
|
|
||||||
|
.artist {
|
||||||
|
font-size: var(--meta-font-size);
|
||||||
|
margin-bottom: var(--space-s);
|
||||||
|
}
|
||||||
|
|
||||||
|
.captionAndPlayer {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column nowrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mplayer {
|
||||||
|
background-color: var(--card-color);
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
box-shadow: var(--box-shadow);
|
||||||
|
display: flex;
|
||||||
|
gap: var(--space-s);
|
||||||
|
margin: 0 0 var(--space-s) 0;
|
||||||
|
padding: var(--space-m);
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.player {
|
||||||
|
align-self: flex-end;
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.songTitle {
|
||||||
|
font-size: var(--step-1);
|
||||||
|
font-variation-settings:
|
||||||
|
"opsz" 50,
|
||||||
|
"wght" 350,
|
||||||
|
"SOFT" 20,
|
||||||
|
"WONK" 1;
|
||||||
|
}
|
||||||
13
public/css/blogroll.css
Normal file
13
public/css/blogroll.css
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
.blogroll {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
.blogroll-category-group {
|
||||||
|
margin-bottom: var(--space-l);
|
||||||
|
margin-left: var(--space-m);
|
||||||
|
h3 {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
margin: var(--space-2xs) auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
80
public/css/comments.css
Normal file
80
public/css/comments.css
Normal file
@@ -0,0 +1,80 @@
|
|||||||
|
.isso-comment-header {
|
||||||
|
height: var(--space-2xl) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
h4.isso-thread-heading {
|
||||||
|
color: var(--text-color) !important;
|
||||||
|
font-size: var(--step-2) !important;
|
||||||
|
font-variation-settings:
|
||||||
|
"opsz" 50,
|
||||||
|
"wght" 350,
|
||||||
|
"SOFT" 20,
|
||||||
|
"WONK" 1 !important;
|
||||||
|
line-height: calc(var(--step-2) * 0.25 + var(--step-2)) !important;
|
||||||
|
margin-bottom: var(--space-m) !important;
|
||||||
|
margin-top: var(--space-m) !important;
|
||||||
|
padding-bottom: 0 !important;
|
||||||
|
padding-top: 0 !important;
|
||||||
|
text-wrap: pretty !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.isso-text > h1,
|
||||||
|
.isso-text > h2 {
|
||||||
|
padding: 0 0 0 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.isso-form-wrapper > .isso-auth-section > .isso-post-action > input {
|
||||||
|
background-color: var(--contrast-color) !important;
|
||||||
|
border: none !important;
|
||||||
|
border-radius: var(--border-radius) !important;
|
||||||
|
color: var(--background-color) !important;
|
||||||
|
font-family: var(--font-family-ui) !important;
|
||||||
|
font-size: var(--step--2) !important;
|
||||||
|
font-variation-settings: var(--font-variation-ui) !important;
|
||||||
|
height: var(--space-m-l) !important;
|
||||||
|
letter-spacing: var(--ui-letter-spacing) !important;
|
||||||
|
margin: var(--space-xs) 0 0 0 !important;
|
||||||
|
padding: 0 var(--space-xs) !important;
|
||||||
|
text-transform: uppercase !important;
|
||||||
|
transition: var(--transition-normal) !important;
|
||||||
|
white-space: nowrap !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
p.isso-input-wrapper {
|
||||||
|
display: block !important;
|
||||||
|
max-width: 100% !important;
|
||||||
|
& > label,
|
||||||
|
& > input {
|
||||||
|
font-family: var(--font-family-ui) !important;
|
||||||
|
font-size: var(--step--2) !important;
|
||||||
|
font-variation-settings: var(--font-variation-ui) !important;
|
||||||
|
}
|
||||||
|
& input {
|
||||||
|
margin-block: inherit !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.isso-post-action {
|
||||||
|
display: inline-block !important;
|
||||||
|
float: inherit !important;
|
||||||
|
margin: 0 var(--space-2xs) 0 0 !important;
|
||||||
|
&::after {
|
||||||
|
content: "" !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
textarea.isso-textarea {
|
||||||
|
background-color: var(--background-color) !important;
|
||||||
|
border: var(--border-details) !important;
|
||||||
|
border-color: var(--contrast-color) !important;
|
||||||
|
border-radius: var(--border-radius) !important;
|
||||||
|
color: var(--text-color) !important;
|
||||||
|
font-family: var(--font-family) !important;
|
||||||
|
font-size: var(--step-0) !important;
|
||||||
|
font-variation-settings: var(--font-variation-default) !important;
|
||||||
|
margin-block: 0 1lh !important;
|
||||||
|
min-height: var(--space-l) !important;
|
||||||
|
padding: 0 var(--space-3xs) !important;
|
||||||
|
resize: vertical !important;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
7
public/css/continue-discussion-on-mastodon.css
Normal file
7
public/css/continue-discussion-on-mastodon.css
Normal file
@@ -0,0 +1,7 @@
|
|||||||
|
.continue-discussion {
|
||||||
|
grid-column: var(--span-grid);
|
||||||
|
}
|
||||||
|
.continue-discussion button {
|
||||||
|
margin-top: calc(var(--space-s) * -1);
|
||||||
|
margin-bottom: var(--space-m);
|
||||||
|
}
|
||||||
16
public/css/dropcap.css
Normal file
16
public/css/dropcap.css
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
main > section > article.post > p:not(.nodropcap):first-of-type:first-letter {
|
||||||
|
float: left;
|
||||||
|
font-size: var(--step-5);
|
||||||
|
padding: var(--space-2xs);
|
||||||
|
color: var(--contrast-color);
|
||||||
|
border: solid 2px var(--contrast-color);
|
||||||
|
font-family: var(--font-family-headline);
|
||||||
|
font-variation-settings:
|
||||||
|
"opsz" 144,
|
||||||
|
"wght" 500,
|
||||||
|
"SOFT" 10,
|
||||||
|
"WONK" 0;
|
||||||
|
margin: 0.5rem 0.7rem 0 0;
|
||||||
|
border-radius: 0.2em;
|
||||||
|
border-top-left-radius: 0;
|
||||||
|
}
|
||||||
20
public/css/fleuron.css
Normal file
20
public/css/fleuron.css
Normal file
@@ -0,0 +1,20 @@
|
|||||||
|
/* Add fleuron to last <p> in section */
|
||||||
|
section > p:not(blockquote > p, p.isso-post-action):last-child:after {
|
||||||
|
content: "\2766";
|
||||||
|
display: inline;
|
||||||
|
font-size: var(--step-1);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Add fleuron after <p> in article when footnotes are present */
|
||||||
|
p:has(+ hr.footnotes-sep):after {
|
||||||
|
content: "\2766";
|
||||||
|
display: inline;
|
||||||
|
font-size: var(--step-1);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Add fleuron after last <p> in article */
|
||||||
|
article.post > p:not(blockquote > p):last-child:after {
|
||||||
|
content: "\2766";
|
||||||
|
display: inline;
|
||||||
|
font-size: var(--step-1);
|
||||||
|
}
|
||||||
16
public/css/gallery-images.css
Normal file
16
public/css/gallery-images.css
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
.gallery-images {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: row wrap;
|
||||||
|
row-gap: var(--space-xs-s);
|
||||||
|
column-gap: var(--space-m-l);
|
||||||
|
.gallery-image-container {
|
||||||
|
width: var(--space-7xl-8xl);
|
||||||
|
height: var(--space-7xl-8xl);
|
||||||
|
.gallery-image {
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
width: var(--space-7xl-8xl);
|
||||||
|
height: var(--space-7xl-8xl);
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
39
public/css/guestbook.css
Normal file
39
public/css/guestbook.css
Normal file
@@ -0,0 +1,39 @@
|
|||||||
|
.guestbook-message blockquote {
|
||||||
|
margin-bottom: var(--space-m);
|
||||||
|
margin-top: var(--space-3xs);
|
||||||
|
}
|
||||||
|
.guestbook-message p {
|
||||||
|
margin-block: 0 0;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.guestbook-message p b,
|
||||||
|
.guestbook-message p small {
|
||||||
|
font-family: var(--meta-font-family);
|
||||||
|
font-size: var(--meta-font-size);
|
||||||
|
font-variation-settings: var(--meta-font-variation-settings);
|
||||||
|
}
|
||||||
|
#guestbooks___challenge-answer-container br,
|
||||||
|
.guestbooks___input-container br {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.guestbook-message-reply {
|
||||||
|
border-left: var(--border-details);
|
||||||
|
margin-left: var(--space-l);
|
||||||
|
margin-top: calc(var(--space-s) * -1);
|
||||||
|
opacity: 0.9;
|
||||||
|
padding-left: var(--space-s);
|
||||||
|
font-style: italic;
|
||||||
|
& blockquote {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
& blockquote::before {
|
||||||
|
content: "";
|
||||||
|
}
|
||||||
|
& p::before {
|
||||||
|
content: "Reply from ";
|
||||||
|
font-family: var(--meta-font-family);
|
||||||
|
font-size: var(--meta-font-size);
|
||||||
|
font-variation-settings: var(--meta-font-variation-settings);
|
||||||
|
}
|
||||||
|
}
|
||||||
32
public/css/metadata.css
Normal file
32
public/css/metadata.css
Normal file
@@ -0,0 +1,32 @@
|
|||||||
|
.post-metadata {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: row nowrap;
|
||||||
|
padding: 0 0 var(--space-l) 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-metadata-copy {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column nowrap;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-metadata p,
|
||||||
|
.post-metadata ul,
|
||||||
|
.post-metadata ul li,
|
||||||
|
time,
|
||||||
|
.metadata {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: row wrap;
|
||||||
|
font-family: var(--meta-font-family);
|
||||||
|
font-size: var(--meta-font-size);
|
||||||
|
font-style: var(--meta-font-style);
|
||||||
|
font-variation-settings: var(--meta-font-variation-settings);
|
||||||
|
line-height: calc(var(--meta-font-size) * 0.5 + var(--meta-font-size));
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
padding-left: 0em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-metadata {
|
||||||
|
padding-left: 0.15rem;
|
||||||
|
}
|
||||||
61
public/css/microblog.css
Normal file
61
public/css/microblog.css
Normal file
@@ -0,0 +1,61 @@
|
|||||||
|
.microblog-comment {
|
||||||
|
p {
|
||||||
|
font-style: italic;
|
||||||
|
margin: 0;
|
||||||
|
padding: var(--space-s) 0 0 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.microblog-emoji {
|
||||||
|
font-size: var(--step-6);
|
||||||
|
margin-right: var(--space-s);
|
||||||
|
}
|
||||||
|
|
||||||
|
.microblog-icon {
|
||||||
|
filter: var(--logo-filter);
|
||||||
|
height: var(--space-4xl);
|
||||||
|
padding-right: var(--space-s);
|
||||||
|
width: var(--space-2xl);
|
||||||
|
}
|
||||||
|
.microblog-list {
|
||||||
|
.post-metadata {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.microblog-post {
|
||||||
|
display: flex;
|
||||||
|
.microblog-comment {
|
||||||
|
p {
|
||||||
|
padding-top: 0;
|
||||||
|
padding-bottom: var(--space-2xs);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.microblog-status {
|
||||||
|
&.card {
|
||||||
|
align-items: center;
|
||||||
|
padding: var(--space-s);
|
||||||
|
}
|
||||||
|
.microblog-status-copy {
|
||||||
|
align-items: center;
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column nowrap;
|
||||||
|
p {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
.status-metadata {
|
||||||
|
font-family: var(--meta-font-family);
|
||||||
|
font-size: var(--meta-font-size);
|
||||||
|
font-style: var(--meta-font-style);
|
||||||
|
font-variation-settings: var(--meta-font-variation-settings);
|
||||||
|
line-height: calc(var(--meta-font-size) * 0.5 + var(--meta-font-size));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.postlist-item-container {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column nowrap;
|
||||||
|
gap: var(--space-s);
|
||||||
|
}
|
||||||
46
public/css/navigator.css
Normal file
46
public/css/navigator.css
Normal file
@@ -0,0 +1,46 @@
|
|||||||
|
.navigator {
|
||||||
|
display: grid;
|
||||||
|
gap: var(--space-2xs) var(--space-2xs);
|
||||||
|
grid-template-columns: repeat(auto-fill, minmax(var(--space-6xl), 1fr));
|
||||||
|
width: 100%;
|
||||||
|
.navigatorItem {
|
||||||
|
background-color: var(--background-color);
|
||||||
|
border: 1.5px solid var(--color-gray-20);
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
color: var(--text-color);
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column wrap;
|
||||||
|
height: var(--space-3xl);
|
||||||
|
text-align: center;
|
||||||
|
a {
|
||||||
|
height: 100%;
|
||||||
|
padding: var(--space-s) var(--space-xs);
|
||||||
|
text-decoration: none;
|
||||||
|
width: 100%;
|
||||||
|
img {
|
||||||
|
aspect-ratio: 1 / 1;
|
||||||
|
filter: var(--logo-filter);
|
||||||
|
width: var(--space-m);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
background-color: var(--text-color);
|
||||||
|
border: 1.25px solid var(--text-color);
|
||||||
|
transition: var(--transition-normal);
|
||||||
|
a {
|
||||||
|
color: var(--background-color);
|
||||||
|
transition: var(--transition-normal);
|
||||||
|
img {
|
||||||
|
filter: none;
|
||||||
|
transition: var(--transition-normal);
|
||||||
|
}
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
img {
|
||||||
|
filter: brightness(0) saturate(100%) invert(16%) sepia(0%)
|
||||||
|
saturate(1024%) hue-rotate(177deg) brightness(99%) contrast(88%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
91
public/css/post-list.css
Normal file
91
public/css/post-list.css
Normal file
@@ -0,0 +1,91 @@
|
|||||||
|
/* Posts list */
|
||||||
|
.postlist,
|
||||||
|
.links-nextprev {
|
||||||
|
container: postlist / inline-size;
|
||||||
|
}
|
||||||
|
.postlist-item {
|
||||||
|
align-items: flex-start;
|
||||||
|
display: flex;
|
||||||
|
flex-flow: row nowrap;
|
||||||
|
justify-content: flex-start;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.postlist-item-container {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column nowrap;
|
||||||
|
gap: var(--space-s);
|
||||||
|
}
|
||||||
|
.post-image {
|
||||||
|
width: var(--space-4xl);
|
||||||
|
height: var(--space-4xl);
|
||||||
|
object-fit: cover;
|
||||||
|
object-position: 50% 50%;
|
||||||
|
}
|
||||||
|
.post-image-container {
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
box-shadow: var(--box-shadow);
|
||||||
|
height: var(--space-4xl);
|
||||||
|
max-height: var(--space-4xl);
|
||||||
|
overflow: hidden;
|
||||||
|
width: var(--space-4xl);
|
||||||
|
}
|
||||||
|
|
||||||
|
.postlist-date,
|
||||||
|
.postlist-item:before {
|
||||||
|
color: var(--color-gray-90);
|
||||||
|
font-size: var(--meta-font-size);
|
||||||
|
}
|
||||||
|
.postlist-date {
|
||||||
|
word-spacing: -0.5px;
|
||||||
|
}
|
||||||
|
.postlist-link {
|
||||||
|
font-size: var(--step-5);
|
||||||
|
padding-right: 0.5em;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.postlist-link p {
|
||||||
|
background-color: var(--color-gray-90);
|
||||||
|
border-radius: 100px;
|
||||||
|
color: var(--background-color);
|
||||||
|
font-family: var(--font-family-ui);
|
||||||
|
font-size: var(--step--2);
|
||||||
|
font-variation-settings: var(--font-variation-ui);
|
||||||
|
letter-spacing: var(--ui-letter-spacing);
|
||||||
|
margin-top: calc(var(--space-3xs) * -1);
|
||||||
|
padding-left: var(--space-xs);
|
||||||
|
padding-right: var(--space-xs);
|
||||||
|
text-transform: uppercase;
|
||||||
|
width: max-content;
|
||||||
|
}
|
||||||
|
.post-copy {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
@container postlist (max-width: 500px) {
|
||||||
|
.postlist-item {
|
||||||
|
flex-flow: column wrap;
|
||||||
|
}
|
||||||
|
.post-image-container {
|
||||||
|
margin-left: 0;
|
||||||
|
min-height: var(--space-10xl);
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.post-image-container img.post-image {
|
||||||
|
width: 100cqw;
|
||||||
|
height: var(--space-10xl);
|
||||||
|
}
|
||||||
|
.postlist-link {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.postlist-link h3 {
|
||||||
|
padding-top: var(--space-m);
|
||||||
|
}
|
||||||
|
.postlist-link p {
|
||||||
|
margin-top: var(--space-xs);
|
||||||
|
}
|
||||||
|
.post-metadata {
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
6
public/css/profile-pic.css
Normal file
6
public/css/profile-pic.css
Normal file
@@ -0,0 +1,6 @@
|
|||||||
|
.profilePic:not(.links-container > img.profilePic) {
|
||||||
|
border-radius: 100%;
|
||||||
|
height: var(--space-xl);
|
||||||
|
margin-right: var(--space-s);
|
||||||
|
width: var(--space-xl);
|
||||||
|
}
|
||||||
86
public/css/quiz.css
Normal file
86
public/css/quiz.css
Normal file
@@ -0,0 +1,86 @@
|
|||||||
|
.answerBox {
|
||||||
|
margin-bottom: var(--space-3xs);
|
||||||
|
& > label {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.answersBox > input {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
details:not(.toc) {
|
||||||
|
background-color: var(--card-color);
|
||||||
|
border: var(--border-details);
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
color: var(--text-color);
|
||||||
|
margin-top: var(--space-s);
|
||||||
|
padding: var(--space-xs);
|
||||||
|
width: 100%;
|
||||||
|
font-size: var(--step--2);
|
||||||
|
font-variation-settings: var(--font-variation-ui);
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: var(--ui-letter-spacing);
|
||||||
|
font-family: var(--font-family-ui);
|
||||||
|
|
||||||
|
::marker {
|
||||||
|
content: "+ ";
|
||||||
|
}
|
||||||
|
&[open] p {
|
||||||
|
font-size: var(--step--2);
|
||||||
|
line-height: calc(var(--step--2) * 0.25 + var(--step--2));
|
||||||
|
}
|
||||||
|
&[open] summary::marker {
|
||||||
|
content: "- ";
|
||||||
|
}
|
||||||
|
&[open] summary {
|
||||||
|
border-bottom: var(--border-details);
|
||||||
|
margin-bottom: var(--space-xs);
|
||||||
|
padding-bottom: var(--space-xs);
|
||||||
|
}
|
||||||
|
summary {
|
||||||
|
font-size: var(--step--2);
|
||||||
|
font-variation-settings: var(--font-variation-ui);
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: var(--ui-letter-spacing);
|
||||||
|
font-family: var(--font-family-ui);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
dialog {
|
||||||
|
background-color: var(--card-color);
|
||||||
|
border: none;
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
box-shadow: var(--box-shadow);
|
||||||
|
width: var(--grid-max-width);
|
||||||
|
h2 {
|
||||||
|
padding-top: 0;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
color: var(--text-color);
|
||||||
|
}
|
||||||
|
&::backdrop {
|
||||||
|
background-color: var(--contrast-color);
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
img {
|
||||||
|
max-width: 100%;
|
||||||
|
padding-top: var(--space-s);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
input.answer {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
.questionBox {
|
||||||
|
margin: var(--space-s) 0;
|
||||||
|
figure {
|
||||||
|
padding-top: 0;
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.quizQuestion {
|
||||||
|
font-size: var(--step-2);
|
||||||
|
font-variation-settings:
|
||||||
|
"opsz" 50,
|
||||||
|
"wght" 350,
|
||||||
|
"SOFT" 20,
|
||||||
|
"WONK" 1;
|
||||||
|
line-height: calc(var(--step-2) * 0.25 + var(--step-2));
|
||||||
|
}
|
||||||
45
public/css/tags.css
Normal file
45
public/css/tags.css
Normal file
@@ -0,0 +1,45 @@
|
|||||||
|
a.post-tag {
|
||||||
|
background-color: var(--color-gray-20);
|
||||||
|
border-radius: 1rem;
|
||||||
|
color: var(--text-color);
|
||||||
|
font-family: var(--meta-font-family);
|
||||||
|
font-variation-settings: "wght" 300;
|
||||||
|
margin-top: var(--space-3xs);
|
||||||
|
margin-right: var(--space-3xs);
|
||||||
|
padding: 0 var(--space-3xs);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
a.post-tag:before {
|
||||||
|
content: "#";
|
||||||
|
}
|
||||||
|
a.post-tag:visited {
|
||||||
|
color: var(--text-color);
|
||||||
|
}
|
||||||
|
a.post-tag:hover {
|
||||||
|
color: var(--text-color);
|
||||||
|
}
|
||||||
|
.tag-feed-icon {
|
||||||
|
fill: var(--rss-orange);
|
||||||
|
height: var(--space-m);
|
||||||
|
transition: var(--transition-normal);
|
||||||
|
width: var(--space-m);
|
||||||
|
&.small {
|
||||||
|
height: var(--space-s);
|
||||||
|
width: var(--space-s);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.taglist {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: row wrap;
|
||||||
|
list-style-type: none;
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
.taglist li a {
|
||||||
|
display: inline-block;
|
||||||
|
font-size: var(--step--1);
|
||||||
|
margin: 0 var(--space-2xs) var(--space-2xs) 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.postlist-item > .post-tag {
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
6
public/css/toc.css
Normal file
6
public/css/toc.css
Normal file
@@ -0,0 +1,6 @@
|
|||||||
|
.toc {
|
||||||
|
& ol {
|
||||||
|
margin-top: 0;
|
||||||
|
padding-left: var(--space-m);
|
||||||
|
}
|
||||||
|
}
|
||||||
108
public/css/weather.css
Normal file
108
public/css/weather.css
Normal file
@@ -0,0 +1,108 @@
|
|||||||
|
.fallingObject {
|
||||||
|
color: #fff;
|
||||||
|
font-size: 1em;
|
||||||
|
font-family: Arial;
|
||||||
|
pointer-events: none;
|
||||||
|
text-shadow: 0 0 1px #000;
|
||||||
|
}
|
||||||
|
@keyframes fallingObjects-fall {
|
||||||
|
0% {
|
||||||
|
top: -10%;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
top: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes fallingObjects-shake {
|
||||||
|
0% {
|
||||||
|
transform: translateX(0px);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
transform: translateX(80px);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: translateX(0px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fallingObject {
|
||||||
|
position: fixed;
|
||||||
|
top: -10%;
|
||||||
|
z-index: 9999;
|
||||||
|
user-select: none;
|
||||||
|
cursor: default;
|
||||||
|
animation-name: fallingObjects-fall, fallingObjects-shake;
|
||||||
|
animation-duration: 10s, 3s;
|
||||||
|
animation-timing-function: linear, ease-in-out;
|
||||||
|
animation-iteration-count: infinite, infinite;
|
||||||
|
animation-play-state: running, running;
|
||||||
|
}
|
||||||
|
.fallingObject:nth-of-type(0) {
|
||||||
|
left: 1%;
|
||||||
|
animation-delay: 0s, 0s;
|
||||||
|
& > div {
|
||||||
|
transform: rotate(45deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fallingObject:nth-of-type(1) {
|
||||||
|
left: 10%;
|
||||||
|
animation-delay: 1s, 1s;
|
||||||
|
& > div {
|
||||||
|
transform: rotate(10deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fallingObject:nth-of-type(2) {
|
||||||
|
left: 20%;
|
||||||
|
animation-delay: 6s, 0.5s;
|
||||||
|
& > div {
|
||||||
|
transform: rotate(60deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fallingObject:nth-of-type(3) {
|
||||||
|
left: 30%;
|
||||||
|
animation-delay: 4s, 2s;
|
||||||
|
& > div {
|
||||||
|
transform: rotate(84deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fallingObject:nth-of-type(4) {
|
||||||
|
left: 40%;
|
||||||
|
animation-delay: 2s, 2s;
|
||||||
|
& > div {
|
||||||
|
transform: rotate(267deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fallingObject:nth-of-type(5) {
|
||||||
|
left: 50%;
|
||||||
|
animation-delay: 8s, 3s;
|
||||||
|
& > div {
|
||||||
|
transform: rotate(200deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fallingObject:nth-of-type(6) {
|
||||||
|
left: 60%;
|
||||||
|
animation-delay: 6s, 2s;
|
||||||
|
& > div {
|
||||||
|
transform: rotate(20deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fallingObject:nth-of-type(7) {
|
||||||
|
left: 70%;
|
||||||
|
animation-delay: 2.5s, 1s;
|
||||||
|
& > div {
|
||||||
|
transform: rotate(78deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fallingObject:nth-of-type(8) {
|
||||||
|
left: 80%;
|
||||||
|
animation-delay: 1s, 0s;
|
||||||
|
& > div {
|
||||||
|
transform: rotate(3120deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fallingObject:nth-of-type(9) {
|
||||||
|
left: 90%;
|
||||||
|
animation-delay: 3s, 1.5s;
|
||||||
|
& > div {
|
||||||
|
transform: rotate(123deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
12
public/css/woo-mode.css
Normal file
12
public/css/woo-mode.css
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
body {
|
||||||
|
background: none;
|
||||||
|
}
|
||||||
|
canvas {
|
||||||
|
display: block;
|
||||||
|
opacity: 0.35;
|
||||||
|
pointer-events: none;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
@@ -1,5 +0,0 @@
|
|||||||
import "./webComponents/card.js";
|
|
||||||
import "./webComponents/profilePic.js";
|
|
||||||
import "./webComponents/comment.js";
|
|
||||||
import "./webComponents/toot.js";
|
|
||||||
import "./webComponents/musicPlayer.js";
|
|
||||||
Reference in New Issue
Block a user