tools/label-designer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化风格

Browse Source
This commit is contained in:
iqudoo
2026-06-13 12:56:41 +08:00
parent 765d94b0b4
commit 8b09bcaa14
13 changed files with 400 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
src/index.css
View File

@@ -340,6 +340,89 @@ body {
font-family: var(--font-mono);
}
.ps-field:is(select),
.ps-select-trigger.ps-field,
.ps-field.ps-select-trigger,
.ps-panel-body select:not(.mobile-field),
.ps-modal select {
-webkit-appearance: none;
appearance: none;
color-scheme: dark;
background-color: var(--color-ps-input);
padding-right: calc(0.625rem + 0.75rem + 0.625rem);
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999999' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 0.625rem center;
background-size: 0.65rem;
cursor: pointer;
}
.ps-select-trigger {
display: flex;
align-items: center;
width: 100%;
text-align: left;
box-sizing: border-box;
}
.ps-select-trigger-label {
flex: 1;
min-width: 0;
}
.ps-select-panel {
box-sizing: border-box;
background: var(--color-ps-input);
border: 1px solid var(--color-ps-input-border);
border-radius: 0.25rem;
box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
max-height: min(240px, 50vh);
overflow-y: auto;
overscroll-behavior: contain;
padding: 0.25rem 0;
}
.ps-select-option {
display: block;
width: 100%;
padding: 0.375rem 0.625rem;
text-align: left;
font-size: 0.75rem;
line-height: 1.4;
color: var(--color-ps-text);
background: transparent;
border: none;
cursor: pointer;
}
.ps-select-option:hover:not(:disabled) {
background: #2d2d2d;
}
.ps-select-option.selected {
color: var(--color-ps-accent);
background: #2d2d2d;
}
.ps-select-option:disabled {
opacity: 0.45;
cursor: not-allowed;
}
.ps-field:is(select) option,
.ps-panel-body select:not(.mobile-field) option,
.ps-modal select option {
background-color: var(--color-ps-input);
color: var(--color-ps-text);
}
.ps-field:is(select) option:checked,
.ps-panel-body select:not(.mobile-field) option:checked,
.ps-modal select option:checked {
background-color: #2d2d2d;
color: var(--color-ps-accent);
}
.ps-field:focus {
border-color: var(--color-ps-accent);
outline: none;
@@ -1093,6 +1176,15 @@ body {
appearance: none;
}
select.mobile-field {
padding-right: calc(12px + 0.75rem + 12px);
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 12px center;
background-size: 0.75rem;
cursor: pointer;
}
.mobile-field:focus {
outline: none;
border-color: #818cf8;