feat(lab): present chronological perception evidence
This commit is contained in:
DCCONSTRUCTIONS
@@ -23,6 +23,68 @@
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.l32-camera-scene {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
background: var(--nodedc-canvas);
|
||||
}
|
||||
|
||||
.l32-camera-scene canvas {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.l32-camera-scene > img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.e46c-video-scene {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
background: var(--nodedc-canvas);
|
||||
}
|
||||
|
||||
.e46c-video-scene > .recorded-media-player {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
}
|
||||
|
||||
.e46c-video-scene > canvas {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
inset: 0;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.e46e-ready-stack-video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 0;
|
||||
background: var(--nodedc-canvas);
|
||||
}
|
||||
|
||||
.e46e-ready-stack-video > video,
|
||||
.e46e-ready-stack-video > img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.l3-visual-audit__state {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
@@ -52,7 +114,7 @@
|
||||
|
||||
.l3-visual-audit__actions .nodedc-select-anchor,
|
||||
.l3-visual-audit__actions .nodedc-select {
|
||||
width: clamp(17rem, 34vw, 31rem);
|
||||
width: clamp(12rem, 23vw, 22rem);
|
||||
}
|
||||
|
||||
.l3-visual-audit
|
||||
@@ -97,6 +159,10 @@
|
||||
font-size: 0.6rem;
|
||||
}
|
||||
|
||||
.l3-visual-audit__overlay--video {
|
||||
bottom: 3.55rem;
|
||||
}
|
||||
|
||||
.l3-visual-audit__legend {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 0.35rem 0.6rem;
|
||||
@@ -135,6 +201,10 @@
|
||||
background: rgb(var(--nodedc-accent-rgb));
|
||||
}
|
||||
|
||||
.l3-visual-audit__legend span[data-tone="warning"]::before {
|
||||
background: #ffc447;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
.l3-visual-audit__overlay {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
|
||||
@@ -0,0 +1,300 @@
|
||||
.l34-annotation-workspace {
|
||||
position: fixed;
|
||||
z-index: var(--nodedc-layer-overlay);
|
||||
inset: 0;
|
||||
display: grid;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
grid-template-rows: auto minmax(0, 1fr) auto;
|
||||
background: var(--nodedc-canvas);
|
||||
color: var(--nodedc-text-primary);
|
||||
}
|
||||
|
||||
.l34-annotation-workspace__toolbar {
|
||||
z-index: 6;
|
||||
display: flex;
|
||||
min-width: 0;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 0.75rem;
|
||||
border-bottom: 1px solid var(--station-hairline);
|
||||
background: var(--nodedc-floating-surface);
|
||||
padding: 0.55rem 0.7rem;
|
||||
backdrop-filter: blur(var(--nodedc-blur-control));
|
||||
}
|
||||
|
||||
.l34-annotation-workspace__session-tools,
|
||||
.l34-annotation-workspace__frame-tools,
|
||||
.l34-annotation-workspace__object-tools {
|
||||
display: flex;
|
||||
min-width: 0;
|
||||
align-items: center;
|
||||
gap: 0.45rem;
|
||||
}
|
||||
|
||||
.l34-annotation-workspace__session-tools > .nodedc-select-anchor {
|
||||
width: clamp(14rem, 25vw, 24rem);
|
||||
}
|
||||
|
||||
.l34-annotation-workspace__frame-tools > .nodedc-select-anchor {
|
||||
width: clamp(15rem, 26vw, 25rem);
|
||||
}
|
||||
|
||||
.l34-annotation-workspace__stage {
|
||||
position: relative;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
background: var(--nodedc-canvas);
|
||||
}
|
||||
|
||||
.l34-annotation-workspace__state {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.55rem;
|
||||
color: var(--nodedc-text-secondary);
|
||||
}
|
||||
|
||||
.l34-annotation-canvas {
|
||||
display: grid;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
place-items: center;
|
||||
overflow: hidden;
|
||||
background: var(--nodedc-canvas);
|
||||
}
|
||||
|
||||
.l34-annotation-canvas__plane {
|
||||
position: relative;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
overflow: visible;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas__plane > img,
|
||||
.l34-annotation-canvas__plane > svg {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas__plane > img {
|
||||
object-fit: fill;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas__plane > svg {
|
||||
z-index: 1;
|
||||
touch-action: none;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas__plane > svg[data-drawing="true"] {
|
||||
cursor: crosshair;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas rect {
|
||||
fill: none;
|
||||
stroke: rgb(var(--nodedc-accent-rgb));
|
||||
stroke-width: 2;
|
||||
vector-effect: non-scaling-stroke;
|
||||
pointer-events: all;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas rect[data-selected="true"] {
|
||||
fill: none;
|
||||
stroke-width: 3;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas .l34-annotation-canvas__comparison {
|
||||
stroke: rgb(var(--nodedc-warning-rgb));
|
||||
stroke-dasharray: 7 5;
|
||||
stroke-width: 2;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas svg:not([data-drawing="true"]) rect:not(.l34-annotation-canvas__draft) {
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas__resize-handle {
|
||||
fill: var(--nodedc-floating-surface);
|
||||
stroke: rgb(var(--nodedc-accent-rgb));
|
||||
stroke-width: 2;
|
||||
vector-effect: non-scaling-stroke;
|
||||
pointer-events: all;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas__resize-handle[data-handle="nw"],
|
||||
.l34-annotation-canvas__resize-handle[data-handle="se"] {
|
||||
cursor: nwse-resize;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas__resize-handle[data-handle="ne"],
|
||||
.l34-annotation-canvas__resize-handle[data-handle="sw"] {
|
||||
cursor: nesw-resize;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas .l34-annotation-canvas__draft {
|
||||
fill: none;
|
||||
stroke-dasharray: 8 5;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas__label {
|
||||
position: absolute;
|
||||
z-index: 3;
|
||||
width: clamp(9rem, 13vw, 13rem);
|
||||
max-width: 42%;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas__comparison-label {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
overflow: hidden;
|
||||
max-width: 10rem;
|
||||
border-radius: var(--nodedc-radius-option);
|
||||
background: rgb(var(--nodedc-warning-rgb) / 0.92);
|
||||
color: var(--nodedc-canvas);
|
||||
font-size: 0.52rem;
|
||||
font-weight: 800;
|
||||
line-height: 1;
|
||||
padding: 0.3rem 0.4rem;
|
||||
pointer-events: none;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.l34f-adjudication-workspace__legend {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
color: var(--nodedc-text-muted);
|
||||
font-size: 0.54rem;
|
||||
}
|
||||
|
||||
.l34f-adjudication-workspace__legend span::before {
|
||||
display: inline-block;
|
||||
width: 0.65rem;
|
||||
height: 0.12rem;
|
||||
margin-right: 0.3rem;
|
||||
background: rgb(var(--nodedc-accent-rgb));
|
||||
content: "";
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.l34f-adjudication-workspace__legend span:first-child::before {
|
||||
background: rgb(var(--nodedc-warning-rgb));
|
||||
}
|
||||
|
||||
.l34-annotation-canvas__label:not([data-selected="true"]) {
|
||||
width: auto;
|
||||
max-width: 10rem;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas__label:not([data-selected="true"]) > span {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
border-radius: var(--nodedc-radius-option);
|
||||
background: var(--nodedc-floating-surface);
|
||||
color: var(--nodedc-text-primary);
|
||||
font-size: 0.58rem;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
max-width: 10rem;
|
||||
padding: 0.35rem 0.45rem;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.l34-annotation-canvas__label[data-unclassified="true"]
|
||||
.nodedc-select-trigger,
|
||||
.l34-annotation-canvas__label[data-unmapped="true"]
|
||||
.nodedc-select-trigger {
|
||||
box-shadow: inset 0 0 0 1px rgb(var(--nodedc-warning-rgb));
|
||||
}
|
||||
|
||||
.l34-annotation-workspace__inspector {
|
||||
z-index: 5;
|
||||
display: flex;
|
||||
min-width: 0;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 1rem;
|
||||
border-top: 1px solid var(--station-hairline);
|
||||
background: var(--nodedc-floating-surface);
|
||||
padding: 0.55rem 0.7rem;
|
||||
backdrop-filter: blur(var(--nodedc-blur-control));
|
||||
}
|
||||
|
||||
.l34-annotation-workspace__source-state {
|
||||
display: grid;
|
||||
min-width: 13rem;
|
||||
gap: 0.1rem;
|
||||
}
|
||||
|
||||
.l34-annotation-workspace__source-state span,
|
||||
.l34-annotation-workspace__source-state small,
|
||||
.l34-annotation-workspace__hint {
|
||||
color: var(--nodedc-text-muted);
|
||||
font-size: 0.52rem;
|
||||
}
|
||||
|
||||
.l34-annotation-workspace__source-state strong {
|
||||
font-size: 0.62rem;
|
||||
}
|
||||
|
||||
.l34-annotation-save-form {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.l34-annotation-save-form__summary {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) auto;
|
||||
gap: 0.55rem 1rem;
|
||||
border-radius: var(--nodedc-radius-option);
|
||||
background: var(--station-panel-soft);
|
||||
padding: 0.8rem;
|
||||
}
|
||||
|
||||
.l34-annotation-save-form__summary span,
|
||||
.l34-annotation-save-form p {
|
||||
margin: 0;
|
||||
color: var(--nodedc-text-secondary);
|
||||
font-size: 0.65rem;
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
.l34-annotation-save-form__summary strong {
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
|
||||
.l34-annotation-save-form p[role="alert"] {
|
||||
color: rgb(var(--nodedc-warning-rgb));
|
||||
}
|
||||
|
||||
@media (max-width: 980px) {
|
||||
.l34-annotation-workspace__toolbar,
|
||||
.l34-annotation-workspace__inspector {
|
||||
align-items: stretch;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.l34-annotation-workspace__session-tools,
|
||||
.l34-annotation-workspace__frame-tools,
|
||||
.l34-annotation-workspace__object-tools {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.l34-annotation-workspace__session-tools > .nodedc-select-anchor,
|
||||
.l34-annotation-workspace__frame-tools > .nodedc-select-anchor {
|
||||
width: min(100%, 24rem);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user