i can't go to hell - i'm all out of vacation days. i watch space rocks and yell at computers for my day job. probably too old for any of this

 

i think i might be burned out on internet social. it's hard to keep doing it. it's hard to even maintain the amount of attention i'm already giving it

 

i am the cause of most of my own problems

 

furthermore, capitalism must be destroyed

 

birdsona: ?????

 

🌎 Ontario, Canada


webbed site
egrets.ca/

yaodema
@yaodema

what's the standard way people are doing CSS collapsible text or spoiler-covered clickable text on here? I have a thought about a long-post where I'd have to warn for spoilers about a book, and it's too long to just use the "read more" option here.


SomeEgrets
@SomeEgrets

ive been basically doing three modes depending on how I want the content™ obscured... only the third one is probably what you're asking for but hey, an excuse to overthink shit!

The short version is, depending on context, and in order of complexity:

  1. just using the CW button
  2. placing behind a manually placed cut
  3. using the HTML details tag (pretty simple HTML, no fancy CSS required)

Details behind the cut


use a CW

the first is just to use the CW thing if it's a thing that obviously requires it or if the entire post is just spoilers front to back, because it's simple and obvious and just works and is a pretty good fit for "you need to opt into seeing this entire post" ... and obviously this is the answer for topics which actually do require a real CW

use a cut

the second is to post something like a short general introduction "hook" to get people interested, a short description of what's behind the cut, and place a manual cut with --- so that section is opt-in. it's simple and can be done entirely in markdown

use the details tag

the third is the most flexible but requires a small bit of html - the details tag. It gives you a collapsed document block with a short summary that can be clicked to expand, and is useful when you want most of your post to be visible, with select sections collapsed because they contain spoilers, an excruciating level of specificity most people wouldn't care about, etc etc

click this to see bonus words

chirp

chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp chirp

chirp chirp chirp chirp chirp chirp chirp chirp

The entire code for this block is the following

<details>
<summary>click this to see bonus words</summary>

## chirp
chirp chirp chirp chirp chirp chirp chirp chirp
chirp chirp chirp chirp chirp chirp chirp chirp
chirp chirp chirp chirp chirp chirp chirp chirp
chirp chirp chirp chirp chirp chirp chirp chirp
chirp chirp chirp chirp chirp chirp chirp chirp
chirp chirp chirp chirp chirp chirp chirp chirp

*chirp chirp chirp chirp chirp chirp chirp chirp*
</details>

basically you just wrap the entire thing in <details> tags, write the short summary you want to appear in <summary> tags, and stick the rest in the details tag body

markdown even seems to work inside them, provided you leave a newline after the summary tags (otherwise the next line gets glued to the end of the summary tag like and markdown that has to go at the start of a line, like headings, won't work...)


You must log in to comment.
Pinned Tags