pascallinxweiler/Webify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[dyad] Adding a presets dropdown to settings - wrote 2 file(s)

Browse Source
This commit is contained in:
[dyad]
2026-01-19 08:11:45 +01:00
parent c208fabcb9
commit d39ddd0540
2 changed files with 116 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

94
src/components/settings-panel.tsx
View File

@@ -5,6 +5,7 @@ import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@/
import { ImageSettings } from "./settings/image-settings";
import { FilenameSettings } from "./settings/filename-settings";
import { QualitySettings } from "./settings/quality-settings";
import { PresetSettings } from "./settings/preset-settings";
interface SettingsPanelProps {
settings: ConversionSettings;
@@ -24,52 +25,55 @@ export function SettingsPanel({
hasImages,
}: SettingsPanelProps) {
return (
<Accordion type="single" collapsible defaultValue="image-settings" className="w-full space-y-4">
<AccordionItem value="image-settings" className="border rounded-lg bg-card">
<AccordionTrigger className="p-6 hover:no-underline">
<div className="text-left">
<h3 className="text-lg font-medium leading-none">Bildeinstellungen</h3>
<p className="text-sm text-muted-foreground mt-1">Auflösung und Skalierung für alle Bilder anpassen.</p>
</div>
</AccordionTrigger>
<AccordionContent className="px-6 pb-6">
<ImageSettings
settings={settings}
onSettingsChange={onSettingsChange}
onAspectRatioChange={onAspectRatioChange}
onSwapDimensions={onSwapDimensions}
/>
</AccordionContent>
</AccordionItem>
<div className="space-y-4">
<PresetSettings onSettingsChange={onSettingsChange} />
<Accordion type="single" collapsible defaultValue="image-settings" className="w-full space-y-4">
<AccordionItem value="image-settings" className="border rounded-lg bg-card">
<AccordionTrigger className="p-6 hover:no-underline">
<div className="text-left">
<h3 className="text-lg font-medium leading-none">Bildeinstellungen</h3>
<p className="text-sm text-muted-foreground mt-1">Auflösung und Skalierung für alle Bilder anpassen.</p>
</div>
</AccordionTrigger>
<AccordionContent className="px-6 pb-6">
<ImageSettings
settings={settings}
onSettingsChange={onSettingsChange}
onAspectRatioChange={onAspectRatioChange}
onSwapDimensions={onSwapDimensions}
/>
</AccordionContent>
</AccordionItem>
<AccordionItem value="filename-settings" className="border rounded-lg bg-card">
<AccordionTrigger className="p-6 hover:no-underline">
<div className="text-left">
<h3 className="text-lg font-medium leading-none">Dateinameneinstellungen</h3>
<p className="text-sm text-muted-foreground mt-1">Die Ausgabe-Dateinamen anpassen.</p>
</div>
</AccordionTrigger>
<AccordionContent className="px-6 pb-6">
<FilenameSettings
settings={settings}
onSettingsChange={onSettingsChange}
onApplyDefaultBaseNameToAll={onApplyDefaultBaseNameToAll}
hasImages={hasImages}
/>
</AccordionContent>
</AccordionItem>
<AccordionItem value="filename-settings" className="border rounded-lg bg-card">
<AccordionTrigger className="p-6 hover:no-underline">
<div className="text-left">
<h3 className="text-lg font-medium leading-none">Dateinameneinstellungen</h3>
<p className="text-sm text-muted-foreground mt-1">Die Ausgabe-Dateinamen anpassen.</p>
</div>
</AccordionTrigger>
<AccordionContent className="px-6 pb-6">
<FilenameSettings
settings={settings}
onSettingsChange={onSettingsChange}
onApplyDefaultBaseNameToAll={onApplyDefaultBaseNameToAll}
hasImages={hasImages}
/>
</AccordionContent>
</AccordionItem>
<AccordionItem value="quality-settings" className="border rounded-lg bg-card">
<AccordionTrigger className="p-6 hover:no-underline">
<div className="text-left">
<h3 className="text-lg font-medium leading-none">Qualitätseinstellungen</h3>
<p className="text-sm text-muted-foreground mt-1">Format und Komprimierungsstufe auswählen.</p>
</div>
</AccordionTrigger>
<AccordionContent className="px-6 pb-6">
<QualitySettings settings={settings} onSettingsChange={onSettingsChange} />
</AccordionContent>
</AccordionItem>
</Accordion>
<AccordionItem value="quality-settings" className="border rounded-lg bg-card">
<AccordionTrigger className="p-6 hover:no-underline">
<div className="text-left">
<h3 className="text-lg font-medium leading-none">Qualitätseinstellungen</h3>
<p className="text-sm text-muted-foreground mt-1">Format und Komprimierungsstufe auswählen.</p>
</div>
</AccordionTrigger>
<AccordionContent className="px-6 pb-6">
<QualitySettings settings={settings} onSettingsChange={onSettingsChange} />
</AccordionContent>
</AccordionItem>
</Accordion>
</div>
);
}