rickub
hlassiege/darylpublic Fork
⑂ fe37089
Branches
main View all branches → View all tags →
Commits
⬇ Clone ▾
git clone https://git.rickub.com/hlassiege/daryl.git
git clone ssh://git@rickub.com/hlassiege/daryl.git

Host key fingerprint (ed25519): SHA256:iycHnxEyq0Q7uyVpB7JlznP0G7JrTPXLYRcAU5CSLhc — verify it before your first connect.

Download ZIP

feat(web): show [ and ] cursors on clip trim edges

Between two adjacent clips, the cursor now tells whether the drag trims
the start of the next clip or the end of the previous one.
hlassiege committed 2026-10-12T09:22:49+02:00 Browse files
fe37089 parent: 174b75a
modified web/src/project/steps/montage/Timeline.vue +9 -2
@@ -755,8 +755,15 @@ function motionState(id: string) {
755755 .fx span { padding: 0 6px; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
756756 .fx.on { border-color: var(--red); box-shadow: 0 0 0 1.5px var(--red); }
757757 .edge { position: absolute; top: 0; bottom: 0; width: 6px; cursor: ew-resize; z-index: 3; }
758-.edge.l { left: 0; }
759-.edge.r { right: 0; }
758+/* comme dans Filmora : [ rogne le début du clip sous la souris, ] sa fin (entre deux clips collés, on voit lequel) */
759+.edge.l {
760+ left: 0;
761+ cursor: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke-linecap='round' stroke-linejoin='round'><path d='M16 4H12V20H16M8 12H2M4 10L2 12L4 14' stroke='white' stroke-width='4'/><path d='M16 4H12V20H16M8 12H2M4 10L2 12L4 14' stroke='black' stroke-width='2'/></svg>") 12 12, w-resize;
762+}
763+.edge.r {
764+ right: 0;
765+ cursor: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke-linecap='round' stroke-linejoin='round'><path d='M8 4H12V20H8M16 12H22M20 10L22 12L20 14' stroke='white' stroke-width='4'/><path d='M8 4H12V20H8M16 12H22M20 10L22 12L20 14' stroke='black' stroke-width='2'/></svg>") 12 12, e-resize;
766+}
760767 .blade .edge { cursor: crosshair; }
761768 .clip .edge:hover, .item .edge:hover { background: rgba(229, 72, 77, .5); }
762769
@@ -755,8 +755,15 @@ function motionState(id: string) {
755 .fx span { padding: 0 6px; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }755 .fx span { padding: 0 6px; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
756 .fx.on { border-color: var(--red); box-shadow: 0 0 0 1.5px var(--red); }756 .fx.on { border-color: var(--red); box-shadow: 0 0 0 1.5px var(--red); }
757 .edge { position: absolute; top: 0; bottom: 0; width: 6px; cursor: ew-resize; z-index: 3; }757 .edge { position: absolute; top: 0; bottom: 0; width: 6px; cursor: ew-resize; z-index: 3; }
758-.edge.l { left: 0; }758+/* comme dans Filmora : [ rogne le début du clip sous la souris, ] sa fin (entre deux clips collés, on voit lequel) */
759-.edge.r { right: 0; }759+.edge.l {
760+ left: 0;
761+ cursor: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke-linecap='round' stroke-linejoin='round'><path d='M16 4H12V20H16M8 12H2M4 10L2 12L4 14' stroke='white' stroke-width='4'/><path d='M16 4H12V20H16M8 12H2M4 10L2 12L4 14' stroke='black' stroke-width='2'/></svg>") 12 12, w-resize;
762+}
763+.edge.r {
764+ right: 0;
765+ cursor: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke-linecap='round' stroke-linejoin='round'><path d='M8 4H12V20H8M16 12H22M20 10L22 12L20 14' stroke='white' stroke-width='4'/><path d='M8 4H12V20H8M16 12H22M20 10L22 12L20 14' stroke='black' stroke-width='2'/></svg>") 12 12, e-resize;
766+}
760 .blade .edge { cursor: crosshair; }767 .blade .edge { cursor: crosshair; }
761 .clip .edge:hover, .item .edge:hover { background: rgba(229, 72, 77, .5); }768 .clip .edge:hover, .item .edge:hover { background: rgba(229, 72, 77, .5); }
762 769