valknar/kit-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: remove duplicate className attribute in AnimationSettings cubic-bezier labels

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Sebastian Krüger
2026-02-28 17:35:57 +01:00
parent d0e8ae322f
commit 0f5e67a007
1 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
components/animate/AnimationSettings.tsx
View File

@@ -81,7 +81,7 @@ export function AnimationSettings({ config, onChange }: Props) {
step={50} step={50}
value={config.duration} value={config.duration}
onChange={(e) => set('duration', Math.max(50, Number(e.target.value)))} onChange={(e) => set('duration', Math.max(50, Number(e.target.value)))}
className="text-xs"
/> />
<span className="text-xs text-muted-foreground shrink-0">ms</span> <span className="text-xs text-muted-foreground shrink-0">ms</span>
</div> </div>
@@ -96,7 +96,7 @@ export function AnimationSettings({ config, onChange }: Props) {
step={50} step={50}
value={config.delay} value={config.delay}
onChange={(e) => set('delay', Math.max(0, Number(e.target.value)))} onChange={(e) => set('delay', Math.max(0, Number(e.target.value)))}
className="text-xs"
/> />
<span className="text-xs text-muted-foreground shrink-0">ms</span> <span className="text-xs text-muted-foreground shrink-0">ms</span>
</div> </div>
@@ -116,12 +116,12 @@ export function AnimationSettings({ config, onChange }: Props) {
} }
}} }}
> >
<SelectTrigger className="text-xs"> <SelectTrigger className="w-full">
<SelectValue /> <SelectValue />
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>
{EASINGS.map((e) => ( {EASINGS.map((e) => (
<SelectItem key={e.value} value={e.value} className="text-xs"> <SelectItem key={e.value} value={e.value}>
{e.label} {e.label}
</SelectItem> </SelectItem>
))} ))}
@@ -183,14 +183,14 @@ export function AnimationSettings({ config, onChange }: Props) {
<div className="space-y-1.5"> <div className="space-y-1.5">
<Label className="text-xs">Direction</Label> <Label className="text-xs">Direction</Label>
<Select value={config.direction} onValueChange={(v) => set('direction', v as AnimationConfig['direction'])}> <Select value={config.direction} onValueChange={(v) => set('direction', v as AnimationConfig['direction'])}>
<SelectTrigger className="text-xs"> <SelectTrigger className="w-full">
<SelectValue /> <SelectValue />
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>
<SelectItem value="normal" className="text-xs">Normal</SelectItem> <SelectItem value="normal">Normal</SelectItem>
<SelectItem value="reverse" className="text-xs">Reverse</SelectItem> <SelectItem value="reverse">Reverse</SelectItem>
<SelectItem value="alternate" className="text-xs">Alternate</SelectItem> <SelectItem value="alternate">Alternate</SelectItem>
<SelectItem value="alternate-reverse" className="text-xs">Alternate Reverse</SelectItem> <SelectItem value="alternate-reverse">Alternate Reverse</SelectItem>
</SelectContent> </SelectContent>
</Select> </Select>
</div> </div>
@@ -199,14 +199,14 @@ export function AnimationSettings({ config, onChange }: Props) {
<div className="space-y-1.5"> <div className="space-y-1.5">
<Label className="text-xs">Fill Mode</Label> <Label className="text-xs">Fill Mode</Label>
<Select value={config.fillMode} onValueChange={(v) => set('fillMode', v as AnimationConfig['fillMode'])}> <Select value={config.fillMode} onValueChange={(v) => set('fillMode', v as AnimationConfig['fillMode'])}>
<SelectTrigger className="text-xs"> <SelectTrigger className="w-full">
<SelectValue /> <SelectValue />
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>
<SelectItem value="none" className="text-xs">None</SelectItem> <SelectItem value="none">None</SelectItem>
<SelectItem value="forwards" className="text-xs">Forwards</SelectItem> <SelectItem value="forwards">Forwards</SelectItem>
<SelectItem value="backwards" className="text-xs">Backwards</SelectItem> <SelectItem value="backwards">Backwards</SelectItem>
<SelectItem value="both" className="text-xs">Both</SelectItem> <SelectItem value="both">Both</SelectItem>
</SelectContent> </SelectContent>
</Select> </Select>
</div> </div>