diff options
Diffstat (limited to 'web')
| -rw-r--r-- | web/source/css/status.css | 15 | ||||
| -rw-r--r-- | web/template/status.tmpl | 3 |
2 files changed, 14 insertions, 4 deletions
diff --git a/web/source/css/status.css b/web/source/css/status.css index db56b7a50..3f4b08edf 100644 --- a/web/source/css/status.css +++ b/web/source/css/status.css @@ -87,11 +87,17 @@ main { } .spoiler { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 0.4rem; + + .spoiler-text { + word-break: break-word; + } + label { padding: 0.2rem 0.3rem; - margin-left: 0.4rem; - position: relative; - z-index: 2; cursor: pointer; font-size: 1rem; } @@ -104,6 +110,9 @@ main { margin-top: 0.5rem; grid-column: span 2; + position: relative; + z-index: 2; + a { color: $link_fg; text-decoration: underline; diff --git a/web/template/status.tmpl b/web/template/status.tmpl index a6dcc30f8..f03fdbef6 100644 --- a/web/template/status.tmpl +++ b/web/template/status.tmpl @@ -6,7 +6,8 @@ {{if .SpoilerText}} <input class="spoiler" id="hideSpoiler-{{.ID}}" type="checkbox" style="display: none" aria-hidden="true" checked="true" /> <div class="spoiler"> - <span>{{.SpoilerText}}</span><label class="button spoiler-label" for="hideSpoiler-{{.ID}}">Toggle visibility</label> + <span class="spoiler-text">{{.SpoilerText}}</span> + <label class="button spoiler-label" for="hideSpoiler-{{.ID}}">Toggle visibility</label> </div> {{end}} <div class="content"> |