RomanNum3ral
/
OpenCut
mirror of https://github.com/OpenCut-app/OpenCut.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #420 from chrissshan/feature/update-timeline-snapping-icon 

feat: [UI] Update Timeline icon for "Auto Snapping"
This commit is contained in:
Maze 2025-07-22 11:40:14 +02:00 committed by GitHub
parent f2a403b678 205ad520f0
commit a5f7b477e6
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 8 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
apps/web/src/components/editor/timeline.tsx
View File

@ -15,8 +15,7 @@ import {
Video,
Music,
TypeIcon,
Lock,
LockOpen,
Magnet,
Link,
} from "lucide-react";
import {
@ -288,7 +287,7 @@ export function Timeline() {
Math.min(
duration,
(mouseX + scrollLeft) /
(TIMELINE_CONSTANTS.PIXELS_PER_SECOND * zoomLevel)
(TIMELINE_CONSTANTS.PIXELS_PER_SECOND * zoomLevel)
)
);
@ -806,9 +805,9 @@ export function Timeline() {
<TooltipTrigger asChild>
<Button variant="text" size="icon" onClick={toggleSnapping}>
{snappingEnabled ? (
<LockOpen className="h-4 w-4 text-primary" />
<Magnet className="h-4 w-4 text-primary" />
) : (
<Lock className="h-4 w-4" />
<Magnet className="h-4 w-4" />
)}
</Button>
</TooltipTrigger>
@ -920,21 +919,19 @@ export function Timeline() {
return (
<div
key={i}
className={`absolute top-0 bottom-0 ${
isMainMarker
className={`absolute top-0 bottom-0 ${isMainMarker
? "border-l border-muted-foreground/40"
: "border-l border-muted-foreground/20"
}`}
}`}
style={{
left: `${time * TIMELINE_CONSTANTS.PIXELS_PER_SECOND * zoomLevel}px`,
}}
>
<span
className={`absolute top-1 left-1 text-[0.6rem] ${
isMainMarker
className={`absolute top-1 left-1 text-[0.6rem] ${isMainMarker
? "text-muted-foreground font-medium"
: "text-muted-foreground/70"
}`}
}`}
>
{(() => {
const formatTime = (seconds: number) => {