SHA256
46 lines
2.8 KiB
CSS
46 lines
2.8 KiB
CSS
/* Скрытый редактор палитры (js/components/palette-editor.js). */
|
|
.palette-editor__card { display: grid; gap: 16px; }
|
|
.palette-editor__presets { width: 100%; min-height: 48px; padding: 0 40px 0 14px; color: var(--text-primary); background-color: var(--surface); }
|
|
.palette-editor__presets option { color: var(--text-primary); background: var(--surface); }
|
|
.palette-editor__preview { display: flex; gap: 8px; }
|
|
.palette-editor__preview span { width: 30px; height: 20px; border: 1px solid var(--border-control); border-radius: 4px; }
|
|
.palette-editor__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
|
|
.palette-editor__close { width: 44px; min-width: 44px; padding: 0; font-size: 18px; color: var(--text-secondary); }
|
|
.palette-editor__section { display: grid; gap: 8px; }
|
|
.palette-editor__label { font-size: .75rem; line-height: 1.125rem; color: var(--text-secondary); }
|
|
.palette-editor__hint { margin: 0; font-size: .75rem; line-height: 1.125rem; color: var(--text-secondary); }
|
|
.palette-editor__roles { display: grid; gap: 2px; }
|
|
.palette-editor__role {
|
|
display: grid;
|
|
grid-template-columns: 44px minmax(0, 1fr) auto;
|
|
align-items: center;
|
|
gap: 12px;
|
|
min-height: 48px;
|
|
padding: 2px 4px;
|
|
border-radius: 12px;
|
|
cursor: pointer;
|
|
}
|
|
.palette-editor__role:hover { background: var(--surface-selected); }
|
|
.palette-editor__role input[type='color'] {
|
|
width: 36px;
|
|
height: 36px;
|
|
padding: 0;
|
|
border: 1px solid var(--border-control);
|
|
border-radius: 50%;
|
|
background: transparent;
|
|
cursor: pointer;
|
|
}
|
|
.palette-editor__role input[type='color']::-webkit-color-swatch-wrapper { padding: 0; }
|
|
.palette-editor__role input[type='color']::-webkit-color-swatch { border: 0; border-radius: 50%; }
|
|
.palette-editor__role input[type='color']::-moz-color-swatch { border: 0; border-radius: 50%; }
|
|
.palette-editor__role input[type='color']:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
|
|
.palette-editor__role-name { min-width: 0; font-size: .875rem; line-height: 1.25rem; color: var(--text-primary); }
|
|
.palette-editor__changed { margin-left: 4px; font-size: .75rem; color: var(--accent); }
|
|
.palette-editor__role-value { font-size: .75rem; color: var(--text-secondary); }
|
|
.palette-editor__share { display: grid; gap: 8px; }
|
|
.palette-editor__share summary { min-height: 44px; display: flex; align-items: center; color: var(--accent); cursor: pointer; }
|
|
.palette-editor__share[open] { gap: 8px; }
|
|
.palette-editor__json { width: 100%; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .75rem; line-height: 1.125rem; resize: vertical; }
|
|
.palette-editor__error { margin: 0; color: var(--danger); font-size: .8125rem; }
|
|
.palette-editor__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
|