diff --git a/assets/css/display.css b/assets/css/display.css index 556e9f8..b8168a3 100644 --- a/assets/css/display.css +++ b/assets/css/display.css @@ -363,13 +363,21 @@ left: 10px; z-index: 5; display: flex; - align-items: center; - justify-content: space-between; - gap: 10px; + flex-direction: column; + align-items: stretch; + gap: 8px; pointer-events: none; } -.stage-chrome > * { +.stage-chrome-top { + display: flex; + align-items: center; + justify-content: space-between; + gap: 10px; +} + +.stage-chrome-top > *, +.stage-actions { pointer-events: auto; } @@ -397,6 +405,33 @@ font-weight: 500; } +.stage-actions { + display: flex; + flex-wrap: wrap; + gap: 6px; + max-width: calc(100% - 108px); +} + +.stage-actions button { + min-height: 36px; + border: 1px solid var(--line); + border-radius: 8px; + background: #000a; + color: var(--text); + padding: 0 10px; + font: inherit; + font-size: var(--type-sm); + cursor: pointer; +} + +.stage-actions button:hover { + border-color: var(--amber); +} + +.stage-actions .stage-action-danger { + color: #fca5a5; +} + .eye-viewer { display: grid; width: 44px; @@ -444,6 +479,49 @@ right: 10px; } +.photos-head { + display: flex; + align-items: center; + justify-content: space-between; + gap: 8px; + margin-bottom: 6px; +} + +.photos-inputs-toggle { + border: 1px solid var(--line); + border-radius: 6px; + background: transparent; + color: var(--muted); + padding: 4px 8px; + font: inherit; + font-size: 11px; + cursor: pointer; +} + +.photos-inputs-toggle:hover { + border-color: var(--amber); + color: var(--amber); +} + +.photos-collapsed { + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 8px; + color: var(--muted); + font-size: var(--type-sm); +} + +.photos-add-link { + border: 0; + background: transparent; + color: var(--amber); + padding: 0; + font: inherit; + font-size: var(--type-sm); + cursor: pointer; +} + .filmstrip { display: none; } diff --git a/components/studio2/Bench.vue b/components/studio2/Bench.vue index f33e9a4..ec148cb 100644 --- a/components/studio2/Bench.vue +++ b/components/studio2/Bench.vue @@ -79,15 +79,34 @@