Fit image parameter select labels
This commit is contained in:
@@ -615,11 +615,11 @@ export function ImageToImagePanel() {
|
||||
</div>
|
||||
|
||||
{/* Image Params */}
|
||||
<div className="grid grid-cols-2 gap-x-4 gap-y-3 lg:grid-cols-4">
|
||||
<div className="grid grid-cols-2 gap-x-3 gap-y-3 lg:grid-cols-[minmax(7.75rem,1.2fr)_minmax(5.75rem,0.9fr)_minmax(5.75rem,0.9fr)_minmax(5.75rem,0.9fr)]">
|
||||
<div className="min-w-0 space-y-2">
|
||||
<Label>画面比例</Label>
|
||||
<Select value={aspectRatio} onValueChange={setAspectRatio}>
|
||||
<SelectTrigger className="w-full min-w-0"><SelectValue /></SelectTrigger>
|
||||
<SelectTrigger className="w-full min-w-0 gap-1.5 px-3 [&_svg]:size-4"><SelectValue /></SelectTrigger>
|
||||
<SelectContent>
|
||||
{IMG2IMG_ASPECT_RATIOS.map(ar => (
|
||||
<SelectItem key={ar.value} value={ar.value}>{ar.label}</SelectItem>
|
||||
@@ -630,7 +630,7 @@ export function ImageToImagePanel() {
|
||||
<div className="min-w-0 space-y-2">
|
||||
<Label>分辨率</Label>
|
||||
<Select value={resolution} onValueChange={setResolution}>
|
||||
<SelectTrigger className="w-full min-w-0"><SelectValue /></SelectTrigger>
|
||||
<SelectTrigger className="w-full min-w-0 gap-1.5 px-3 [&_svg]:size-4"><SelectValue /></SelectTrigger>
|
||||
<SelectContent>
|
||||
{RESOLUTION_OPTIONS.map(r => (
|
||||
<SelectItem key={r.value} value={r.value}>{r.label}</SelectItem>
|
||||
@@ -641,7 +641,7 @@ export function ImageToImagePanel() {
|
||||
<div className="min-w-0 space-y-2">
|
||||
<Label>图片格式</Label>
|
||||
<Select value={outputFormat} onValueChange={v => setOutputFormat(v as ImageOutputFormat)}>
|
||||
<SelectTrigger className="w-full min-w-0"><SelectValue /></SelectTrigger>
|
||||
<SelectTrigger className="w-full min-w-0 gap-1.5 px-3 [&_svg]:size-4"><SelectValue /></SelectTrigger>
|
||||
<SelectContent>
|
||||
{IMAGE_OUTPUT_FORMAT_OPTIONS.map(format => (
|
||||
<SelectItem key={format.value} value={format.value}>{format.label}</SelectItem>
|
||||
@@ -652,7 +652,7 @@ export function ImageToImagePanel() {
|
||||
<div className="min-w-0 space-y-2">
|
||||
<Label>质量</Label>
|
||||
<Select value={imageQuality} onValueChange={v => setImageQuality(v as ImageQuality)}>
|
||||
<SelectTrigger className="w-full min-w-0"><SelectValue /></SelectTrigger>
|
||||
<SelectTrigger className="w-full min-w-0 gap-1.5 px-3 [&_svg]:size-4"><SelectValue /></SelectTrigger>
|
||||
<SelectContent>
|
||||
{IMAGE_QUALITY_OPTIONS.map(option => (
|
||||
<SelectItem key={option.value} value={option.value}>{option.label}</SelectItem>
|
||||
|
||||
@@ -479,11 +479,11 @@ export function TextToImagePanel() {
|
||||
</div>
|
||||
|
||||
{/* Image Params */}
|
||||
<div className="grid grid-cols-2 gap-x-4 gap-y-3 lg:grid-cols-4">
|
||||
<div className="grid grid-cols-2 gap-x-3 gap-y-3 lg:grid-cols-[minmax(7.75rem,1.2fr)_minmax(5.75rem,0.9fr)_minmax(5.75rem,0.9fr)_minmax(5.75rem,0.9fr)]">
|
||||
<div className="min-w-0 space-y-2">
|
||||
<Label>画面比例</Label>
|
||||
<Select value={aspectRatio} onValueChange={setAspectRatio}>
|
||||
<SelectTrigger className="w-full min-w-0"><SelectValue /></SelectTrigger>
|
||||
<SelectTrigger className="w-full min-w-0 gap-1.5 px-3 [&_svg]:size-4"><SelectValue /></SelectTrigger>
|
||||
<SelectContent>
|
||||
{ASPECT_RATIOS.map(ar => (
|
||||
<SelectItem key={ar.value} value={ar.value}>{ar.label}</SelectItem>
|
||||
@@ -494,7 +494,7 @@ export function TextToImagePanel() {
|
||||
<div className="min-w-0 space-y-2">
|
||||
<Label>分辨率</Label>
|
||||
<Select value={resolution} onValueChange={setResolution}>
|
||||
<SelectTrigger className="w-full min-w-0"><SelectValue /></SelectTrigger>
|
||||
<SelectTrigger className="w-full min-w-0 gap-1.5 px-3 [&_svg]:size-4"><SelectValue /></SelectTrigger>
|
||||
<SelectContent>
|
||||
{RESOLUTION_OPTIONS.map(r => (
|
||||
<SelectItem key={r.value} value={r.value}>{r.label}</SelectItem>
|
||||
@@ -505,7 +505,7 @@ export function TextToImagePanel() {
|
||||
<div className="min-w-0 space-y-2">
|
||||
<Label>图片格式</Label>
|
||||
<Select value={outputFormat} onValueChange={v => setOutputFormat(v as ImageOutputFormat)}>
|
||||
<SelectTrigger className="w-full min-w-0"><SelectValue /></SelectTrigger>
|
||||
<SelectTrigger className="w-full min-w-0 gap-1.5 px-3 [&_svg]:size-4"><SelectValue /></SelectTrigger>
|
||||
<SelectContent>
|
||||
{IMAGE_OUTPUT_FORMAT_OPTIONS.map(format => (
|
||||
<SelectItem key={format.value} value={format.value}>{format.label}</SelectItem>
|
||||
@@ -516,7 +516,7 @@ export function TextToImagePanel() {
|
||||
<div className="min-w-0 space-y-2">
|
||||
<Label>质量</Label>
|
||||
<Select value={imageQuality} onValueChange={v => setImageQuality(v as ImageQuality)}>
|
||||
<SelectTrigger className="w-full min-w-0"><SelectValue /></SelectTrigger>
|
||||
<SelectTrigger className="w-full min-w-0 gap-1.5 px-3 [&_svg]:size-4"><SelectValue /></SelectTrigger>
|
||||
<SelectContent>
|
||||
{IMAGE_QUALITY_OPTIONS.map(option => (
|
||||
<SelectItem key={option.value} value={option.value}>{option.label}</SelectItem>
|
||||
|
||||
Reference in New Issue
Block a user