[FrontEnd]: improved settings design

This commit is contained in:
Jesús 2021-12-26 12:27:24 -05:00
parent 0820909b7e
commit bcbd83fa30
No known key found for this signature in database
GPG Key ID: F6EE7BC59A315766
4 changed files with 10 additions and 3 deletions

View File

@ -2,13 +2,14 @@
--background: #212121; --background: #212121;
--text: #FFFFFF; --text: #FFFFFF;
--secondary-hover: #73828c; --secondary-hover: #73828c;
--secondary-focus: #606060; --secondary-focus: #303030;
--secondary-inverse: #FFF; --secondary-inverse: #FFF;
--primary-background: #757575; --primary-background: #242424;
--secondary-background: #424242; --secondary-background: #424242;
--thumb-background: #757575; --thumb-background: #757575;
--link: #00B0FF; --link: #00B0FF;
--link-visited: #40C4FF; --link-visited: #40C4FF;
--border-bg: #FFFFFF;
--buttom: #dcdcdb; --buttom: #dcdcdb;
--buttom-text: #415462; --buttom-text: #415462;
--button-border: #91918c; --button-border: #91918c;

View File

@ -9,6 +9,7 @@
--thumb-background: #35404D; --thumb-background: #35404D;
--link: #22aaff; --link: #22aaff;
--link-visited: #7755ff; --link-visited: #7755ff;
--border-bg: #FFFFFF;
--buttom: #DCDCDC; --buttom: #DCDCDC;
--buttom-text: #415462; --buttom-text: #415462;
--button-border: #91918c; --button-border: #91918c;

View File

@ -9,6 +9,7 @@
--thumb-background: #F5F5F5; --thumb-background: #F5F5F5;
--link: #212121; --link: #212121;
--link-visited: #606060; --link-visited: #606060;
--border-bg: #212121;
--buttom: #DCDCDC; --buttom: #DCDCDC;
--buttom-text: #212121; --buttom-text: #212121;
--button-border: #91918c; --button-border: #91918c;

View File

@ -153,6 +153,11 @@ label[for=options-toggle-cbox] {
padding: 1rem; padding: 1rem;
} }
.settings-form > h2 {
border-bottom: 2px solid var(--border-bg);
padding-bottom: 0.5rem;
}
.settings-list { .settings-list {
display: grid; display: grid;
grid-row-gap: 1rem; grid-row-gap: 1rem;
@ -163,7 +168,6 @@ label[for=options-toggle-cbox] {
.setting-item { .setting-item {
display: grid; display: grid;
grid-template-columns: auto auto; grid-template-columns: auto auto;
background-color: var(--secondary-focus);
align-items: center; align-items: center;
padding: 5px; padding: 5px;
} }