Allow setting spoiler styles via image URL
This commit is contained in:
@ -613,6 +613,8 @@ When set on an image:
|
||||
|
||||
<img class="spoiler" src="https://i1.theportalwiki.net/img/2/23/Ashpd_blueprint.jpg" />
|
||||
|
||||
URL anchor `#spoiler` can be used for this as well.
|
||||
|
||||
With `solid` class:
|
||||
|
||||
```html
|
||||
@ -621,6 +623,8 @@ With `solid` class:
|
||||
|
||||
<img class="spoiler solid" src="https://i1.theportalwiki.net/img/2/23/Ashpd_blueprint.jpg" />
|
||||
|
||||
URL anchor `#solid` can be used for this as well.
|
||||
|
||||
### Buttons Dialog
|
||||
|
||||
```html.j2
|
||||
|
@ -1,4 +1,4 @@
|
||||
.spoiler {
|
||||
span.spoiler {
|
||||
filter: blur(0.25rem);
|
||||
transition: var(--transition);
|
||||
|
||||
@ -21,11 +21,11 @@
|
||||
}
|
||||
}
|
||||
|
||||
img.spoiler {
|
||||
img.spoiler,
|
||||
img[src*="#spoiler"] {
|
||||
opacity: var(--disabled);
|
||||
clip-path: inset(0% 0% 0% 0% round var(--rounded-corner));
|
||||
filter: blur(1rem);
|
||||
transition: var(--transition-longer);
|
||||
|
||||
&:hover,
|
||||
&:active {
|
||||
@ -34,11 +34,11 @@ img.spoiler {
|
||||
filter: none;
|
||||
}
|
||||
|
||||
&.solid {
|
||||
&.solid,
|
||||
&[src*="#solid"] {
|
||||
clip-path: none;
|
||||
filter: brightness(0%);
|
||||
box-shadow: none;
|
||||
border-radius: var(--rounded-corner);
|
||||
|
||||
&:hover,
|
||||
&:active {
|
||||
|
Reference in New Issue
Block a user