giers10/webeditor3d
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update viewport region styles and add new components

Browse Source
This commit is contained in:
Victor Giers
2026-04-02 22:13:53 +02:00
parent 36d8e29298
commit 4c5ce44726
1 changed files with 42 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
src/app/app.css
View File

@@ -532,7 +532,7 @@ button:disabled {
.viewport-region { .viewport-region {
display: grid; display: grid;
grid-template-rows: 42px minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr);
min-height: 0; min-height: 0;
background: rgba(20, 24, 31, 0.92); background: rgba(20, 24, 31, 0.92);
border: 1px solid var(--color-border); border: 1px solid var(--color-border);
@@ -555,9 +555,18 @@ button:disabled {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
gap: 12px;
padding: 0 18px; padding: 0 18px;
background: linear-gradient(90deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0) 100%); background: linear-gradient(90deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0) 100%);
border-bottom: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border);
flex-wrap: wrap;
}
.viewport-region__meta {
display: flex;
align-items: baseline;
gap: 12px;
min-width: 0;
} }
.viewport-region__title { .viewport-region__title {
@@ -572,6 +581,28 @@ button:disabled {
font-size: 0.82rem; font-size: 0.82rem;
} }
.viewport-region__view-toggle {
display: flex;
align-items: center;
gap: 6px;
padding: 6px;
background: rgba(255, 255, 255, 0.02);
border: 1px solid var(--color-border);
border-radius: 14px;
flex-wrap: wrap;
}
.viewport-region__view-button {
padding: 0.45rem 0.7rem;
font-size: 0.78rem;
}
.viewport-region__view-button--active {
background: var(--color-accent-soft);
border-color: rgba(207, 123, 66, 0.55);
color: var(--color-accent-strong);
}
.viewport-canvas, .viewport-canvas,
.runner-canvas { .runner-canvas {
position: relative; position: relative;
@@ -619,6 +650,12 @@ button:disabled {
pointer-events: none; pointer-events: none;
} }
.viewport-canvas__overlay-badges {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.viewport-canvas__overlay-badge { .viewport-canvas__overlay-badge {
color: var(--color-accent-strong); color: var(--color-accent-strong);
font-size: 0.72rem; font-size: 0.72rem;
@@ -627,6 +664,10 @@ button:disabled {
text-transform: uppercase; text-transform: uppercase;
} }
.viewport-canvas__overlay-badge--view {
color: #dbe5f4;
}
.viewport-canvas__overlay-text, .viewport-canvas__overlay-text,
.viewport-canvas__overlay-preview { .viewport-canvas__overlay-preview {
font-size: 0.82rem; font-size: 0.82rem;