From 6786ad739a0def43ed77ba3957442fbfad715ab7 Mon Sep 17 00:00:00 2001
From: th <th@skilleven.de>
Date: Mon, 20 Apr 2026 14:19:27 +0200
Subject: [PATCH] 0.5.4: scrub head tapers into the playhead needle

Pentagon clip-path on the scrub handle head (flat top, straight sides
down to 55% height, triangle point at the bottom center) so the head
visually funnels into the 1px playhead needle below. box-shadow
replaced with a drop-shadow filter that respects the clip-path.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 package.json                | 2 +-
 src/components/Timeline.vue | 8 ++++----
 src/version.ts              | 2 +-
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/package.json b/package.json
index a1e7cf6..c90e3e3 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "animatr",
   "private": true,
-  "version": "0.5.3",
+  "version": "0.5.4",
   "type": "module",
   "scripts": {
     "dev": "vite",
diff --git a/src/components/Timeline.vue b/src/components/Timeline.vue
index 6c19301..2721bef 100644
--- a/src/components/Timeline.vue
+++ b/src/components/Timeline.vue
@@ -2186,12 +2186,12 @@ onBeforeUnmount(() => {
 }
 
 .scrub-handle-head {
-  width: 12px;
-  height: 14px;
+  width: 14px;
+  height: 18px;
   background: var(--accent);
-  border-radius: 2px;
   margin-top: 2px;
-  box-shadow: 0 0 0 1px var(--panel), 0 2px 6px rgba(0, 0, 0, 0.4);
+  clip-path: polygon(0 0, 100% 0, 100% 55%, 50% 100%, 0 55%);
+  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.5));
 }
 
 .scrub-handle-line {
diff --git a/src/version.ts b/src/version.ts
index 238bd93..6ad44a9 100644
--- a/src/version.ts
+++ b/src/version.ts
@@ -1,2 +1,2 @@
-export const APP_VERSION = '0.5.3'
+export const APP_VERSION = '0.5.4'
 export const APP_NAME = 'RUWIO'