fortytwo/me
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

css: improve color picker color scheme

Browse source 
Signed-off-by: Naman Sood <mail@nsood.in>
This commit is contained in:
Naman Sood 2023-03-11 10:31:01 -05:00
parent 648b82e3f8
commit ac7b98de3e
2 changed files with 16 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

14
css/style.css
View file

@ -256,8 +256,8 @@ body.blue-mode {
left: 0; left: 0;
right: 0; right: 0;
margin: auto; margin: auto;
background: var(--bgColor); color: var(--bgColor);
color: var(--textColor); background: var(--textColor);
padding: 2rem; padding: 2rem;
border: 0; border: 0;
border-radius: 0 0 0.25rem 0.25rem; border-radius: 0 0 0.25rem 0.25rem;
@ -284,13 +284,13 @@ body.blue-mode {
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
border: 0; border: 0;
margin: 1rem 0.5rem 0; margin: 1rem 0.5rem 0;
background: var(--textColor); color: var(--textColor);
color: var(--bgColor); background: var(--bgColor);
border-radius: 0.25rem; border-radius: 0.25rem;
cursor: pointer; cursor: pointer;
} }
.main dialog.change-color-dialog form input[type=button]:hover, .main dialog.change-color-dialog form input[type=submit]:hover { .main dialog.change-color-dialog form input[type=button]:hover, .main dialog.change-color-dialog form input[type=submit]:hover {
background: var(--boldColor); color: var(--boldColor);
} }
.main dialog.change-color-dialog .radio-buttons { .main dialog.change-color-dialog .radio-buttons {
display: flex; display: flex;
@ -312,9 +312,11 @@ body.blue-mode {
margin: 0 0.25rem 0 0.75rem; margin: 0 0.25rem 0 0.75rem;
line-height: 2rem; line-height: 2rem;
text-align: center; text-align: center;
border: 0.5rem solid var(--textColor);
background-clip: padding-box;
} }
.main dialog.change-color-dialog .radio-buttons > div input:checked + label div { .main dialog.change-color-dialog .radio-buttons > div input:checked + label div {
border: 3px solid; border: 0;
} }
.main dialog.change-color-dialog[open] + button.change-color-button { .main dialog.change-color-dialog[open] + button.change-color-button {
display: none; display: none;

14
css/style.scss
View file

@ -285,8 +285,8 @@ body {
left: 0; left: 0;
right: 0; right: 0;
margin: auto; margin: auto;
background: var(--bgColor); color: var(--bgColor);
color: var(--textColor); background: var(--textColor);
padding: 2rem; padding: 2rem;
border: 0; border: 0;
border-radius: 0 0 0.25rem 0.25rem; border-radius: 0 0 0.25rem 0.25rem;
@ -316,13 +316,13 @@ body {
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
border: 0; border: 0;
margin: 1rem 0.5rem 0; margin: 1rem 0.5rem 0;
background: var(--textColor); color: var(--textColor);
color: var(--bgColor); background: var(--bgColor);
border-radius: 0.25rem; border-radius: 0.25rem;
cursor: pointer; cursor: pointer;
&:hover { &:hover {
background: var(--boldColor); color: var(--boldColor);
} }
} }
} }
@ -348,10 +348,12 @@ body {
margin: 0 0.25rem 0 0.75rem; margin: 0 0.25rem 0 0.75rem;
line-height: 2rem; line-height: 2rem;
text-align: center; text-align: center;
border: 0.5rem solid var(--textColor);
background-clip: padding-box;
} }
input:checked + label div { input:checked + label div {
border: 3px solid; border: 0;
} }
} }
} }