fix: prevent user select text

Author: jrafaaael

src/routes/[id]/+page.svelte

@@ -93,7 +93,7 @@
 				class="h-12 px-4 border-b-2 border-b-white/5 flex justify-center items-center gap-12 relative"
 			>
 				<span
-					class="tabular-nums"
+					class="tabular-nums select-none"
 					title={secondsToTime($videoStatus.currentTime, { showMilliseconds: true })}
 				>
 					{secondsToTime(Math.floor($videoStatus.currentTime))}
@@ -105,7 +105,7 @@
 					}}
 				/>
 				<span
-					class="text-white/50 tabular-nums"
+					class="text-white/50 tabular-nums select-none"
 					title={secondsToTime($recording?.duration ?? 0, { showMilliseconds: true })}
 				>
 					{secondsToTime(Math.floor($recording?.duration ?? 0))}

src/routes/[id]/components/timeline.svelte

@@ -32,7 +32,7 @@
 	{#each seconds as num}
 		{#if num % INDICATORS_PER_DURATION[indicator].big === 0}
 			<div class="flex flex-col items-center relative z-10">
-				<span class="text-xs text-white/40 absolute -top-4">
+				<span class="text-xs text-white/40 absolute -top-4 select-none">
 					{secondsToTime(num)}
 				</span>
 				<div class="w-0.5 h-4 bg-white/20 translate-y-1/2" />

src/routes/[id]/components/trimmer.svelte

@@ -70,7 +70,7 @@
 		class="w-[12px] h-[75%] bg-blue-900 rounded-l-md flex justify-center items-center relative"
 	>
 		<output
-			class="py-1 px-2 bg-neutral-300 rounded-md text-neutral-800 text-xs hidden absolute top-0 left-1/2 z-20 -translate-y-9 -translate-x-1/2 tabular-nums group-active:block"
+			class="py-1 px-2 bg-neutral-300 rounded-md text-neutral-800 text-xs hidden absolute top-0 left-1/2 z-20 -translate-y-9 -translate-x-1/2 tabular-nums select-none group-active:block"
 		>
 			{secondsToTime($edits.startAt, { showMilliseconds: true })}
 		</output>
@@ -81,7 +81,7 @@
 		class="w-[12px] h-[75%] bg-blue-900 rounded-r-md flex justify-center items-center relative"
 	>
 		<output
-			class="py-1 px-2 bg-neutral-300 rounded-md text-neutral-800 text-xs hidden absolute top-0 left-1/2 z-20 -translate-y-9 -translate-x-1/2 tabular-nums group-active:block"
+			class="py-1 px-2 bg-neutral-300 rounded-md text-neutral-800 text-xs hidden absolute top-0 left-1/2 z-20 -translate-y-9 -translate-x-1/2 tabular-nums select-none group-active:block"
 		>
 			{secondsToTime($edits.endAt, { showMilliseconds: true })}
 		</output>

src/routes/[id]/components/zoom-list.svelte

@@ -146,7 +146,7 @@
 				class="w-[12px] h-[75%] bg-emerald-900 rounded-l-md flex justify-center items-center relative"
 			>
 				<output
-					class="py-1 px-2 bg-neutral-300 rounded-md text-neutral-800 text-xs hidden absolute top-0 left-1/2 z-20 -translate-y-9 -translate-x-1/2 tabular-nums group-active:block"
+					class="py-1 px-2 bg-neutral-300 rounded-md text-neutral-800 text-xs hidden absolute top-0 left-1/2 z-20 -translate-y-9 -translate-x-1/2 tabular-nums select-none group-active:block"
 				>
 					{secondsToTime(zoom.start, { showMilliseconds: true })}
 				</output>
@@ -157,7 +157,7 @@
 				class="w-[12px] h-[75%] bg-emerald-900 rounded-r-md flex justify-center items-center relative"
 			>
 				<output
-					class="py-1 px-2 bg-neutral-300 rounded-md text-neutral-800 text-xs hidden absolute top-0 left-1/2 z-20 -translate-y-9 -translate-x-1/2 tabular-nums group-active:block"
+					class="py-1 px-2 bg-neutral-300 rounded-md text-neutral-800 text-xs hidden absolute top-0 left-1/2 z-20 -translate-y-9 -translate-x-1/2 tabular-nums select-none group-active:block"
 				>
 					{secondsToTime(zoom.end, { showMilliseconds: true })}
 				</output>