refactor: externalize shared primitives, remove shadcn mixing in tools
Shared components (components/ui/): - slider-row.tsx: SliderRow — label + display value + Slider, replaces inline slider blocks in FileConverter, QROptions - color-input.tsx: ColorInput — color swatch + hex text input pair, replaces repeated inline patterns in QROptions, KeyframeProperties, FaviconGenerator Media tool (FileConverter.tsx): - Remove all shadcn Select/SelectTrigger/SelectContent/SelectItem - Replace with native <select> + selectCls (matches AnimationSettings and all other tools) - Use SliderRow for video/audio bitrate and image quality sliders - Net: -6 shadcn Select trees, consistent with every other tool QROptions.tsx: - Use SliderRow for margin slider (remove raw Slider import) - Use ColorInput for foreground + background color pairs KeyframeProperties.tsx: - Use ColorInput for background color pair (keep local SliderRow which has a different layout with number input) FaviconGenerator.tsx: - Use ColorInput for background + theme color pairs AnimationSettings.tsx: - Remove dead bg-[#1a1a2e] per-option className (global CSS handles select option styling via bg-popover) Delete: - components/media/ConversionOptions.tsx — dead code (no imports), contained the shadcn Label/Input/Select/Slider patterns being replaced Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -127,7 +127,7 @@ export function AnimationSettings({ config, onChange }: Props) {
|
||||
className="w-full bg-transparent border border-border/40 rounded-lg px-3 py-2 text-xs font-mono outline-none focus:border-primary/50 transition-colors text-foreground/80 cursor-pointer"
|
||||
>
|
||||
{EASINGS.map((e) => (
|
||||
<option key={e.value} value={e.value} className="bg-[#1a1a2e]">
|
||||
<option key={e.value} value={e.value}>
|
||||
{e.label}
|
||||
</option>
|
||||
))}
|
||||
|
||||
Reference in New Issue
Block a user