qhri/personal-website
2
2
Fork 0
Code Issues 2 Pull requests Projects Releases Packages Wiki Activity Actions

added styling to hovered links

Browse source
This commit is contained in:
qhri 2025-08-26 20:31:00 -04:00
parent 67445b2075
commit ff90f623aa
1 changed files with 33 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

49
src/css.css
View file

@ -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);
}
}
}