vanja/feishin
1
0
Fork 0
mirror of https://github.com/jeffvli/feishin.git synced 2026-05-08 13:00:13 +02:00
Code Issues Packages Projects Releases Wiki Activity

refactor play button for reusability

Browse Source
This commit is contained in:
jeffvli
2025-11-26 14:56:11 -08:00
parent 902ac91b95
commit 2c9ea6d19c
4 changed files with 64 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/components/item-card/item-card-controls.module.css
+16
View File
@@ -45,6 +45,22 @@
margin-bottom: var(--theme-spacing-lg);
}
.play-button {
position: absolute;
top: 50%;
transform: translate(-50%, -50%) scale(var(--play-button-scale, 1));
&:hover {
opacity: 1;
transform: translate(-50%, -50%) scale(1.1);
}
&:active {
opacity: 1;
transform: translate(-50%, -50%) scale(0.9);
}
}
.primary {
left: 50%;
width: 25%;
src/renderer/components/item-card/item-card-controls.tsx
+3 -3
View File
@@ -236,18 +236,18 @@ export const ItemCardControls = ({
{controls?.onPlay && (
<>
<PlayButton
classNames={clsx(styles.primary)}
classNames={clsx(styles.playButton, styles.primary)}
onClick={playNowHandler}
onLongPress={playShuffleHandler}
/>
<PlayButton
classNames={clsx(styles.secondary, styles.left)}
classNames={clsx(styles.playButton, styles.secondary, styles.left)}
icon="mediaPlayNext"
onClick={playNextHandler}
onLongPress={playNextShuffleHandler}
/>
<PlayButton
classNames={clsx(styles.secondary, styles.right)}
classNames={clsx(styles.playButton, styles.secondary, styles.right)}
icon="mediaPlayLast"
onClick={playLastHandler}
onLongPress={playLastShuffleHandler}