From fe238f85954f6644836c8b407d197e146e82f407 Mon Sep 17 00:00:00 2001 From: f0x52 Date: Mon, 3 Oct 2022 18:26:41 +0200 Subject: [PATCH] [frontend] change spacing of status, text always on it's own line, move status date on mobile (#883) --- web/source/css/status.css | 30 ++++++++++++++++++++---------- 1 file changed, 20 insertions(+), 10 deletions(-) diff --git a/web/source/css/status.css b/web/source/css/status.css index b4c62d65f..fbb323b29 100644 --- a/web/source/css/status.css +++ b/web/source/css/status.css @@ -84,18 +84,19 @@ main { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; - - /* margin-top: -0.5rem; */ - line-height: 2rem; } .displayname { font-weight: bold; - font-size: 1.2rem; + font-size: 1.5rem; + line-height: 2rem; + margin-top: -0.5rem; } .username { color: $link-fg; + font-size: 1rem; + line-height: 1.3rem; } input.spoiler:checked ~ .content { @@ -125,8 +126,9 @@ main { .text { margin: 0; - grid-column: 2 / span 2; + padding-top: 0.5rem; grid-row: span 1; + grid-column: 1 / span 3; position: relative; z-index: 2; @@ -370,11 +372,6 @@ main { grid-column: span 2; } - .text { - grid-column: 1 / span 3; - padding-top: 0.5rem; - } - .not-expanded { display: none; } @@ -392,4 +389,17 @@ main { footer + div { /* something weird from the devstack.. */ display: none; +} + +@media screen and (max-width: 89ch) { + .toot { + .contentgrid { + grid-template-rows: 1.5rem 1.3rem 1.3rem auto; + } + + .username, .not-expanded { + grid-column: 2; + grid-row: auto; + } + } } \ No newline at end of file