refactor: replace html range input with shadcn slider in batch operations

This commit is contained in:
2026-02-25 18:18:03 +01:00
parent 7eeb8399b3
commit f28a2d1eab

View File

@@ -11,6 +11,7 @@ import {
} from '@/components/ui/select'; } from '@/components/ui/select';
import { Input } from '@/components/ui/input'; import { Input } from '@/components/ui/input';
import { Textarea } from '@/components/ui/textarea'; import { Textarea } from '@/components/ui/textarea';
import { Slider } from '@/components/ui/slider';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { PaletteGrid } from '@/components/pastel/PaletteGrid'; import { PaletteGrid } from '@/components/pastel/PaletteGrid';
import { ExportMenu } from '@/components/pastel/ExportMenu'; import { ExportMenu } from '@/components/pastel/ExportMenu';
@@ -143,17 +144,21 @@ export default function BatchPage() {
</SelectContent> </SelectContent>
</Select> </Select>
<div> <div className="space-y-4 pt-2">
<label className="text-sm font-medium mb-2 block"> <div className="flex items-center justify-between">
Amount: {operation === 'rotate' ? (amount * 360).toFixed(0) + '°' : (amount * 100).toFixed(0) + '%'} <label className="text-sm font-medium">
Amount
</label> </label>
<Input <span className="text-xs text-muted-foreground">
type="range" {operation === 'rotate' ? (amount * 360).toFixed(0) + '°' : (amount * 100).toFixed(0) + '%'}
min="0" </span>
max="1" </div>
step="0.01" <Slider
value={amount} min={0}
onChange={(e) => setAmount(parseFloat(e.target.value))} max={1}
step={0.01}
value={[amount]}
onValueChange={(vals) => setAmount(vals[0])}
/> />
</div> </div>