mirror of https://github.com/jlelse/GoBlog
Improve CSS styles
This commit is contained in:
parent
1898536bf1
commit
7a8487ec01
|
@ -56,6 +56,11 @@ body {
|
|||
* {
|
||||
@include color(color, primary);
|
||||
max-width: 100%;
|
||||
|
||||
&::selection {
|
||||
@include color(color, background);
|
||||
@include color(background, primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -88,6 +93,11 @@ button, input, textarea, select {
|
|||
text-decoration: none;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5;
|
||||
outline: none;
|
||||
|
||||
&:focus {
|
||||
@include color-border(outline, 3px, solid, primary);
|
||||
}
|
||||
}
|
||||
|
||||
.button {
|
||||
|
@ -125,11 +135,15 @@ pre {
|
|||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
:not(pre) > code {
|
||||
mark, :not(pre) > code {
|
||||
font-size: 1rem;
|
||||
// Invert
|
||||
@include color(color, background);
|
||||
@include color(background, primary);
|
||||
&::selection {
|
||||
@include color(color, primary);
|
||||
@include color(background, background);
|
||||
}
|
||||
}
|
||||
|
||||
code {
|
||||
|
|
|
@ -35,6 +35,12 @@ body * {
|
|||
color: var(--primary, #000);
|
||||
max-width: 100%;
|
||||
}
|
||||
body *::selection {
|
||||
color: #fff;
|
||||
color: var(--background, #fff);
|
||||
background: #000;
|
||||
background: var(--primary, #000);
|
||||
}
|
||||
|
||||
header {
|
||||
padding: 10px 0;
|
||||
|
@ -65,6 +71,11 @@ button, .button, input, textarea, select {
|
|||
text-decoration: none;
|
||||
font-size: 1rem;
|
||||
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 {
|
||||
|
@ -85,13 +96,19 @@ pre {
|
|||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
:not(pre) > code {
|
||||
mark, :not(pre) > code {
|
||||
font-size: 1rem;
|
||||
color: #fff;
|
||||
color: var(--background, #fff);
|
||||
background: #000;
|
||||
background: var(--primary, #000);
|
||||
}
|
||||
mark::selection, :not(pre) > code::selection {
|
||||
color: #000;
|
||||
color: var(--primary, #000);
|
||||
background: #fff;
|
||||
background: var(--background, #fff);
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: monospace;
|
||||
|
|
Loading…
Reference in New Issue