Files
Ivan Fontosh f270812219 feat(tokens): app-local non-player tokens with session moves and UI polish
Add token library/placements, keep play-time moves for the session, lock presentation interactions, and fix export/import modal layout plus freeform trap label.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-07-27 11:04:12 +08:00

118 lines
2.1 KiB
CSS

.root {
width: 100%;
min-width: 0;
max-width: 100%;
}
.trigger {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
width: 100%;
min-width: 0;
min-height: 34px;
box-sizing: border-box;
padding: 0 10px 0 12px;
border-radius: var(--radius-sm);
border: 1px solid var(--stroke);
background: var(--color-overlay-dark-3);
color: inherit;
font: inherit;
text-align: left;
cursor: pointer;
outline: none;
}
.trigger:hover:not(:disabled) {
border-color: var(--stroke-2);
background: var(--color-panel-2);
}
.trigger:focus-visible {
border-color: var(--accent-border);
box-shadow: 0 0 0 2px var(--accent-fill-soft);
}
.trigger:disabled {
cursor: not-allowed;
opacity: 0.45;
}
.triggerOpen {
border-color: var(--accent-border);
background: var(--color-panel-2);
}
.value {
flex: 1 1 auto;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.placeholder {
color: var(--text2);
}
.chevron {
flex: 0 0 auto;
width: 12px;
height: 12px;
opacity: 0.72;
transition: transform 0.15s ease;
}
.chevronOpen {
transform: rotate(180deg);
}
.menu {
position: fixed;
z-index: calc(var(--z-modal) + 10);
max-height: min(280px, 50vh);
overflow: auto;
padding: 6px;
border-radius: var(--radius-sm);
border: 1px solid var(--stroke-2);
background: var(--color-surface-menu);
box-shadow: var(--shadow-menu);
backdrop-filter: var(--backdrop-blur-surface);
-webkit-backdrop-filter: var(--backdrop-blur-surface);
}
.option {
display: block;
width: 100%;
text-align: left;
padding: 8px 10px;
border: 0;
border-radius: var(--radius-xs);
background: transparent;
color: var(--text0);
font: inherit;
font-size: var(--text-sm);
cursor: pointer;
}
.option:hover:not(:disabled),
.optionActive:not(:disabled) {
background: rgba(255, 255, 255, 0.08);
}
.optionSelected {
background: var(--accent-fill-soft-2);
color: var(--text-on-accent);
}
.optionSelected:hover:not(:disabled),
.optionSelected.optionActive:not(:disabled) {
background: var(--accent-fill-soft);
}
.option:disabled {
cursor: not-allowed;
opacity: 0.4;
}