- 基于 grill-me Q1-Q61 决策 - Vitest 测试与 CI workflow - middleware: parseFilters 核心实现 - component: Vue3 TransForm 基础组件 + Storybook Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -0,0 +1,81 @@
|
||||
:root {
|
||||
--tf-gap: 8px;
|
||||
--tf-border: #d0d7de;
|
||||
--tf-radius: 6px;
|
||||
--tf-label-color: #57606a;
|
||||
--tf-bg: #ffffff;
|
||||
--tf-unknown-bg: #f6f8fa;
|
||||
--tf-unknown-color: #8c959f;
|
||||
}
|
||||
|
||||
.tf-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--tf-gap);
|
||||
}
|
||||
|
||||
.tf-row {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(12, 1fr);
|
||||
gap: var(--tf-gap);
|
||||
}
|
||||
|
||||
.tf-field {
|
||||
display: grid;
|
||||
grid-template-columns: subgrid;
|
||||
grid-column: span var(--tf-span, 12);
|
||||
align-items: center;
|
||||
gap: var(--tf-gap);
|
||||
}
|
||||
|
||||
.tf-field-inner {
|
||||
display: grid;
|
||||
grid-template-columns: var(--tf-name-cols, 3fr) var(--tf-query-cols, 2fr) var(--tf-value-cols, 7fr);
|
||||
gap: var(--tf-gap);
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.tf-label {
|
||||
color: var(--tf-label-color);
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.tf-control {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid var(--tf-border);
|
||||
border-radius: var(--tf-radius);
|
||||
padding: 6px 8px;
|
||||
background: var(--tf-bg);
|
||||
}
|
||||
|
||||
.tf-control:disabled,
|
||||
.tf-control[readonly] {
|
||||
opacity: 0.65;
|
||||
}
|
||||
|
||||
.tf-unknown {
|
||||
border: 1px dashed var(--tf-border);
|
||||
background: var(--tf-unknown-bg);
|
||||
color: var(--tf-unknown-color);
|
||||
border-radius: var(--tf-radius);
|
||||
padding: 8px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.tf-actions {
|
||||
display: flex;
|
||||
gap: var(--tf-gap);
|
||||
}
|
||||
|
||||
.tf-btn {
|
||||
border: 1px solid var(--tf-border);
|
||||
background: var(--tf-bg);
|
||||
border-radius: var(--tf-radius);
|
||||
padding: 6px 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tf-btn:hover {
|
||||
background: #f6f8fa;
|
||||
}
|
||||
Reference in New Issue
Block a user