Make border size themeable.
This commit is contained in:
parent
24640cce06
commit
61e59cb88c
|
@ -3,14 +3,14 @@
|
|||
|
||||
input[type='text'] {
|
||||
background-color: var(--background-2);
|
||||
border: 1px solid var(--foreground-1);
|
||||
border: var(--border-size) solid var(--foreground-1);
|
||||
color: inherit;
|
||||
padding: 0.5rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
ul {
|
||||
border: 1px solid var(--foreground-1);
|
||||
border: var(--border-size) solid var(--foreground-1);
|
||||
border-top: none;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
|
||||
.explainer {
|
||||
background-color: var(--background-2);
|
||||
border: 1px solid var(--foreground-2);
|
||||
border: var(--border-size) solid var(--foreground-2);
|
||||
margin-top: 1rem;
|
||||
max-width: 70rem;
|
||||
padding: 1rem;
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
.release {
|
||||
background-color: var(--background-2);
|
||||
border: 1px solid var(--foreground-2);
|
||||
border: var(--border-size) solid var(--foreground-2);
|
||||
margin: 2rem auto;
|
||||
max-width: 40rem;
|
||||
}
|
||||
|
@ -39,7 +39,7 @@
|
|||
}
|
||||
|
||||
.divider {
|
||||
border-top: 2px solid var(--background-1);
|
||||
border-top: var(--border-size) solid var(--background-1);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
|
||||
.setting {
|
||||
background-color: var(--background-2);
|
||||
border: 1px solid var(--foreground-2);
|
||||
border: var(--border-size) solid var(--foreground-2);
|
||||
margin-top: 1rem;
|
||||
max-width: 70rem;
|
||||
padding: 1rem;
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
.dracula {
|
||||
--border-radius: 8px;
|
||||
--border-size: 2px;
|
||||
--foreground-1: #f8f8f2;
|
||||
--foreground-2: #f8f8f2;
|
||||
--background-1: #282a36;
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
.high-contrast-black {
|
||||
--border-radius: 8px;
|
||||
--border-size: 2px;
|
||||
--foreground-1: #fff;
|
||||
--foreground-2: #ddd;
|
||||
--background-1: #000;
|
||||
|
@ -8,6 +9,7 @@
|
|||
|
||||
.high-contrast-white {
|
||||
--border-radius: 8px;
|
||||
--border-size: 2px;
|
||||
--foreground-1: #000;
|
||||
--foreground-2: #222;
|
||||
--background-1: #fff;
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
.love-dark {
|
||||
--border-radius: 8px;
|
||||
--border-size: 2px;
|
||||
--foreground-1: #f2efff;
|
||||
--foreground-2: #e6deff;
|
||||
--background-1: #1f1731;
|
||||
|
@ -8,6 +9,7 @@
|
|||
|
||||
.love-light {
|
||||
--border-radius: 8px;
|
||||
--border-size: 2px;
|
||||
--foreground-1: #1f1731;
|
||||
--foreground-2: #2a2041;
|
||||
--background-1: #f2efff;
|
||||
|
|
|
@ -2,6 +2,7 @@
|
|||
|
||||
.monokai {
|
||||
--border-radius: 8px;
|
||||
--border-size: 2px;
|
||||
--foreground-1: #d6d6d6;
|
||||
--foreground-2: #d6d6d6;
|
||||
--background-1: #{color.scale(#2e2e2e, $lightness: -25%)};
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
.solarized-dark {
|
||||
--border-radius: 8px;
|
||||
--border-size: 2px;
|
||||
--foreground-1: #839496;
|
||||
--foreground-2: #93a1a1;
|
||||
--background-1: #002b36;
|
||||
|
@ -8,6 +9,7 @@
|
|||
|
||||
.solarized-light {
|
||||
--border-radius: 8px;
|
||||
--border-size: 2px;
|
||||
--foreground-1: #657b83;
|
||||
--foreground-2: #586e75;
|
||||
--background-1: #fdf6e3;
|
||||
|
|
Loading…
Reference in New Issue