Add custom spoiler component

This commit is contained in:
jeffvli
2024-02-02 01:38:58 -08:00
parent 7c25d12639
commit 095edfd49f
4 changed files with 78 additions and 37 deletions
@@ -1,9 +1,31 @@
.control {
color: var(--btn-subtle-fg);
font-weight: 600;
}
.control:hover {
color: var(--btn-subtle-fg-hover);
text-decoration: none;
}
.spoiler {
position: relative;
text-align: justify;
width: 100%;
height: 100%;
overflow: hidden;
}
.spoiler:not(.is-expanded).can-expand:after {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
content: '';
background: linear-gradient(to top, var(--main-bg) 10%, transparent 60%);
pointer-events: none;
}
.spoiler.can-expand {
cursor: pointer;
}
.spoiler.is-expanded {
max-height: 2500px !important;
}