25 lines
2 KiB
HTML
25 lines
2 KiB
HTML
|
<div style="display: flex; width: 100%; align-items: center; justify-content: center; margin: 2rem 0">
|
||
|
|
<div style="outline: 2px solid black; flex: 2; aspect-ratio: 16/9; transform: perspective(500px) rotateY(20deg) skewY(-10deg) scale(0.8);">
|
||
|
|
<details>
|
||
|
|
<summary style="list-style: none; padding: 0.25rem">
|
||
|
|
<div style="display: flex; flex-direction: column; align-items: center; gap: 0.75rem; margin: 0.75rem;">
|
||
|
|
<div style="background-color: rgb(var(--color-notWhite)); border: 1px solid rgb(var(--color-cherry)); border-radius: 0.5rem; box-sizing: border-box; padding: 0.75rem; gap: 0.75rem; align-self: stretch; display: flex; flex-direction: row; align-items: center;">
|
||
|
|
<img src="https://static.pyrope.net/warning-shield.png" aria-hidden="true" style="margin: 0; display: block">
|
||
|
|
<p style="color: rgb(var(--color-cherry)); margin: 0; line-height: 24px">This post has content warnings for: <b>major spoilers for things. very major. i mean it!</b></p>
|
||
|
|
</div>
|
||
|
|
<div style="cursor: pointer; background-color: rgb(var(--color-cherry)); border-radius: 0.5rem; color: rgb(var(--color-notWhite)); padding: 0.75rem; line-height: 1; letter-spacing: 0.05em; whitespace: nowrap;">
|
||
|
|
show post
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</summary>
|
||
|
|
<div style="position: absolute; inset: 0; background-color: white; overflow-y: auto">
|
||
|
|
<p style="text-align: center; color: black">these guys die :(</p>
|
||
|
|
<img src="https://static.wikia.nocookie.net/seuss/images/d/d3/Thing1-and-thing2.jpg" alt="things 1 and 2 from dr. seuss" style="width: 100%">
|
||
|
|
<a style="width: fit-content; margin: 0 auto; display: block; color: #ccc" href="https://pyrope.net/randirect#cohost.org/mehbark/post/2555916-cursor-adventure-so::pyrope.net/mcai::irc.pyrope.net::413.gay::pyrope.net/tnb::pyrope.net/concat::pyrope.net/davehash::twitter.com/mehbark::pl.pyrope.net/terezi">random fun 4 u</a>
|
||
|
|
<p style="color: #eee; text-align: center;">yes i flipped it</p>
|
||
|
|
</div>
|
||
|
|
</details>
|
||
|
|
</div>
|
||
|
|
<div style="flex: 1.2"><h1 style="text-align: center; font-size: 3rem">👀</h1> <p style="text-align: center">i should click on this and open it</p></div>
|
||
|
|
</div>
|