diff options
Diffstat (limited to 'served/bits')
-rwxr-xr-x | served/bits/__.html | 128 | ||||
-rwxr-xr-x[-rw-r--r--] | served/bits/bits.css | 0 | ||||
-rwxr-xr-x[-rw-r--r--] | served/bits/bits.html | 1 | ||||
-rwxr-xr-x[-rw-r--r--] | served/bits/poem.css | 0 | ||||
-rwxr-xr-x[-rw-r--r--] | served/bits/ramen-bowl.html | 0 | ||||
-rwxr-xr-x[-rw-r--r--] | served/bits/scrap/scrap.css | 0 | ||||
-rwxr-xr-x[-rw-r--r--] | served/bits/scrap/scrap.html | 0 | ||||
-rwxr-xr-x[-rw-r--r--] | served/bits/sillygifs/sillygifs.css | 0 | ||||
-rwxr-xr-x[-rw-r--r--] | served/bits/sillygifs/sillygifs.html | 0 | ||||
-rwxr-xr-x[-rw-r--r--] | served/bits/smoems.html | 0 | ||||
-rwxr-xr-x[-rw-r--r--] | served/bits/touching-grass/grass.vtt | 0 | ||||
-rwxr-xr-x[-rw-r--r--] | served/bits/touching-grass/touching-grass.css | 0 | ||||
-rwxr-xr-x[-rw-r--r--] | served/bits/touching-grass/touching-grass.html | 0 | ||||
-rwxr-xr-x | served/bits/🌦.css | 70 |
14 files changed, 199 insertions, 0 deletions
diff --git a/served/bits/__.html b/served/bits/__.html new file mode 100755 index 0000000..e7aff8a --- /dev/null +++ b/served/bits/__.html @@ -0,0 +1,128 @@ +--- +template=post +title=🌦️ +category=writing +#Publish 2023-08-05 02:57 -0500 +style=/styles/post.css +style=🌦.css + +description=briefly, on names. maybe. +--- + +<!-- https://www.scottohara.me/blog/2022/09/12/details-summary.html --> + +<h1 style="padding-left: 3rem; font-style: italic">on names, maybe</h1> + +<p> + i really like names. the things people call themselves. these-these wonderous + groups of syllables traded; swapped; created out of thin air, some thoughts, and a whole lot of self. +</p> +<p> + shorten them, lengthen them, throw the whole collection of letters away and start anew. + co-opt a word! move through and around and relax within. change them if you please! + regularly if you like. maybe even swap back, forth, and back again. +</p> + +<p> + here's a thing. posted originally + <a href="https://amble.quest/notice/ATaqGUcyaI6KOZjUJc" style="text-decoration: line-through;">here</a> + (dead link), but in a different form. i was playing a game once and saw them. we talked about their name, briefly, + for the five or so minutes we had. +</p> + +<p style="text-align: center"> + <i>click the coloured bits<br>to reveal more text</i> +</p> + +<details class="root arrow" style="min-height: 10rem"> + <summary>e.</summary> + <p style="display: block">i know i'm very strange; i get excited when people are nice and neat and cool and talk to + me when i play games such as these. your name is just very nice.</p> + <details class="more"> + <summary></summary> + <p>we all know i have a softspot for short-and-abstract and english-word names. yours happens to tickle me.</p> + <details class="more"> + <summary></summary> + <p>How short can a poem be? A sentence, a word, perhaps a letter? maybe it can be a carefully placed space, + floating there, meaning. we now know, though, that there's a two letter contender. it's <i>e.</i>, see. + </p> + <details class="more"> + <summary></summary> + <p>could it be euler's number? possibly! estrogen? could be! maybe even nothing. a letter most common. + everything. “anything”, you said, “eye of the beholder”.</p> + <details class="more"> + <summary></summary> + <p>i'm a lot, don't worry, i know. but your name, those two letters. they've taken me. <i>e.</i> you + asked me! “what does it mean to you”. well, for the time being, and likely a little more—until + this memory slips by lost to the hazy abyss of those forgotten—it means you.</p> + </details> + </details> + </details> + </details> +</details> + +<p style="font-style: italic;">(and something more personal in the same presentation style)</p> + +<details class="arrow" id="names-i-like" style="margin-top: 32px; margin-bottom: 32px"> + <summary>most people know me by a name that the government does not. not the one that was given to me. </summary> + <p>they call me genny, short for Genevieve.</p> + <details class="more"> + <summary></summary> + <p> + it was given to me, accidentally, by a now-good friend. genny first, + and then Genevieve. But it's not a given name. More offered and accepted. + I like it—that's why I use it!—but it's not perfect I don't + think. Not perfectly me I mean. + </p> + <details class="more"> + <summary></summary> + <p> + I have a brain-disconnect. Between my body and my mind. + And I like a lot of names, some maybe even more than genny, but I don't think I can wear + them. Not openly and feel good about it. Names like + </p> + <details class="arrow"> + <summary>Amelia</summary> + <details class="arrow"> + <summary style="padding-left: 12.5%">Medley</summary> + <details class="arrow" style="padding-left: 12.5%"> + <summary style="padding-left: 12.5%">Inann</summary> + <p> + Which sounds <i>beautiful</i> but I would be terrified to wear. What if someone saw me + wearing it? They'd say it's not mine. They'd know it's stolen. It can't possibly be mine. + How can a name such as that belong to someone that looks so + </p> + <details class="arrow"> + <summary style="padding-left: 12.5%; font-style: italic;">unfitting</summary> + <details class="arrow"> + <summary style="font-style: italic;">undeserving</summary> + <p style="display: block; margin-left: -13%; margin-top: 8px"> + someone so <i>me</i>. + </p> + </details> + </details> + </details> + </details> + </details> + </details> + </details> +</details> + +<h2>notes</h2> +<p id="notes" class="notes"> + this page was originally 🌦.html, but the links were showing up url encoded in discord + and elsewhere and, for some reason, firefox mobile was just <i>not rendering</i> + the sun-storm rain cloud. +</p> +<p class="notes"> + so now it's the double-underscore. which i think, "yeah, that might be better". if i go and + overanalyze it- <i>(well don't do do that)</i>. why not? anyway, if we analyze it maybe too + much we can say it's a metaphor for my lack of solid identity and desire to flip-flop + between names a lot. "fill in name here". <i>(that's dumb)</i>. hey, leave me alone, me. let + me have fun. +</p> +<p class="notes"> + i never do explain the emoji do i? i just like it. i use it in name fields a lot. the current + canon is that rain is my middle name. it's so unassuming, the sun-rain. there are no expectations. + just, maybe, that they're a little weird. or something. +</p> \ No newline at end of file diff --git a/served/bits/bits.css b/served/bits/bits.css index ee6c28c..ee6c28c 100644..100755 --- a/served/bits/bits.css +++ b/served/bits/bits.css diff --git a/served/bits/bits.html b/served/bits/bits.html index a7aa654..0e8f501 100644..100755 --- a/served/bits/bits.html +++ b/served/bits/bits.html @@ -11,6 +11,7 @@ style=bits.css </p> <ol class="list"> + <li><a href="__.html">__.html</a> — briefly, on names. maybe.</li> <li><a href="ramen-bowl.html">ramen-bowl.html</a> — a poem about my ramen noodel bowl</li> <li><a href="touching-grass/">touching-grass.html</a> — a short video with an exciteable description</li> <li><a href="smoems.html">smoems.html</a> — transplanted poems from twitter</li> diff --git a/served/bits/poem.css b/served/bits/poem.css index 9acade9..9acade9 100644..100755 --- a/served/bits/poem.css +++ b/served/bits/poem.css diff --git a/served/bits/ramen-bowl.html b/served/bits/ramen-bowl.html index 61d596b..61d596b 100644..100755 --- a/served/bits/ramen-bowl.html +++ b/served/bits/ramen-bowl.html diff --git a/served/bits/scrap/scrap.css b/served/bits/scrap/scrap.css index c863c7b..c863c7b 100644..100755 --- a/served/bits/scrap/scrap.css +++ b/served/bits/scrap/scrap.css diff --git a/served/bits/scrap/scrap.html b/served/bits/scrap/scrap.html index 0bf68ad..0bf68ad 100644..100755 --- a/served/bits/scrap/scrap.html +++ b/served/bits/scrap/scrap.html diff --git a/served/bits/sillygifs/sillygifs.css b/served/bits/sillygifs/sillygifs.css index 678e292..678e292 100644..100755 --- a/served/bits/sillygifs/sillygifs.css +++ b/served/bits/sillygifs/sillygifs.css diff --git a/served/bits/sillygifs/sillygifs.html b/served/bits/sillygifs/sillygifs.html index cdcf64b..cdcf64b 100644..100755 --- a/served/bits/sillygifs/sillygifs.html +++ b/served/bits/sillygifs/sillygifs.html diff --git a/served/bits/smoems.html b/served/bits/smoems.html index 7aec94e..7aec94e 100644..100755 --- a/served/bits/smoems.html +++ b/served/bits/smoems.html diff --git a/served/bits/touching-grass/grass.vtt b/served/bits/touching-grass/grass.vtt index c77f0c3..c77f0c3 100644..100755 --- a/served/bits/touching-grass/grass.vtt +++ b/served/bits/touching-grass/grass.vtt diff --git a/served/bits/touching-grass/touching-grass.css b/served/bits/touching-grass/touching-grass.css index 765d1ea..765d1ea 100644..100755 --- a/served/bits/touching-grass/touching-grass.css +++ b/served/bits/touching-grass/touching-grass.css diff --git a/served/bits/touching-grass/touching-grass.html b/served/bits/touching-grass/touching-grass.html index b5dcdea..b5dcdea 100644..100755 --- a/served/bits/touching-grass/touching-grass.html +++ b/served/bits/touching-grass/touching-grass.html diff --git a/served/bits/🌦.css b/served/bits/🌦.css new file mode 100755 index 0000000..882f4d7 --- /dev/null +++ b/served/bits/🌦.css @@ -0,0 +1,70 @@ +.root { + max-width: 27rem; + margin: 0 auto; +} + +/* narrow */ +@media (max-width: 44rem) { + .root { + max-width: 60vw; + margin: 0 auto; + } +} + +.root>h1 { + font-size: 1.25em; + padding: 8px; +} + +details.arrow:not([open])>summary::after { + content: '→'; + color: var(--color-a); + margin: 0 4px; +} + +details.arrow[open]>summary::after { + content: '–'; + color: var(--color-a-dim); + margin: 0 4px; +} + +details.more, +details.arrow { + margin-top: 8px; +} + +details.more>p, +details.arrow>p { + display: inline; +} + +details.more>summary, +details.arrow>summary { + display: inline; + list-style-type: none; +} + +details.more>summary::-webkit-details-marker, +details.arrow>summary::-webkit-details-marker { + display: none +} + +details.more:not([open])>summary::before { + content: '[+]'; + color: var(--color-a); +} + +details.more[open]>summary::before { + content: '[-]'; + margin: 0 2px; + color: var(--color-a-dim); +} + +h2 { + font-size: 1em; +} + +#notes, +.notes { + font-size: 0.75rem; +} \ No newline at end of file |