style: improve light theme border and input visibility
This commit is contained in:
@@ -57,9 +57,9 @@ export function FontPreview({ text, font, isLoading, onCopy, onDownload, onShare
|
||||
};
|
||||
return (
|
||||
<Card className={cn('relative', className)}>
|
||||
<CardHeader className="flex flex-row items-center justify-between flex-wrap gap-2 space-y-0">
|
||||
<CardHeader className="flex flex-row items-center justify-between flex-wrap gap-2">
|
||||
<div className="flex items-center gap-2">
|
||||
<CardTitle className="text-sm font-medium">Preview</CardTitle>
|
||||
<CardTitle>Preview</CardTitle>
|
||||
{font && (
|
||||
<span className="text-xs px-2 py-0.5 bg-primary/10 text-primary rounded-md font-mono">
|
||||
{font}
|
||||
|
||||
@@ -93,8 +93,8 @@ export function FontSelector({
|
||||
|
||||
return (
|
||||
<Card className={cn("flex flex-col min-h-0 overflow-hidden", className)}>
|
||||
<CardHeader className="flex flex-row items-center justify-between shrink-0 space-y-0">
|
||||
<CardTitle className="text-sm font-medium">Select Font</CardTitle>
|
||||
<CardHeader className="flex flex-row items-center justify-between flex-wrap gap-2 space-y-0">
|
||||
<CardTitle>Select Font</CardTitle>
|
||||
{onRandomFont && (
|
||||
<Button
|
||||
variant="outline"
|
||||
|
||||
@@ -121,7 +121,7 @@ export default function MainConverter() {
|
||||
|
||||
{/* Quick Access Row */}
|
||||
<Card>
|
||||
<CardContent className="flex flex-col md:flex-row md:items-center gap-4 justify-between pt-6">
|
||||
<CardContent className="flex flex-col md:flex-row md:items-center gap-4 justify-between">
|
||||
<div className="flex-1">
|
||||
<SearchUnits onSelectUnit={handleSearchSelect} />
|
||||
</div>
|
||||
@@ -156,7 +156,7 @@ export default function MainConverter() {
|
||||
<CardHeader>
|
||||
<CardTitle>Convert {formatMeasureName(selectedMeasure)}</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-6 pt-0">
|
||||
<CardContent className="space-y-6">
|
||||
{/* Input row, stacks vertically on mobile, horizontal on desktop */}
|
||||
<div className="flex flex-col gap-4 md:flex-row md:items-end md:gap-2">
|
||||
{/* Value Input */}
|
||||
|
||||
Reference in New Issue
Block a user