Pagwin/new_blog
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

active colors not sure about nav link active colors

Browse source
This commit is contained in:
Pagwin 2024-12-07 17:34:17 -05:00
parent 89f92efc28
commit 7604312728
No known key found for this signature in database
GPG key ID: 81137023740CA260
1 changed files with 14 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
static/css/colors.css
View file

@ -12,6 +12,7 @@
--focus-outline-color: #f00; --focus-outline-color: #f00;
--link-clicked: #B250D8; --link-clicked: #B250D8;
--link-unclicked: #d80; --link-unclicked: #d80;
--link-active: lab(100% 0% 100%);
--header-bg: hsl(0,0%,15%); --header-bg: hsl(0,0%,15%);
--nav-link-color: #6B0; --nav-link-color: #6B0;
--nav-link-bg-color: hsl(0,0%,25%); --nav-link-bg-color: hsl(0,0%,25%);
@ -21,6 +22,8 @@
--blockquote-bg: rgb(29, 31, 33); --blockquote-bg: rgb(29, 31, 33);
--highlight-bg: #fff; --highlight-bg: #fff;
--highlight-fg: #000; --highlight-fg: #000;
--nav-link-bg-color-active: #118411;
--nav-link-color-active: white;
} }
} }
/* /*
@ -41,6 +44,7 @@
--focus-outline-color: #f00; --focus-outline-color: #f00;
--link-unclicked: #2535B4; --link-unclicked: #2535B4;
--link-clicked: #832244; --link-clicked: #832244;
--link-active: lab(20% 80% -80%);
/*#E6DDE6 /*#E6DDE6
* #dce2e5 * #dce2e5
* *
@ -57,6 +61,8 @@
--blockquote-bg: rgb(226,224,222); --blockquote-bg: rgb(226,224,222);
--highlight-bg: #000; --highlight-bg: #000;
--highlight-fg: #fff; --highlight-fg: #fff;
--nav-link-bg-color-active: #118411;
--nav-link-color-active: white;
} }
} }
} }
@ -69,6 +75,11 @@
.nav-link:hover { .nav-link:hover {
background: var(--nav-link-bg-color-hover); background: var(--nav-link-bg-color-hover);
} }
.nav-link:active {
background: var(--nav-link-bg-color-active);
color: var(--nav-link-color-active)
}
} }
@layer baseline{ @layer baseline{
body { body {
@ -89,7 +100,9 @@ a {
a:visited { a:visited {
color: var(--link-clicked); color: var(--link-clicked);
} }
a:active {
color: var(--link-active)
}
#header { #header {
background: var(--header-bg); background: var(--header-bg);
} }