feat(ui): fix thumbnail size slider direction and add step buttons

frontend/src/lib/components/DensityControl.svelte

@@ -1,19 +1,34 @@
 <script lang="ts">
 	import Icon from './Icon.svelte';
-	import { density } from '$lib/stores/density.svelte';
+	import IconButton from './IconButton.svelte';
+	import { density, DENSITY_MIN, DENSITY_MAX } from '$lib/stores/density.svelte';
 </script>
 
 <div class="flex items-center gap-2">
 	<Icon name="grid_view" class="text-text-subtle size-4" />
+	<IconButton
+		name="density_small"
+		label="Уменьшить миниатюры"
+		disabled={density.size <= DENSITY_MIN}
+		onclick={() => density.stepSize(-1)}
+		class="size-7"
+	/>
 	<input
 		type="range"
-		min="2"
-		max="8"
+		min={DENSITY_MIN}
+		max={DENSITY_MAX}
 		step="1"
-		value={density.cols}
-		oninput={(e) => density.set(Number(e.currentTarget.value))}
+		value={density.size}
+		oninput={(e) => density.setSize(Number(e.currentTarget.value))}
 		class="accent-primary h-1 w-24 cursor-pointer"
 		aria-label="Размер миниатюр"
 		title="Размер миниатюр"
 	/>
+	<IconButton
+		name="density_large"
+		label="Увеличить миниатюры"
+		disabled={density.size >= DENSITY_MAX}
+		onclick={() => density.stepSize(1)}
+		class="size-7"
+	/>
 </div>