Remove sidebar play button, increase fw for labels

This commit is contained in:
jeffvli 2023-01-03 01:48:07 -08:00
parent 196cb1bd48
commit acb906aad9
2 changed files with 10 additions and 30 deletions

View File

@ -1,10 +1,8 @@
import type { ReactNode } from 'react';
import { createPolymorphicComponent, Flex, FlexProps, Group } from '@mantine/core';
import { RiPlayFill } from 'react-icons/ri';
import type { LinkProps } from 'react-router-dom';
import { Link } from 'react-router-dom';
import styled, { css } from 'styled-components';
import { Button } from '/@/renderer/components';
import { textEllipsis } from '/@/renderer/styles';
interface ListItemProps extends FlexProps {
@ -79,17 +77,19 @@ SidebarItem.defaultProps = {
const _PlaylistItemLink = styled(StyledItem)<LinkProps & { disabled?: boolean }>`
display: block;
width: 80%;
padding: 0.3rem 0;
overflow: hidden;
color: var(--sidebar-fg);
opacity: ${(props) => props.disabled && 0.6};
cursor: default;
opacity: ${(props) => (props.disabled ? 0.6 : 0.8)};
transition: color 0.2s ease-in-out;
transition: opacity 0.2s ease-in-out;
pointer-events: ${(props) => props.disabled && 'none'};
${textEllipsis}
&:hover {
color: var(--sidebar-fg-hover);
opacity: 1;
}
&:focus-visible {
@ -110,13 +110,6 @@ export const PlaylistSidebarItem = ({
<Group
noWrap
position="apart"
sx={{
'&:hover': {
button: {
display: 'block',
},
},
}}
>
<PlaylistItemLink
component={Link}
@ -125,19 +118,6 @@ export const PlaylistSidebarItem = ({
>
{children}
</PlaylistItemLink>
<Flex
align="center"
justify="flex-end"
>
<Button
compact
sx={{ display: 'none' }}
variant="filled"
onClick={handlePlay}
>
<RiPlayFill />
</Button>
</Flex>
</Group>
);
}

View File

@ -199,7 +199,7 @@ export const Sidebar = () => {
>
<Accordion.Item value="library">
<Accordion.Control>
<Group>
<Group fw="600">
{location.pathname.includes('/library/') ? (
<RiDatabaseFill size={15} />
) : (
@ -210,7 +210,7 @@ export const Sidebar = () => {
</Accordion.Control>
<Accordion.Panel>
<SidebarItem to={AppRoute.LIBRARY_ALBUMS}>
<Group>
<Group fw="600">
{location.pathname === AppRoute.LIBRARY_ALBUMS ? (
<RiAlbumFill />
) : (
@ -220,7 +220,7 @@ export const Sidebar = () => {
</Group>
</SidebarItem>
<SidebarItem to={AppRoute.LIBRARY_SONGS}>
<Group>
<Group fw="600">
{location.pathname === AppRoute.LIBRARY_SONGS ? (
<RiMusicFill />
) : (
@ -230,7 +230,7 @@ export const Sidebar = () => {
</Group>
</SidebarItem>
<SidebarItem to={AppRoute.LIBRARY_ALBUMARTISTS}>
<Group>
<Group fw="600">
{location.pathname === AppRoute.LIBRARY_ALBUMARTISTS ? (
<RiUserVoiceFill />
) : (
@ -243,7 +243,7 @@ export const Sidebar = () => {
disabled
to={AppRoute.LIBRARY_FOLDERS}
>
<Group>
<Group fw="600">
<RiFlag2Line />
Genres
</Group>
@ -252,7 +252,7 @@ export const Sidebar = () => {
disabled
to={AppRoute.LIBRARY_FOLDERS}
>
<Group>
<Group fw="600">
<RiFolder3Line />
Folders
</Group>