From da2ea0da116d66d248d2f69a2e86605d8db55a8c Mon Sep 17 00:00:00 2001
From: Julian Freeman <freemanjulian372@gmail.com>
Date: Mon, 23 Mar 2026 00:05:51 -0400
Subject: [PATCH] optimize timeline ui

---
 src/App.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 7b809f9..f9d814b 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -549,7 +549,7 @@ const handleExport = async () => {
               <span v-if="h > 1" class="absolute -left-11 -top-2.5 text-[10px] font-bold text-[#86868B]">{{ String((h - 1 + 3) % 24).padStart(2, '0') }}:00</span>
             </div>
             <div v-for="ev in dayEvents" :key="ev.id" 
-              class="absolute left-0 w-[45%] opacity-80 border-l-4 transition-all duration-200 cursor-pointer hover:opacity-100 hover:border-l-[6px] hover:z-50 hover:brightness-110" 
+              class="absolute left-0 w-[45%] opacity-80 border-l-4 cursor-pointer hover:opacity-100 hover:border-l-[6px] hover:z-50 hover:brightness-110" 
               :style="{ top: ev.start_minute * timelineZoom + 'px', height: (ev.end_minute - ev.start_minute) * timelineZoom + 'px', backgroundColor: getTagColor(ev.main_tag_id) + '22', borderColor: getTagColor(ev.main_tag_id) }" 
               @mouseenter="handleEventMouseEnter(ev, $event)"
               @mousemove="handleEventMouseMove"
@@ -557,7 +557,6 @@ const handleExport = async () => {
               @click.stop="editingEvent = { ...ev }; isEventModalOpen = true">
             </div>
             <div v-for="img in timelineImages" :key="img.path" class="absolute left-[50%] right-2 h-0.5 bg-[#007AFF]/20 rounded-full" :class="[selectedImage?.path === img.path ? 'bg-[#007AFF]/60 h-1 z-10' : '', lockedImage?.path === img.path ? 'bg-[#007AFF] h-1.5 ring-2 ring-[#007AFF]/20 z-20' : '']" :style="{ top: timeToLogicalMinutes(img.time, img.isNextDay) * timelineZoom + 'px' }"></div>
-            <div v-if="dragStartMin !== null && dragEndMin !== null" class="absolute left-0 w-full bg-[#007AFF]/10 border-y-2 border-[#007AFF] pointer-events-none z-30" :style="{ top: Math.min(dragStartMin, dragEndMin) * timelineZoom + 'px', height: Math.abs(dragEndMin - dragStartMin) * timelineZoom + 'px' }"></div>
             <div v-if="hoveredTime" class="absolute left-0 right-0 border-t-2 border-[#007AFF] z-40 pointer-events-none" :style="{ top: timeToLogicalMinutes(hoveredTime, hoveredTime < '03:00') * timelineZoom + 'px' }"><div class="absolute -left-12 -top-3 bg-[#007AFF] text-white text-[9px] px-1 py-0.5 rounded font-bold">{{ hoveredTime }}</div></div>
             <div v-if="currentLogicalMinute >= 0" class="absolute left-0 right-0 border-t-2 border-[#FF3B30] z-30 pointer-events-none" :style="{ top: currentLogicalMinute * timelineZoom + 'px' }"><div class="absolute -left-12 -top-2.5 bg-[#FF3B30] text-white text-[9px] px-1 py-0.5 rounded font-bold shadow-[0_0_8px_rgba(255,59,48,0.5)]">{{ logicalMinutesToTime(currentLogicalMinute) }}</div></div>
           </div>