Add a hover effect to the home link in the page header.
This commit is contained in:
parent
0250aa106e
commit
0420f58d02
@ -27,6 +27,8 @@
|
||||
--header-nav-regular-background-color: var(--site-background-color);
|
||||
--header-nav-hover-font-color: var(--site-background-color);
|
||||
--header-nav-hover-background-color: var(--site-text-color);
|
||||
--header-home-regular-font-color: var(--site-text-color);
|
||||
--header-home-hover-font-color: #6ccff6;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
@ -55,6 +57,8 @@
|
||||
--header-nav-regular-background-color: var(--site-background-color);
|
||||
--header-nav-hover-font-color: var(--site-background-color);
|
||||
--header-nav-hover-background-color: var(--site-text-color);
|
||||
--header-home-regular-font-color: var(--site-text-color);
|
||||
--header-home-hover-font-color: #933009;
|
||||
}
|
||||
}
|
||||
|
||||
@ -95,10 +99,18 @@ body {
|
||||
font-size: 2rem;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
color: var(--header-home-regular-font-color);
|
||||
transition-property: color;
|
||||
transition-duration: 0.1s;
|
||||
transition-timing-function: ease-out;
|
||||
|
||||
&:hover {
|
||||
color: var(--header-home-hover-font-color) !important;
|
||||
}
|
||||
|
||||
&:link,
|
||||
&:visited {
|
||||
color: var(--site-text-color);
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user