Trying out new hover style for top nav bar

This commit is contained in:
Lim Chee Aun 2024-08-28 19:01:55 +08:00
parent 2e2ba243ca
commit 50a2fe1743

View file

@ -121,13 +121,31 @@
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
} }
#shortcuts .tab-bar li a {
position: relative;
&:before {
content: '';
position: absolute;
inset: 4px 0;
border-radius: 8px;
background-color: var(--bg-color);
z-index: -1;
transform: scale(0.5);
opacity: 0;
transition: all 0.1s ease-in-out;
}
}
#shortcuts .tab-bar li a.is-active { #shortcuts .tab-bar li a.is-active {
color: var(--link-color); color: var(--link-color);
background-image: radial-gradient( /* background-image: radial-gradient(
closest-side at 50% 50%, closest-side at 50% 50%,
var(--bg-color), var(--bg-color),
transparent transparent
); ); */
&:before {
transform: scale(1);
opacity: 1;
}
} }
#app:has(#home-page):not(:has(#home-page ~ .deck-container)):has(header[hidden]) #app:has(#home-page):not(:has(#home-page ~ .deck-container)):has(header[hidden])
#shortcuts #shortcuts