Bauke/bauke-xyz
Bauke
/
bauke-xyz
1
Fork 0
Code Releases 12 Activity

Replace colors with CSS custom properties.

This commit is contained in:
Bauke 2022-03-28 14:14:44 +02:00
parent 475e4b3c1b
commit 5e2d50af5b
Signed by: Bauke
GPG Key ID: C1C0F29952BCF558
4 changed files with 19 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
source/scss/components/_listenbrainz.scss
View File

@ -1,14 +1,14 @@
.listenbrainz a { .listenbrainz a {
align-items: center; align-items: center;
border: 2px solid #fff; border: 2px solid var(--foreground-1);
display: flex; display: flex;
margin-top: 1rem; margin-top: 1rem;
padding: 1rem; padding: 1rem;
&:hover { &:hover {
background-color: #fff; background-color: var(--foreground-1);
border-color: #fff; border-color: var(--foreground-1);
color: #000; color: var(--background-1);
} }
img { img {

8
source/scss/components/_page-main.scss
View File

@ -12,14 +12,14 @@
a { a {
border: 2px solid; border: 2px solid;
color: #fff; color: var(--foreground-1);
padding: 1rem; padding: 1rem;
text-decoration: none; text-decoration: none;
&:hover { &:hover {
background-color: #fff; background-color: var(--foreground-1);
border-color: #fff; border-color: var(--foreground-1);
color: #000; color: var(--background-1);
} }
} }
} }

8
source/scss/components/_userstyles.scss
View File

@ -6,7 +6,7 @@
padding: 0; padding: 0;
.style { .style {
border: 2px solid #fff; border: 2px solid var(--foreground-1);
padding: 1rem; padding: 1rem;
.header { .header {
@ -26,9 +26,9 @@
text-decoration: none; text-decoration: none;
&:hover { &:hover {
background-color: #fff; background-color: var(--foreground-1);
border-color: #fff; border-color: var(--foreground-1);
color: #000; color: var(--background-1);
} }
} }
} }

11
source/scss/index.scss
View File

@ -5,14 +5,17 @@ html {
} }
body { body {
background-color: #000; --background-1: #000;
color: #fff; --foreground-1: #fff;
background-color: var(--background-1);
color: var(--foreground-1);
font-family: sans-serif; font-family: sans-serif;
font-size: 2rem; font-size: 2rem;
} }
a { a {
color: #fff; color: var(--foreground-1);
font-weight: bold; font-weight: bold;
} }
@ -25,7 +28,7 @@ button {
} }
.divider { .divider {
border-top: 2px solid #fff; border-top: 2px solid var(--foreground-1);
margin-bottom: 1rem; margin-bottom: 1rem;
margin-top: 1rem; margin-top: 1rem;
} }