[feature/frogend] (Mastodon) domain block CSV import (#1390)

* checkbox-list styling with taller <p> element

* CSV import/export, UI/UX improvements to import-export interface

* minor styling tweaks

* csv export, clean up export type branching

* abstract domain block entry validation

* foundation for PSL check + suggestions

* Squashed commit of the following:

commit e3655ba4fb
Author: f0x <f0x@cthu.lu>
Date:   Tue Jan 31 15:19:10 2023 +0100

    let debug depend on env (prod/debug) again

commit 79c792b832
Author: f0x <f0x@cthu.lu>
Date:   Tue Jan 31 00:34:01 2023 +0100

    update checklist components

commit 4367960fe4
Author: f0x <f0x@cthu.lu>
Date:   Mon Jan 30 23:46:20 2023 +0100

    checklist performance improvements

commit 204a4c02d1
Author: f0x <f0x@cthu.lu>
Date:   Mon Jan 30 20:05:34 2023 +0100

    checklist field: use reducer for state

* remove debug logging

* show and use domain block suggestion

* restructure import/export buttons

* updating suggestions

* suggestion overview

* restructure check-list behavior, domain import/export
This commit is contained in:
f0x52 2023-02-03 12:07:40 +01:00 committed by GitHub
commit a59dc855d9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
17 changed files with 1077 additions and 484 deletions

View file

@ -69,6 +69,10 @@ section {
&:last-child {
margin-bottom: 0;
}
&.without-border {
border-left: 0;
}
}
}
@ -370,7 +374,8 @@ span.form-info {
.checkbox-list {
.header, .entry {
gap: 1rem;
display: grid;
gap: 0 1rem;
}
}
@ -629,7 +634,6 @@ span.form-info {
.checkbox-list {
.entry {
display: grid;
grid-template-columns: auto auto 1fr;
}
@ -688,9 +692,14 @@ button.with-padding {
.suspend-import-list {
.checkbox-list {
.header, .entry {
display: grid;
.entry {
grid-template-columns: auto 25ch auto 1fr;
grid-template-rows: auto 1fr;
p {
grid-column: 4;
grid-row: 1 / span 2;
}
}
}
@ -704,6 +713,10 @@ button.with-padding {
color: $green1;
}
#icon .suggest-changes {
color: $orange2;
}
p {
align-self: center;
margin: 0;
@ -711,6 +724,75 @@ button.with-padding {
}
}
.import-export {
p {
margin: 0;
}
.export-file {
display: flex;
gap: 0.7rem;
align-items: center;
}
.button-grid {
display: inline-grid;
grid-template-columns: auto auto auto;
align-self: start;
gap: 0.5rem;
button {
width: 100%;
}
}
}
.update-hints {
background: $list-entry-alternate-bg;
border: 0.1rem solid $border-accent;
/* border-radius: $br; */
padding: 0.5rem;
display: flex;
flex-direction: column;
.hints {
max-width: 100%;
align-self: start;
align-items: center;
margin: 1rem 0;
display: inline-grid;
grid-template-columns: auto auto auto auto;
gap: 1rem;
}
}
.export-format-table {
width: 100%;
background: $list-entry-alternate-bg;
border-collapse: collapse;
th, td {
border: 0.1rem solid $gray1;
padding: 0.3rem;
}
th {
background: $list-entry-bg;
}
td {
text-align: center;
.fa-check {
color: $green1;
}
.fa-times {
color: $error3;
}
}
}
.form-field.radio {
&, label {
display: flex;
@ -723,6 +805,10 @@ button.with-padding {
}
}
[role="button"] {
cursor: pointer;
}
@keyframes fadeout {
from {
opacity: 1;