[feature/frontend] Reports frontend v2 (#3022)

* use apiutil + paging in admin processor+handlers

* we're making it happen

* fix little whoopsie

* styling for report list

* don't youuuu forget about meee don't don't don't don't

* last bits

* sanitize content before showing in report statuses

* update report docs
This commit is contained in:
tobi 2024-06-18 18:18:00 +02:00 committed by GitHub
commit d2b3d37724
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
56 changed files with 1389 additions and 726 deletions

View file

@ -1045,62 +1045,62 @@ button.with-padding {
}
}
.reports {
p {
margin: 0;
}
.reports-view {
.report {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
gap: 0.5rem;
margin: 0.5rem 0;
text-decoration: none;
color: $fg;
padding: 1rem;
border: none;
border-left: 0.3rem solid $border-accent;
.usernames {
line-height: 2rem;
}
.username-lozenge {
display: flex;
flex-wrap: nowrap;
height: 100%;
align-items: center;
padding-top: 0;
padding-bottom: 0;
.byline {
display: grid;
grid-template-columns: 1fr auto;
gap: 0.5rem;
.report-status {
color: $border-accent;
.fa {
flex-shrink: 0;
}
}
.details {
display: grid;
grid-template-columns: auto 1fr;
gap: 0.2rem 0.5rem;
padding: 0.5rem;
justify-items: start;
.report-byline {
max-width: fit-content;
}
h3 {
margin: 0;
.info-list {
border: none;
.info-list-entry {
background: none;
padding: 0;
.report-target .username-lozenge {
color: $bg;
}
.reported-by .username-lozenge {
color: $fg;
font-weight: initial;
border-radius: 0;
background: none;
}
}
}
&.resolved {
color: $fg-reduced;
border-left: 0.4rem solid $bg;
border-left: 0.3rem solid $list-entry-bg;
.byline .report-status {
.info-list,
.info-list .info-list-entry .reported-by .username-lozenge {
color: $fg-reduced;
}
.user {
opacity: 0.8;
&:hover {
border-color: $fg-accent;
}
}
@ -1109,70 +1109,40 @@ button.with-padding {
padding: 0;
}
}
}
.report.detail {
display: flex;
flex-direction: column;
margin-top: 1rem;
gap: 1rem;
.info-block {
padding: 0.5rem;
background: $gray2;
.report-detail {
.info-list {
&.overview {
margin-top: 1rem;
}
.info {
display: block;
}
.username-lozenge {
display: flex;
flex-wrap: nowrap;
height: 100%;
align-items: center;
padding-top: 0;
padding-bottom: 0;
max-width: fit-content;
.reported-toots {
margin-top: 0.5rem;
}
.toot .toot-info {
padding: 0.5rem;
background: $toot-info-bg;
a {
color: $fg-reduced;
}
&:last-child {
border-bottom-left-radius: $br;
border-bottom-right-radius: $br;
.fa {
flex-shrink: 0;
}
}
}
}
.username-lozenge {
line-height: 1.3rem;
display: inline-block;
background: $fg-accent;
color: $bg;
border-radius: $br;
padding: 0.15rem;
font-weight: bold;
text-decoration: none;
.acct {
word-break: break-all;
.report-statuses {
width: min(100%, 50rem);
.thread {
display: flex;
flex-direction: column;
gap: 2rem;
padding: 0;
}
}
&.suspended {
background: $bg-accent;
color: $fg;
text-decoration: line-through;
}
&.local {
background: $green1;
}
}
.spanlink {
cursor: pointer;
text-decoration: none;
}
.accounts-view {
@ -1223,6 +1193,36 @@ button.with-padding {
}
}
.username-lozenge {
line-height: 1.3rem;
display: inline-block;
background: $fg-accent;
color: $bg;
border-radius: $br;
padding: 0.15rem;
font-weight: bold;
text-decoration: none;
.acct {
word-break: break-all;
}
&.suspended {
background: $bg-accent;
color: $fg;
text-decoration: line-through;
}
&.local {
background: $green1;
}
}
.pseudolink {
cursor: pointer;
text-decoration: none;
}
.info-list {
border: 0.1rem solid $gray1;
display: flex;