Spaces:
Running
Running
Download css/prefs-ui.css from hongcoding/perch-design: direct link, hf CLI and curl.
- Browser
- Download file 3.31 kB
-
https://huggingface.co/spaces/hongcoding/perch-design/resolve/main/css/prefs-ui.css
- Command line
-
hf download hf://spaces/hongcoding/perch-design/css/prefs-ui.css
-
curl -L -o prefs-ui.css https://huggingface.co/spaces/hongcoding/perch-design/resolve/main/css/prefs-ui.css
3.31 kB
| /* 模型偏好分组(契约 14A)的控件样式——只用 theme.css 的色彩令牌, | |
| 不硬编码任何颜色;风格对齐设置页其余分组(Warm Paper)。 */ | |
| /* 顶部「MiMo 预置建议」一键应用条 */ | |
| .mp-preset { | |
| display: flex; | |
| align-items: center; | |
| justify-content: space-between; | |
| gap: 16px; | |
| padding: 12px 0; | |
| border-top: 1px solid var(--border); | |
| } | |
| .mp-preset-text { | |
| min-width: 0; | |
| } | |
| .mp-preset-label { | |
| font-weight: 500; | |
| color: var(--text); | |
| } | |
| .mp-preset-hint { | |
| margin: 2px 0 0; | |
| font-size: 12.5px; | |
| color: var(--text-tertiary); | |
| line-height: 1.5; | |
| } | |
| .mp-preset-btn { | |
| appearance: none; | |
| border: 1px solid var(--accent); | |
| background: var(--accent); | |
| color: var(--bg); | |
| font: inherit; | |
| font-size: 13px; | |
| line-height: 1; | |
| padding: 8px 14px; | |
| border-radius: var(--radius-control); | |
| cursor: pointer; | |
| flex-shrink: 0; | |
| transition: opacity var(--dur) var(--ease); | |
| } | |
| .mp-preset-btn:hover { | |
| opacity: 0.9; | |
| } | |
| .mp-preset-btn:disabled { | |
| opacity: 0.5; | |
| cursor: not-allowed; | |
| } | |
| .mp-preset-btn:focus-visible { | |
| outline: 2px solid var(--accent); | |
| outline-offset: 1px; | |
| } | |
| /* 模型行列表 */ | |
| .mp-list { | |
| margin-top: 4px; | |
| } | |
| .mp-row { | |
| display: flex; | |
| align-items: center; | |
| gap: 16px; | |
| padding: 12px 0; | |
| border-top: 1px solid var(--border); | |
| flex-wrap: wrap; | |
| } | |
| .mp-row:first-child { | |
| border-top: none; | |
| } | |
| .mp-row-text { | |
| min-width: 0; | |
| flex: 1 1 180px; | |
| } | |
| .mp-row-name { | |
| display: flex; | |
| align-items: center; | |
| gap: 8px; | |
| font-weight: 500; | |
| color: var(--text); | |
| } | |
| .mp-row-id { | |
| margin: 2px 0 0; | |
| font-size: 12px; | |
| color: var(--text-tertiary); | |
| font-family: var(--font-mono); | |
| overflow: hidden; | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| } | |
| /* 云 / 本机 徽章 */ | |
| .mp-badge { | |
| font-size: 11px; | |
| line-height: 1; | |
| padding: 3px 7px; | |
| border-radius: var(--radius-chip); | |
| flex-shrink: 0; | |
| } | |
| .mp-badge.is-cloud { | |
| background: var(--accent-soft); | |
| color: var(--accent); | |
| } | |
| .mp-badge.is-local { | |
| background: var(--bg-sunken); | |
| color: var(--text-secondary); | |
| border: 1px solid var(--border); | |
| } | |
| /* 单个控件(思考档下拉 / 最大回复长度输入) */ | |
| .mp-field { | |
| display: flex; | |
| flex-direction: column; | |
| gap: 4px; | |
| flex-shrink: 0; | |
| } | |
| .mp-field-label { | |
| font-size: 12px; | |
| color: var(--text-secondary); | |
| } | |
| .mp-select { | |
| appearance: none; | |
| border: 1px solid var(--border); | |
| background: var(--bg); | |
| color: var(--text); | |
| font: inherit; | |
| font-size: 13px; | |
| padding: 7px 10px; | |
| border-radius: var(--radius-control); | |
| min-width: 92px; | |
| cursor: pointer; | |
| } | |
| .mp-select:focus-visible { | |
| outline: 2px solid var(--accent); | |
| outline-offset: 1px; | |
| } | |
| .mp-number { | |
| border: 1px solid var(--border); | |
| background: var(--bg); | |
| color: var(--text); | |
| font: inherit; | |
| font-size: 13px; | |
| padding: 7px 10px; | |
| border-radius: var(--radius-control); | |
| width: 130px; | |
| } | |
| .mp-number.is-invalid { | |
| border-color: var(--danger); | |
| } | |
| .mp-number:focus-visible { | |
| outline: 2px solid var(--accent); | |
| outline-offset: 1px; | |
| } | |
| .mp-number.is-invalid:focus-visible { | |
| outline-color: var(--danger); | |
| } | |
| .mp-field-error { | |
| margin: 0; | |
| font-size: 12px; | |
| color: var(--danger); | |
| line-height: 1.4; | |
| max-width: 220px; | |
| } | |
| /* 操作反馈(一键应用结果) */ | |
| .mp-notice { | |
| margin: 8px 0 0; | |
| font-size: 12.5px; | |
| color: var(--text-secondary); | |
| } | |