[chore] Fix report username wrapping (#1464)

* fix report username wrapping

* move report status to separate line on portrait orientation
This commit is contained in:
f0x52 2023-02-09 09:26:35 +01:00 committed by GitHub
commit 65b19411a4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 26 additions and 5 deletions

View file

@ -828,9 +828,14 @@ button.with-padding {
border: none;
border-left: 0.3rem solid $border-accent;
.usernames {
line-height: 2rem;
}
.byline {
display: grid;
grid-template-columns: 1fr auto;
gap: 0.5rem;
.status {
color: $border-accent;
@ -904,14 +909,20 @@ button.with-padding {
}
.user {
line-height: 1.3rem;
display: inline-block;
background: $fg-accent;
color: $bg;
border-radius: $br;
padding: 0.1rem 0.2rem;
padding: 0.15rem 0.15rem;
margin: 0 0.1rem;
font-weight: bold;
text-decoration: none;
.acct {
word-break: break-all;
}
&.suspended {
background: $bg-accent;
color: $fg;
@ -924,6 +935,16 @@ button.with-padding {
}
}
@media screen and (orientation: portrait) {
.reports .report .byline {
grid-template-columns: 1fr;
.status {
grid-row: 1;
}
}
}
[role="button"] {
cursor: pointer;
}