gb/mercury
Template
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Activity Actions

fix: spoiler now work in paragraph wrapped elements

Browse source
This commit is contained in:
grassblock 2025-05-17 18:11:54 +08:00
parent 98ee7a3527
commit 21025cab50
2 changed files with 16 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/components/shortcodes/Spoiler.astro
View file

@ -1,11 +1,21 @@
--- ---
const { tip = '' } = Astro.props const { tip = '' } = Astro.props
--- ---
{/* TODO: make it work in paragraph wrapped elements */}
<span class="spoiler" title={tip}> <span class="spoiler" title={tip}>
<slot/> <slot/>
</span> </span>
<style> <style>
:global(.spoiler p) {
background-color: #252525;
color: #252525;
transition: color 0.5s;
width: fit-content;
}
:global(.spoiler:hover p) {
color: #ffffff;
}
.spoiler { .spoiler {
background-color: #252525; background-color: #252525;
color: #252525; color: #252525;

5
src/content/pages/test.mdx
View file

@ -14,4 +14,9 @@ testestestest
~~This is the content of the spoiler.~~ ~~This is the content of the spoiler.~~
</Spoiler> </Spoiler>
<Spoiler tip="Spoiler Title">
~~This is the content of another spoiler.~~
</Spoiler>
<FediStatuses instanceDomain='portal.gb0.dev' userId='me' /> <FediStatuses instanceDomain='portal.gb0.dev' userId='me' />