diff --git a/src/renderer/features/sidebar/components/sidebar-item.tsx b/src/renderer/features/sidebar/components/sidebar-item.tsx index dddb6140..dfaed8b9 100644 --- a/src/renderer/features/sidebar/components/sidebar-item.tsx +++ b/src/renderer/features/sidebar/components/sidebar-item.tsx @@ -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)` 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 = ({ {children} - - - ); } diff --git a/src/renderer/features/sidebar/components/sidebar.tsx b/src/renderer/features/sidebar/components/sidebar.tsx index 7e5968f9..9644cf6e 100644 --- a/src/renderer/features/sidebar/components/sidebar.tsx +++ b/src/renderer/features/sidebar/components/sidebar.tsx @@ -199,7 +199,7 @@ export const Sidebar = () => { > - + {location.pathname.includes('/library/') ? ( ) : ( @@ -210,7 +210,7 @@ export const Sidebar = () => { - + {location.pathname === AppRoute.LIBRARY_ALBUMS ? ( ) : ( @@ -220,7 +220,7 @@ export const Sidebar = () => { - + {location.pathname === AppRoute.LIBRARY_SONGS ? ( ) : ( @@ -230,7 +230,7 @@ export const Sidebar = () => { - + {location.pathname === AppRoute.LIBRARY_ALBUMARTISTS ? ( ) : ( @@ -243,7 +243,7 @@ export const Sidebar = () => { disabled to={AppRoute.LIBRARY_FOLDERS} > - + Genres @@ -252,7 +252,7 @@ export const Sidebar = () => { disabled to={AppRoute.LIBRARY_FOLDERS} > - + Folders