fix(ui): links cannot contain buttons. Props `solid` and `ghost` cannot be combined (see ui-docs)

This commit is contained in:
upsiflu 2024-12-17 00:18:46 +01:00
parent ac46d07c83
commit 13efd647b4
2 changed files with 5 additions and 55 deletions

View File

@ -141,34 +141,6 @@ onMounted(() => {
} }
} }
@include dark-theme {
&.ghost {
&:not(:active):not(.is-active):not(:hover):not(.is-hovered) {
background-color: transparent !important;
border-color: transparent !important;
}
&.is-hovered,
&:hover,
&.is-active,
&:active {
background-color: var(--fw-gray-800) !important;
border-color: var(--fw-gray-800) !important;
color: var(--fw-text-color) !important;
}
}
}
@include light-theme {
&.is-hovered,
&:hover,
&.is-active,
&:active {
background-color: var(--fw-gray-800) !important;
border-color: var(--fw-gray-800) !important;
color: var(--fw-bg-color) !important;
}
}
i.bi { i.bi {
font-size: 1.2rem; font-size: 1.2rem;
} }

View File

@ -75,78 +75,56 @@ const uploads = useUploadsStore()
<nav :class="$style['button-list']"> <nav :class="$style['button-list']">
<Link to="/library" <Link to="/library"
>
<Button
ghost ghost
solid
secondary secondary
icon="bi-compass" icon="bi-compass"
> >
{{ t('components.Sidebar.header.explore') }} {{ t('components.Sidebar.header.explore') }}
</Button>
</Link> </Link>
<Link to="/library/artists"> <Link to="/library/artists"
<Button
ghost ghost
solid
secondary secondary
icon="bi-person" icon="bi-person"
> >
{{ t('components.Sidebar.link.artists') }} {{ t('components.Sidebar.link.artists') }}
</Button>
</Link> </Link>
<Link to="/library/albums"> <Link to="/library/albums"
<Button
ghost ghost
solid
secondary secondary
icon="bi-disc" icon="bi-disc"
> >
{{ t('components.Sidebar.link.albums') }} {{ t('components.Sidebar.link.albums') }}
</Button>
</Link> </Link>
<Link to="/library/playlists"> <Link to="/library/playlists"
<Button
ghost ghost
solid
secondary secondary
icon="bi-music-note-list" icon="bi-music-note-list"
> >
{{ t('components.Sidebar.link.playlists') }} {{ t('components.Sidebar.link.playlists') }}
</Button>
</Link> </Link>
<Link to="/library/radios"> <Link to="/library/radios"
<Button
ghost ghost
solid
secondary secondary
icon="bi-boombox-fill" icon="bi-boombox-fill"
> >
{{ t('components.Sidebar.link.radios') }} {{ t('components.Sidebar.link.radios') }}
</Button>
</Link> </Link>
<Link to="/library/podcasts"> <Link to="/library/podcasts">
<Button
ghost ghost
solid
secondary secondary
icon="bi-mic" icon="bi-mic"
> >
{{ t('components.Sidebar.link.podcasts') }} {{ t('components.Sidebar.link.podcasts') }}
</Button>
</Link> </Link>
<Link to="/"> <Link to="/"
<Button
ghost ghost
solid
secondary secondary
icon="bi-heart" icon="bi-heart"
> >
{{ t('components.Sidebar.link.favorites') }} {{ t('components.Sidebar.link.favorites') }}
</Button>
</Link> </Link>
</nav> </nav>
<h3>{{ t('components.Sidebar.link.channels') }}</h3> <h3>{{ t('components.Sidebar.link.channels') }}</h3>