diff --git a/src/css.css b/src/css.css index 2c8ec5c..4e9628b 100644 --- a/src/css.css +++ b/src/css.css @@ -29,24 +29,28 @@ } :root { - --bg-color: hsl(300 25% 90%); - --font-color: hsl( 0 0% 20%); - --code-border-color: hsl( 0 0% 10%); - --link-color: hsl(225 73% 52%); - --link-color-visited: hsl(249 80% 60%); - --header-bg-color: hsl(300 23% 85%); - --header-border-color: hsl(300 22% 75%); - --details-bg-color: hsl(300 25% 95%); + --bg-color: hsl(300 25% 90%); + --font-color: hsl( 0 0% 20%); + --code-border-color: hsl( 0 0% 10%); + --link-color: hsl(225 73% 52%); + --link-color-hover: hsl(225 73% 42%); + --link-color-visited: hsl(249 80% 60%); + --link-color-visited-hover: hsl(249 80% 50%); + --header-bg-color: hsl(300 23% 85%); + --header-border-color: hsl(300 22% 75%); + --details-bg-color: hsl(300 25% 95%); @media (prefers-color-scheme: dark) { - --bg-color: hsl(300 25% 10%); - --font-color: hsl( 0 0% 80%); - --code-border-color: hsl( 0 0% 20%); - --link-color: hsl(225 73% 62%); - --link-color-visited: hsl(249 80% 70%); - --header-bg-color: hsl(300 23% 15%); - --header-border-color: hsl(300 22% 25%); - --details-bg-color: hsl(300 25% 5%); + --bg-color: hsl(300 25% 10%); + --font-color: hsl( 0 0% 80%); + --code-border-color: hsl( 0 0% 20%); + --link-color: hsl(225 73% 62%); + --link-color-hover: hsl(225 73% 72%); + --link-color-visited: hsl(249 80% 70%); + --link-color-visited-hover: hsl(249 80% 80%); + --header-bg-color: hsl(300 23% 15%); + --header-border-color: hsl(300 22% 25%); + --details-bg-color: hsl(300 25% 5%); } } @@ -76,12 +80,25 @@ code { a { text-decoration: underline dashed; + &:hover { + text-decoration: underline solid; + text-decoration-thickness: 2px; + } + &:link { color: var(--link-color); + + &:hover { + color: var(--link-color-hover); + } } &:visited { color: var(--link-color-visited); + + &:hover { + color: var(--link-color-visited-hover); + } } }