Fix package.json + NavRow indicator

This commit is contained in:
venashial
2022-06-21 22:37:26 -07:00
parent 06780c2805
commit bd3dd69ae1
4 changed files with 25 additions and 29 deletions

View File

@@ -71,11 +71,13 @@
&-xs {
--size: 2.5rem;
box-shadow: var(--shadow-inset), var(--shadow-raised);
border-radius: var(--rounded-sm);
}
&-sm {
--size: 3rem;
box-shadow: var(--shadow-inset), var(--shadow-raised);
border-radius: var(--rounded-sm);
}
&-md {

View File

@@ -67,6 +67,7 @@
{/each}
<div
class="navigation__indicator"
style:visibility={indicatorReady && activeIndex !== -1 ? 'visible' : 'hidden'}
style:left={linkElements
.slice(0, activeIndex)
.map((element, index) => element.offsetWidth + 16)
@@ -86,7 +87,6 @@
&__link {
font-weight: var(--font-weight-bold);
color: var(--color-text-light);
transition: color 0.3s ease-in-out;
position: relative;
&.is-active {
@@ -101,11 +101,13 @@
width: 100%;
border-radius: var(--rounded-max);
height: 0.25rem;
transition: background-color 0.2s ease-in-out;
transition: opacity 0.2s ease-in-out;
background-color: var(--color-brand);
opacity: 0;
}
&:hover::after {
background-color: var(--color-brand-light);
opacity: 0.5;
}
}
@@ -127,11 +129,5 @@
transition: width 0.3s ease-out, left 0.3s ease-out;
visibility: hidden;
}
&:not(.static-indicator) {
.navigation__indicator {
visibility: visible;
}
}
}
</style>