diff options
Diffstat (limited to 'web/source/css')
-rw-r--r-- | web/source/css/status.css | 141 |
1 files changed, 71 insertions, 70 deletions
diff --git a/web/source/css/status.css b/web/source/css/status.css index 49ae63641..d2aa658f1 100644 --- a/web/source/css/status.css +++ b/web/source/css/status.css @@ -113,10 +113,17 @@ main { gap: 0.5rem; } - details > summary { + .text-spoiler > summary, .text { + position: relative; + z-index: 2; + } + + .text-spoiler > summary { display: inline-block; list-style: none; + padding-bottom: 0.5rem; + &::-webkit-details-marker { display: none; /* Safari */ } @@ -124,6 +131,8 @@ main { .button { white-space: nowrap; cursor: pointer; + padding: 0.2rem 0.3rem; + font-size: 1rem; } } @@ -132,20 +141,12 @@ main { grid-row: span 1; grid-column: 1 / span 3; - position: relative; - z-index: 2; + display: flex; + flex-direction: column; + gap: 0.5rem; width: 100%; - details > summary { - padding-bottom: 0.5rem; - - .button { - padding: 0.2rem 0.3rem; - font-size: 1rem; - } - } - a { color: $link-fg; text-decoration: underline; @@ -239,6 +240,64 @@ main { border: $boxshadow-border; border-radius: $br-inner; } + + .poll { + background-color: $gray2; + z-index: 2; + + display: flex; + flex-direction: column; + border-radius: $br; + padding: 0.5rem; + margin: 0; + gap: 1rem; + + .poll-options { + margin: 0; + padding: 0; + display: flex; + flex-direction: column; + gap: 1rem; + + .poll-option { + display: flex; + flex-direction: column; + gap: 0.1rem; + + label { + cursor: default; + } + + meter { + width: 100%; + } + + .poll-vote-summary { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + white-space: nowrap; + } + } + } + + .poll-info { + background-color: $gray4; + display: flex; + flex-wrap: wrap; + justify-content: space-between; + border-radius: $br-inner; + padding: 0.25rem; + gap: 0.25rem; + + span { + justify-self: center; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + } + } } .media { @@ -391,64 +450,6 @@ main { } } - .poll { - background-color: $gray2; - z-index: 2; - - display: flex; - flex-direction: column; - border-radius: $br; - padding: 0.5rem; - margin: 0; - gap: 1rem; - - .poll-options { - margin: 0; - padding: 0; - display: flex; - flex-direction: column; - gap: 1rem; - - .poll-option { - display: flex; - flex-direction: column; - gap: 0.1rem; - - label { - cursor: default; - } - - meter { - width: 100%; - } - - .poll-vote-summary { - display: flex; - flex-wrap: wrap; - justify-content: space-between; - white-space: nowrap; - } - } - } - - .poll-info { - background-color: $gray4; - display: flex; - flex-wrap: wrap; - justify-content: space-between; - border-radius: $br-inner; - padding: 0.25rem; - gap: 0.25rem; - - span { - justify-self: center; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } - } - } - .info { display: flex; background: $toot-info-bg; |