jlelse
/
GoBlog
mirror of https://github.com/jlelse/GoBlog
1
Fork 0
Code Packages Releases Activity

Improve CSS styles

This commit is contained in:
Jan-Lukas Else 2021-05-20 19:49:10 +02:00
parent 1898536bf1
commit 7a8487ec01
2 changed files with 33 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
original-assets/styles/styles.scss
View File

@ -56,6 +56,11 @@ body {
* { * {
@include color(color, primary); @include color(color, primary);
max-width: 100%; max-width: 100%;
&::selection {
@include color(color, background);
@include color(background, primary);
}
} }
} }
@ -88,6 +93,11 @@ button, input, textarea, select {
text-decoration: none; text-decoration: none;
font-size: 1rem; font-size: 1rem;
line-height: 1.5; line-height: 1.5;
outline: none;
&:focus {
@include color-border(outline, 3px, solid, primary);
}
} }
.button { .button {
@ -125,11 +135,15 @@ pre {
white-space: pre-wrap; white-space: pre-wrap;
} }
:not(pre) > code { mark, :not(pre) > code {
font-size: 1rem; font-size: 1rem;
// Invert // Invert
@include color(color, background); @include color(color, background);
@include color(background, primary); @include color(background, primary);
&::selection {
@include color(color, primary);
@include color(background, background);
}
} }
code { code {

19
templates/assets/css/styles.css
View File

@ -35,6 +35,12 @@ body * {
color: var(--primary, #000); color: var(--primary, #000);
max-width: 100%; max-width: 100%;
} }
body *::selection {
color: #fff;
color: var(--background, #fff);
background: #000;
background: var(--primary, #000);
}
header { header {
padding: 10px 0; padding: 10px 0;
@ -65,6 +71,11 @@ button, .button, input, textarea, select {
text-decoration: none; text-decoration: none;
font-size: 1rem; font-size: 1rem;
line-height: 1.5; line-height: 1.5;
outline: none;
}
button:focus, .button:focus, input:focus, textarea:focus, select:focus {
outline: 3px solid #000;
outline: 3px solid var(--primary, #000);
} }
form input, form textarea, form select { form input, form textarea, form select {
@ -85,13 +96,19 @@ pre {
white-space: pre-wrap; white-space: pre-wrap;
} }
:not(pre) > code { mark, :not(pre) > code {
font-size: 1rem; font-size: 1rem;
color: #fff; color: #fff;
color: var(--background, #fff); color: var(--background, #fff);
background: #000; background: #000;
background: var(--primary, #000); background: var(--primary, #000);
} }
mark::selection, :not(pre) > code::selection {
color: #000;
color: var(--primary, #000);
background: #fff;
background: var(--background, #fff);
}
code { code {
font-family: monospace; font-family: monospace;