ZSCGR/KVideo
1
0
Fork 0
mirror of https://github.com/KuekHaoYang/KVideo.git synced 2026-08-19 18:53:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: Refine player control button sizes and update play button styling.

Browse Source
This commit is contained in:
kuekhaoyang
2025-12-29 12:53:11 +08:00
parent f5b9fcf0d1
commit 73e5ec5046
3 changed files with 9 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/player/desktop/DesktopOverlay.tsx
+6 -6
View File
@@ -136,10 +136,10 @@ export function DesktopOverlay({
e.stopPropagation();
onSkipBackward();
}}
className="group flex items-center justify-center w-12 h-12 md:w-16 md:h-16 rounded-full bg-black/40 hover:bg-black/60 backdrop-blur-sm transition-all duration-300 hover:scale-110 active:scale-95"
className="group flex items-center justify-center w-10 h-10 md:w-16 md:h-16 rounded-full bg-black/40 hover:bg-black/60 backdrop-blur-sm transition-all duration-300 hover:scale-110 active:scale-95"
aria-label="Skip Backward 10s"
>
<Icons.SkipBack className="w-6 h-6 md:w-8 md:h-8 text-white/80 group-hover:text-white" />
<Icons.SkipBack className="w-5 h-5 md:w-8 md:h-8 text-white/80 group-hover:text-white" />
</button>
</div>
@@ -154,10 +154,10 @@ export function DesktopOverlay({
e.stopPropagation();
onSkipForward();
}}
className="group flex items-center justify-center w-12 h-12 md:w-16 md:h-16 rounded-full bg-black/40 hover:bg-black/60 backdrop-blur-sm transition-all duration-300 hover:scale-110 active:scale-95"
className="group flex items-center justify-center w-10 h-10 md:w-16 md:h-16 rounded-full bg-black/40 hover:bg-black/60 backdrop-blur-sm transition-all duration-300 hover:scale-110 active:scale-95"
aria-label="Skip Forward 10s"
>
<Icons.FastForward className="w-6 h-6 md:w-8 md:h-8 text-white/80 group-hover:text-white" />
<Icons.FastForward className="w-5 h-5 md:w-8 md:h-8 text-white/80 group-hover:text-white" />
</button>
</div>
@@ -166,10 +166,10 @@ export function DesktopOverlay({
<div className="absolute inset-0 flex items-center justify-center pointer-events-none z-10">
<button
onClick={onTogglePlay}
className="pointer-events-auto w-16 h-16 md:w-20 md:h-20 rounded-full bg-[var(--glass-bg)] backdrop-blur-[25px] saturate-[180%] border border-[var(--glass-border)] flex items-center justify-center transition-all duration-300 hover:scale-110 hover:bg-[var(--accent-color)] shadow-[var(--shadow-md)] will-change-transform cursor-pointer"
className="pointer-events-auto w-12 h-12 md:w-20 md:h-20 rounded-full bg-black/40 hover:bg-black/60 backdrop-blur-sm flex items-center justify-center transition-all duration-300 hover:scale-110 active:scale-95 cursor-pointer"
aria-label="Play"
>
<Icons.Play className="w-8 h-8 md:w-10 md:h-10 text-white ml-1" />
<Icons.Play className="w-6 h-6 md:w-10 md:h-10 text-white ml-1" />
</button>
</div>
)}