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 {
font-size: 1.2rem;
}

View File

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