antebudimir/feishin
1
0
Fork 0
mirror of https://github.com/antebudimir/feishin.git synced 2026-01-02 19:01:40 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Migrate to Mantine v8 and Design Changes (#961)

Browse source 
* mantine v8 migration

* various design changes and improvements
This commit is contained in:
Jeff 2025-06-24 00:04:36 -07:00 • committed by GitHub
parent bea55d48a8
commit c1330d92b2
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
473 changed files with 12469 additions and 11607 deletions
Download patch file Download diff file Expand all files Collapse all files

37
src/renderer/layouts/default-layout/right-sidebar.tsx
View file

@ -1,7 +1,8 @@
import { AnimatePresence, motion, Variants } from 'framer-motion';
import { AnimatePresence, motion, Variants } from 'motion/react';
import { forwardRef, Ref } from 'react';
import { useLocation } from 'react-router';
import styled from 'styled-components';
import styles from './right-sidebar.module.css';
import { DrawerPlayQueue, SidebarPlayQueue } from '/@/renderer/features/now-playing';
import { ResizeHandle } from '/@/renderer/features/shared';
@ -9,18 +10,6 @@ import { AppRoute } from '/@/renderer/router/routes';
import { useGeneralSettings, useSidebarStore, useWindowSettings } from '/@/renderer/store';
import { Platform } from '/@/shared/types/types';
const RightSidebarContainer = styled(motion.aside)`
position: relative;
grid-area: right-sidebar;
height: 100%;
background: var(--sidebar-bg);
border-left: var(--sidebar-border);
.current-song-cell:not(.current-playlist-song-cell) svg {
display: none;
}
`;
const queueSidebarVariants: Variants = {
closed: (rightWidth) => ({
transition: { duration: 0.5 },
@ -39,12 +28,6 @@ const queueSidebarVariants: Variants = {
}),
};
const QueueDrawer = styled(motion.div)`
background: var(--main-bg);
border: 3px solid var(--generic-border-color);
border-radius: 10px;
`;
const queueDrawerVariants: Variants = {
closed: (windowBarStyle) => ({
height:
@ -109,8 +92,9 @@ export const RightSidebar = forwardRef(
{showSideQueue && (
<>
{sideQueueType === 'sideQueue' ? (
<RightSidebarContainer
<motion.aside
animate="open"
className={styles.rightSidebarContainer}
custom={rightWidth}
exit="closed"
id="sidebar-queue"
@ -119,19 +103,20 @@ export const RightSidebar = forwardRef(
variants={queueSidebarVariants}
>
<ResizeHandle
$isResizing={isResizingRight}
$placement="left"
isResizing={isResizingRight}
onMouseDown={(e) => {
e.preventDefault();
startResizing('right');
}}
placement="left"
ref={ref}
/>
<SidebarPlayQueue />
</RightSidebarContainer>
</motion.aside>
) : (
<QueueDrawer
<motion.div
animate="open"
className={styles.queueDrawer}
custom={windowBarStyle}
exit="closed"
id="drawer-queue"
@ -140,7 +125,7 @@ export const RightSidebar = forwardRef(
variants={queueDrawerVariants}
>
<DrawerPlayQueue />
</QueueDrawer>
</motion.div>
)}
</>
)}