refactor: use Card, CardTitle and CardContent in Figlet and Units apps

This commit is contained in:
2026-02-25 16:00:10 +01:00
parent 4ccf316184
commit 2fb2eaa54c
3 changed files with 141 additions and 143 deletions

View File

@@ -120,34 +120,36 @@ export default function MainConverter() {
<div className="w-full space-y-8">
{/* Quick Access Row */}
<div className="flex flex-col md:flex-row md:items-center gap-4 justify-between bg-card p-4 rounded-lg border">
<div className="flex-1">
<SearchUnits onSelectUnit={handleSearchSelect} />
</div>
<Card>
<CardContent className="flex flex-col md:flex-row md:items-center gap-4 justify-between pt-6">
<div className="flex-1">
<SearchUnits onSelectUnit={handleSearchSelect} />
</div>
<div className="w-full md:w-64 shrink-0">
<Select
value={selectedMeasure}
onValueChange={(value) => setSelectedMeasure(value as Measure)}
>
<SelectTrigger
className="w-full"
style={{
borderLeft: `4px solid ${getCategoryColorHex(selectedMeasure)}`,
}}
<div className="w-full md:w-64 shrink-0">
<Select
value={selectedMeasure}
onValueChange={(value) => setSelectedMeasure(value as Measure)}
>
<SelectValue placeholder="Measure" />
</SelectTrigger>
<SelectContent>
{measures.map((measure) => (
<SelectItem key={measure} value={measure}>
{formatMeasureName(measure)}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
</div>
<SelectTrigger
className="w-full"
style={{
borderLeft: `4px solid ${getCategoryColorHex(selectedMeasure)}`,
}}
>
<SelectValue placeholder="Measure" />
</SelectTrigger>
<SelectContent>
{measures.map((measure) => (
<SelectItem key={measure} value={measure}>
{formatMeasureName(measure)}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
</CardContent>
</Card>
{/* Main Converter Card */}
<Card>