ui: enlarge create form — wider, taller textarea, more padding

This commit is contained in:
Fam Zheng 2026-03-09 10:12:06 +00:00
parent f6517f12c7
commit 3c5180d5eb

View File

@ -107,7 +107,7 @@ function onSubmit() {
v-model="requirement" v-model="requirement"
class="create-textarea" class="create-textarea"
placeholder="描述你想让 AI 做什么..." placeholder="描述你想让 AI 做什么..."
rows="4" rows="10"
@keydown.ctrl.enter="onSubmit" @keydown.ctrl.enter="onSubmit"
@keydown.meta.enter="onSubmit" @keydown.meta.enter="onSubmit"
/> />
@ -123,12 +123,13 @@ function onSubmit() {
.create-form { .create-form {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 12px; gap: 16px;
width: 480px; width: 640px;
max-width: 90vw;
} }
.create-form h2 { .create-form h2 {
font-size: 18px; font-size: 20px;
font-weight: 600; font-weight: 600;
color: var(--text-primary); color: var(--text-primary);
} }
@ -147,8 +148,8 @@ function onSubmit() {
} }
.example-tag { .example-tag {
padding: 4px 10px; padding: 6px 14px;
font-size: 12px; font-size: 13px;
background: var(--bg-tertiary); background: var(--bg-tertiary);
color: var(--text-secondary); color: var(--text-secondary);
border: 1px solid var(--border); border: 1px solid var(--border);
@ -181,16 +182,17 @@ function onSubmit() {
} }
.create-textarea { .create-textarea {
padding: 10px 12px; padding: 14px 16px;
background: var(--bg-secondary); background: var(--bg-secondary);
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: 6px; border-radius: 8px;
color: var(--text-primary); color: var(--text-primary);
font-size: 14px; font-size: 14px;
line-height: 1.6;
font-family: inherit; font-family: inherit;
outline: none; outline: none;
resize: vertical; resize: vertical;
min-height: 80px; min-height: 180px;
} }
.create-textarea:focus { .create-textarea:focus {
@ -211,7 +213,7 @@ function onSubmit() {
.template-select select { .template-select select {
flex: 1; flex: 1;
padding: 6px 8px; padding: 8px 10px;
background: var(--bg-secondary); background: var(--bg-secondary);
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: 6px; border-radius: 6px;
@ -238,7 +240,7 @@ function onSubmit() {
} }
.btn-cancel { .btn-cancel {
padding: 8px 16px; padding: 10px 20px;
background: var(--bg-tertiary); background: var(--bg-tertiary);
color: var(--text-secondary); color: var(--text-secondary);
border: 1px solid var(--border); border: 1px solid var(--border);
@ -247,7 +249,7 @@ function onSubmit() {
} }
.btn-confirm { .btn-confirm {
padding: 8px 16px; padding: 10px 24px;
background: var(--accent); background: var(--accent);
color: var(--bg-primary); color: var(--bg-primary);
border: none; border: none;