Voer de visuele audit door: fundament, donkere werkstand, kaart en schil
Achttien bevindingen uit de audit, met de metingen erbij in de betreffende
CSS-secties.
Fundament. Dertien tokens werden op 87 plaatsen aangeroepen zonder ooit
gedefinieerd te zijn; in de browser gaf getPropertyValue('--gi-text') een lege
string terug, dus die kleurregels vielen terug op overerving. Vorm en hoogte
zijn terug naar de schaal: radius via token van 17% naar 81%, unieke schaduwen
van 115 naar 71, losse kleurwaarden van 928 naar 352.
Typografie. De stylesheets declareerden negen gewichten terwijl er per familie
twee gezichten geladen werden, en font-synthesis-weight: none verbiedt
namaakvet. Alles van 650 tot 850 kwam dus als 600 op het scherm: 138 van de 148
declaraties rendereden identiek. Nu vier stappen die alle vier ook geladen
worden, en Manrope draagt de koppen zoals op de landingspagina.
Donkere werkstand. De werkbank staat tegen luchtbeelden aan; een lichte schil
daarnaast laat de kaart altijd verliezen. De landingspagina blijft licht.
Kaart. De ondergrond wordt ontkleurd en gedempt zodat alleen de eigen data nog
kleur draagt, en de symbologie staat niet langer als losse hexwaarden in
GeoMap. De zes zwevende vlakken zijn er drie: statuskaart, staprail en
resultaatchip bleken al één component te zijn die de opmaak over drie hoeken
van de kaart uiteentrok.
Schil. Eén kopbalk in plaats van drie (215px chroom naar 100px), het raster van
AI-vragen zonder botsingen, kapitalen op één niveau in plaats van 57
declaraties, en het leverancierslogo uit de navigatiebalk.
Van 47 echte !important naar 1, gemeten door telkens twee productiebuilds op
berekende stijlen te vergelijken. Contrast: nul tekstelementen onder AA op zes
werkbladen, in beide werkstanden.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Jens
+638
-634
File diff suppressed because it is too large
Load Diff
@@ -86,7 +86,7 @@ body {
|
||||
transparent 15rem
|
||||
),
|
||||
linear-gradient(180deg, var(--atlas-900), var(--atlas-950));
|
||||
box-shadow: 12px 0 36px rgba(8, 42, 38, 0.12);
|
||||
box-shadow: var(--gi-shadow-lg);
|
||||
}
|
||||
|
||||
.sidebar-brand {
|
||||
@@ -101,7 +101,7 @@ body {
|
||||
width: 2.65rem;
|
||||
height: 2.65rem;
|
||||
border: 1px solid rgba(173, 238, 227, 0.44);
|
||||
border-radius: 0.8rem;
|
||||
border-radius: var(--gi-radius-lg);
|
||||
object-fit: cover;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.14),
|
||||
@@ -120,7 +120,7 @@ body {
|
||||
.itworx-signature > span {
|
||||
color: rgba(223, 250, 245, 0.48);
|
||||
font-size: 0.58rem;
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -173,12 +173,12 @@ body {
|
||||
gap: 0.75rem;
|
||||
margin: 0.2rem 0;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 0.75rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
padding: 0.68rem 0.72rem;
|
||||
color: rgba(239, 252, 249, 0.7);
|
||||
background: transparent;
|
||||
font-size: 0.82rem;
|
||||
font-weight: 650;
|
||||
font-weight: 600;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@@ -209,9 +209,9 @@ body {
|
||||
bottom: 0.68rem;
|
||||
left: -0.86rem;
|
||||
width: 0.22rem;
|
||||
border-radius: 0 999px 999px 0;
|
||||
background: #69d5c2;
|
||||
box-shadow: 0 0 14px rgba(105, 213, 194, 0.72);
|
||||
border-radius: 0 var(--gi-radius-pill) var(--gi-radius-pill) 0;
|
||||
background: var(--gi-brand-50);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
content: "";
|
||||
}
|
||||
|
||||
@@ -234,7 +234,7 @@ body {
|
||||
border-bottom: 1px solid rgba(194, 210, 205, 0.72);
|
||||
padding: 0.72rem 1.35rem;
|
||||
background: rgba(250, 252, 251, 0.9);
|
||||
box-shadow: 0 8px 24px rgba(8, 42, 38, 0.055);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
backdrop-filter: blur(18px) saturate(135%);
|
||||
}
|
||||
|
||||
@@ -246,7 +246,7 @@ body {
|
||||
position: relative;
|
||||
min-width: 0;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 0.72rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
padding: 0.48rem 0.72rem 0.52rem;
|
||||
background: rgba(238, 248, 246, 0.62);
|
||||
transition:
|
||||
@@ -256,13 +256,13 @@ body {
|
||||
}
|
||||
|
||||
.context-bar > div:first-child {
|
||||
border-color: #c7ded8;
|
||||
background: #eaf6f3;
|
||||
border-color: var(--gi-brand-50);
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.workbench-shell .context-bar span {
|
||||
margin-bottom: 0.16rem;
|
||||
color: #6d827c;
|
||||
color: var(--gi-ink-600);
|
||||
font-size: 0.66rem;
|
||||
letter-spacing: 0.055em;
|
||||
}
|
||||
@@ -270,16 +270,16 @@ body {
|
||||
.context-bar strong {
|
||||
color: var(--ink-950);
|
||||
font-size: 0.78rem;
|
||||
font-weight: 650;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.context-health {
|
||||
min-height: 2.45rem;
|
||||
border: 1px solid #cfe0dc;
|
||||
border-radius: 999px;
|
||||
border: 1px solid var(--gi-surface-sunken);
|
||||
border-radius: var(--gi-radius-pill);
|
||||
padding: 0.45rem 0.78rem;
|
||||
color: var(--atlas-800);
|
||||
background: #f4faf8;
|
||||
background: var(--gi-brand-50);
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
@@ -293,14 +293,14 @@ body {
|
||||
.context-account {
|
||||
min-height: 2.55rem;
|
||||
border: 1px solid var(--atlas-line);
|
||||
border-radius: 999px;
|
||||
border-radius: var(--gi-radius-pill);
|
||||
padding: 0.22rem 0.28rem 0.22rem 0.68rem;
|
||||
background: var(--paper);
|
||||
box-shadow: var(--atlas-shadow-xs);
|
||||
}
|
||||
|
||||
.context-account button {
|
||||
border-radius: 999px;
|
||||
border-radius: var(--gi-radius-pill);
|
||||
}
|
||||
|
||||
/* Calm, singular operational notice */
|
||||
@@ -315,10 +315,10 @@ body {
|
||||
width: min(26rem, calc(100vw - 2rem));
|
||||
gap: 0.7rem;
|
||||
align-items: start;
|
||||
border: 1px solid #e6c9b2;
|
||||
border-radius: 0.9rem;
|
||||
border: 1px solid var(--gi-warn-soft);
|
||||
border-radius: var(--gi-radius-lg);
|
||||
padding: 0.82rem 0.95rem;
|
||||
color: #6f3b1c;
|
||||
color: var(--gi-warn);
|
||||
background: rgba(255, 250, 244, 0.96);
|
||||
box-shadow: var(--atlas-shadow-floating);
|
||||
backdrop-filter: blur(18px);
|
||||
@@ -327,7 +327,7 @@ body {
|
||||
.workspace-notice > svg {
|
||||
width: 1.08rem;
|
||||
margin-top: 0.08rem;
|
||||
color: #b26530;
|
||||
color: var(--gi-warn);
|
||||
}
|
||||
|
||||
.workspace-notice > div {
|
||||
@@ -340,7 +340,7 @@ body {
|
||||
}
|
||||
|
||||
.workspace-notice span {
|
||||
color: #865337;
|
||||
color: var(--gi-warn);
|
||||
font-size: 0.74rem;
|
||||
line-height: 1.45;
|
||||
}
|
||||
@@ -372,7 +372,7 @@ body {
|
||||
color: var(--ink-950);
|
||||
font-family: "Manrope", sans-serif;
|
||||
font-size: clamp(1.65rem, 2vw, 2.25rem);
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
letter-spacing: -0.045em;
|
||||
}
|
||||
|
||||
@@ -388,21 +388,21 @@ body {
|
||||
.primary-action,
|
||||
.quick-action-button {
|
||||
min-height: 2.65rem;
|
||||
border-radius: 0.68rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
padding-inline: 1rem;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.workbench-shell .primary-action {
|
||||
border-color: var(--atlas-700);
|
||||
background: linear-gradient(135deg, var(--atlas-700), var(--atlas-600));
|
||||
box-shadow: 0 8px 20px rgba(13, 102, 91, 0.16);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
.workbench-shell .primary-action:hover:not(:disabled) {
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 12px 26px rgba(13, 102, 91, 0.22);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
/* Shared premium surfaces */
|
||||
@@ -418,7 +418,7 @@ body {
|
||||
.export-history-disclosure {
|
||||
border: 1px solid rgba(194, 210, 205, 0.78);
|
||||
border-radius: var(--atlas-radius-lg);
|
||||
background: rgba(255, 255, 255, 0.94);
|
||||
background: color-mix(in srgb, var(--gi-surface) 94%, transparent);
|
||||
box-shadow: var(--atlas-shadow-sm);
|
||||
}
|
||||
|
||||
@@ -429,12 +429,9 @@ body {
|
||||
letter-spacing: -0.025em;
|
||||
}
|
||||
|
||||
.workbench-shell .eyebrow,
|
||||
.workbench-shell .section-kicker {
|
||||
color: var(--atlas-700);
|
||||
font-size: 0.69rem;
|
||||
letter-spacing: 0.06em;
|
||||
}
|
||||
/* De regel voor .eyebrow en .section-kicker die hier stond, was een tweede
|
||||
definitie van wat atlas-workbench.css al zette, met afwijkende waarden. Ze
|
||||
verplichtte die andere regel tot !important. Eén definitie is genoeg. */
|
||||
|
||||
.muted,
|
||||
.panel-title-row .muted,
|
||||
@@ -448,17 +445,17 @@ body {
|
||||
.status-badge,
|
||||
.count-pill,
|
||||
.status-pill {
|
||||
border-radius: 999px;
|
||||
border-radius: var(--gi-radius-pill);
|
||||
padding: 0.28rem 0.52rem;
|
||||
font-size: 0.66rem;
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.015em;
|
||||
}
|
||||
|
||||
.result-state,
|
||||
.empty-state {
|
||||
min-height: 9rem;
|
||||
border: 1px dashed #bfd0cb;
|
||||
border: 1px dashed var(--gi-line);
|
||||
border-radius: var(--atlas-radius-md);
|
||||
padding: 1.2rem;
|
||||
background:
|
||||
@@ -467,13 +464,13 @@ body {
|
||||
rgba(21, 152, 137, 0.08),
|
||||
transparent 8rem
|
||||
),
|
||||
#fbfdfc;
|
||||
var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.result-state-error {
|
||||
border-style: solid;
|
||||
border-color: #ebc7bf;
|
||||
background: #fff8f6;
|
||||
border-color: var(--gi-danger-soft);
|
||||
background: var(--gi-danger-soft);
|
||||
}
|
||||
|
||||
/* Status becomes an executive health overview */
|
||||
@@ -492,7 +489,7 @@ body {
|
||||
rgba(91, 204, 184, 0.22),
|
||||
transparent 14rem
|
||||
),
|
||||
linear-gradient(135deg, #f8fcfb, #eef7f4);
|
||||
linear-gradient(135deg, var(--gi-brand-50), var(--gi-brand-50));
|
||||
}
|
||||
|
||||
.status-strip-header h2 {
|
||||
@@ -520,7 +517,7 @@ body {
|
||||
border-radius: 50%;
|
||||
padding: 0;
|
||||
background: var(--paper);
|
||||
box-shadow: 0 12px 30px rgba(8, 42, 38, 0.13);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
.status-readiness-orbit {
|
||||
@@ -578,7 +575,7 @@ body {
|
||||
.status-strip-grid {
|
||||
gap: 0.65rem;
|
||||
padding: 0.75rem;
|
||||
background: #f7faf9;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.status-tile,
|
||||
@@ -587,7 +584,7 @@ body {
|
||||
min-height: 8rem;
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--atlas-line);
|
||||
border-radius: 0.8rem;
|
||||
border-radius: var(--gi-radius-lg);
|
||||
padding: 0.9rem;
|
||||
background: var(--paper);
|
||||
}
|
||||
@@ -604,7 +601,7 @@ body {
|
||||
}
|
||||
|
||||
.status-tile-ready {
|
||||
border-color: #c6dfd8;
|
||||
border-color: var(--gi-brand-50);
|
||||
box-shadow: inset 0 3px 0 #45a996;
|
||||
}
|
||||
|
||||
@@ -638,12 +635,12 @@ body {
|
||||
}
|
||||
|
||||
.workbench-shell .workspace-grid-data > section.source-catalog-panel {
|
||||
border-color: #c5dcd6;
|
||||
border-color: var(--gi-brand-50);
|
||||
background:
|
||||
linear-gradient(
|
||||
135deg,
|
||||
rgba(238, 248, 246, 0.72),
|
||||
rgba(255, 255, 255, 0.95) 28%
|
||||
color-mix(in srgb, var(--gi-surface) 95%, transparent) 28%
|
||||
),
|
||||
var(--paper);
|
||||
}
|
||||
@@ -664,7 +661,7 @@ body {
|
||||
.workspace-grid-data .dataset-card {
|
||||
border-color: var(--atlas-line);
|
||||
padding: 0.9rem;
|
||||
background: #fcfdfd;
|
||||
background: var(--gi-surface);
|
||||
transition:
|
||||
transform 140ms ease,
|
||||
border-color 140ms ease,
|
||||
@@ -674,7 +671,7 @@ body {
|
||||
.workspace-grid-data .entity-card:hover,
|
||||
.workspace-grid-data .dataset-card:hover {
|
||||
transform: translateY(-1px);
|
||||
border-color: #9fc8be;
|
||||
border-color: var(--gi-brand-50);
|
||||
box-shadow: var(--atlas-shadow-sm);
|
||||
}
|
||||
|
||||
@@ -698,7 +695,7 @@ body {
|
||||
rgba(84, 196, 176, 0.14),
|
||||
transparent 16rem
|
||||
),
|
||||
linear-gradient(135deg, #fbfdfc, #f3f9f7);
|
||||
linear-gradient(135deg, var(--gi-brand-50), var(--gi-brand-50));
|
||||
}
|
||||
|
||||
.geo-explorer-header h2 {
|
||||
@@ -714,13 +711,13 @@ body {
|
||||
|
||||
.geo-explorer-layout {
|
||||
gap: 0;
|
||||
background: #eef3f1;
|
||||
background: var(--gi-surface-soft);
|
||||
}
|
||||
|
||||
.geo-theme-panel,
|
||||
.geo-insight-panel {
|
||||
border: 0;
|
||||
background: rgba(255, 255, 255, 0.97);
|
||||
background: color-mix(in srgb, var(--gi-surface) 97%, transparent);
|
||||
}
|
||||
|
||||
.geo-theme-panel {
|
||||
@@ -735,7 +732,7 @@ body {
|
||||
.geo-insight-panel > .geo-panel-heading {
|
||||
min-height: 5rem;
|
||||
padding: 1rem;
|
||||
background: #fbfdfc;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.geo-theme-list {
|
||||
@@ -746,20 +743,20 @@ body {
|
||||
.geo-theme-option {
|
||||
min-height: 3.65rem;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 0.75rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
padding: 0.65rem 0.72rem;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.geo-theme-option:hover:not(:disabled) {
|
||||
border-color: #c4d9d4;
|
||||
background: #f5faf8;
|
||||
border-color: var(--gi-line);
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.geo-theme-option-active,
|
||||
.geo-theme-option-active:hover:not(:disabled) {
|
||||
border-color: #9bc9be;
|
||||
background: linear-gradient(135deg, #e7f5f1, #f4faf8);
|
||||
border-color: var(--gi-brand-50);
|
||||
background: linear-gradient(135deg, var(--gi-brand-50), var(--gi-brand-50));
|
||||
box-shadow:
|
||||
inset 3px 0 0 var(--atlas-600),
|
||||
0 6px 16px rgba(8, 42, 38, 0.07);
|
||||
@@ -777,7 +774,7 @@ body {
|
||||
.geo-map-panel,
|
||||
.geo-map-stage,
|
||||
.map-frame-surface {
|
||||
background: #dce7e3;
|
||||
background: var(--gi-surface-sunken);
|
||||
}
|
||||
|
||||
.geo-explorer .map-container,
|
||||
@@ -789,7 +786,7 @@ body {
|
||||
.map-frame-surface .maplibregl-ctrl-group {
|
||||
overflow: hidden;
|
||||
border: 1px solid rgba(171, 192, 186, 0.78);
|
||||
border-radius: 0.65rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
box-shadow: var(--atlas-shadow-md);
|
||||
}
|
||||
|
||||
@@ -802,8 +799,8 @@ body {
|
||||
.geo-map-toolbar,
|
||||
.map-toolbar {
|
||||
border: 1px solid rgba(172, 194, 188, 0.82);
|
||||
border-radius: 0.78rem;
|
||||
background: rgba(255, 255, 255, 0.94);
|
||||
border-radius: var(--gi-radius-lg);
|
||||
background: color-mix(in srgb, var(--gi-surface) 94%, transparent);
|
||||
box-shadow: var(--atlas-shadow-floating);
|
||||
backdrop-filter: blur(16px);
|
||||
}
|
||||
@@ -811,7 +808,7 @@ body {
|
||||
.geo-explorer-footer {
|
||||
min-height: 3rem;
|
||||
border-top: 1px solid var(--atlas-line);
|
||||
background: #fbfdfc;
|
||||
background: var(--gi-brand-50);
|
||||
color: var(--ink-500);
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
@@ -829,7 +826,7 @@ body {
|
||||
.export-history-disclosure {
|
||||
border-color: var(--atlas-line);
|
||||
border-radius: var(--atlas-radius-md);
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
background: color-mix(in srgb, var(--gi-surface) 90%, transparent);
|
||||
}
|
||||
|
||||
.technical-run-list > summary,
|
||||
@@ -852,15 +849,15 @@ body {
|
||||
.workbench-shell textarea {
|
||||
min-height: 2.65rem;
|
||||
border-color: var(--atlas-line-strong);
|
||||
border-radius: 0.62rem;
|
||||
background: #fcfdfd;
|
||||
border-radius: var(--gi-radius-md);
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.workbench-shell input:focus,
|
||||
.workbench-shell select:focus,
|
||||
.workbench-shell textarea:focus {
|
||||
border-color: var(--atlas-600);
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
box-shadow: 0 0 0 4px rgba(21, 152, 137, 0.12);
|
||||
}
|
||||
|
||||
@@ -915,8 +912,8 @@ body {
|
||||
@media (max-width: 920px) {
|
||||
.workbench-sidebar {
|
||||
color: var(--ink-700);
|
||||
background: rgba(255, 255, 255, 0.97);
|
||||
box-shadow: 0 8px 24px rgba(8, 42, 38, 0.08);
|
||||
background: color-mix(in srgb, var(--gi-surface) 97%, transparent);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
.workbench-sidebar .nav-item {
|
||||
@@ -926,7 +923,7 @@ body {
|
||||
|
||||
.workbench-sidebar .nav-item-active,
|
||||
.workbench-sidebar .nav-item-active:hover:not(:disabled) {
|
||||
border-color: #acd2c9;
|
||||
border-color: var(--gi-brand-50);
|
||||
color: var(--atlas-800);
|
||||
background: var(--atlas-50);
|
||||
box-shadow: none;
|
||||
@@ -1024,14 +1021,14 @@ body {
|
||||
align-items: center;
|
||||
border-bottom: 1px solid var(--atlas-line);
|
||||
padding: 0.65rem 1rem;
|
||||
background: #f4fbf9;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
.municipality-search-copy { display: flex; min-width: 0; gap: 0.7rem; align-items: center; }
|
||||
.municipality-search-copy > div { display: grid; min-width: 0; gap: 0.12rem; }
|
||||
.municipality-search-copy strong { font-size: 0.78rem; }
|
||||
.municipality-search-copy strong small { margin-left: 0.35rem; color: var(--atlas-600); font-size: 0.56rem; font-weight: 750; text-transform: uppercase; }
|
||||
.municipality-search-copy strong small { margin-left: 0.35rem; color: var(--atlas-600); font-size: 0.56rem; font-weight: 600; text-transform: none; }
|
||||
.municipality-search-copy p { margin: 0; color: var(--atlas-muted); font-size: 0.62rem; overflow-wrap: anywhere; }
|
||||
.municipality-shortcut { display: inline-flex; flex: 0 0 auto; gap: 0.3rem; align-items: center; border-radius: 999px; padding: 0.35rem 0.52rem; background: #e0f3ee; color: var(--atlas-800); font-size: 0.57rem; font-weight: 750; text-transform: uppercase; }
|
||||
.municipality-shortcut { display: inline-flex; flex: 0 0 auto; gap: 0.3rem; align-items: center; border-radius: var(--gi-radius-pill); padding: 0.35rem 0.52rem; background: var(--gi-brand-50); color: var(--atlas-800); font-size: 0.57rem; font-weight: 600; text-transform: none; }
|
||||
.municipality-shortcut svg { width: 0.8rem; height: 0.8rem; }
|
||||
.municipality-search-control { position: relative; min-width: 0; }
|
||||
.municipality-search-control label { position: relative; display: block; min-width: 0; }
|
||||
@@ -1039,19 +1036,19 @@ body {
|
||||
.municipality-search input { width: 100%; min-width: 0; padding-left: 2.15rem; }
|
||||
.municipality-search-clear { position: absolute; top: 50%; right: 0.35rem; display: grid; width: 1.8rem; height: 1.8rem; min-height: 0; place-items: center; border: 0; border-radius: 50%; padding: 0; background: transparent; color: var(--atlas-muted); transform: translateY(-50%); }
|
||||
.municipality-search-clear svg { width: 0.9rem; height: 0.9rem; }
|
||||
.municipality-search-results { position: absolute; z-index: 70; top: calc(100% + 0.35rem); right: 0; left: 0; max-height: 18rem; overflow: auto; border: 1px solid var(--atlas-line-strong); border-radius: 0.75rem; padding: 0.35rem; background: #fff; box-shadow: var(--atlas-shadow-floating); }
|
||||
.municipality-search-results { position: absolute; z-index: 70; top: calc(100% + 0.35rem); right: 0; left: 0; max-height: 18rem; overflow: auto; border: 1px solid var(--atlas-line-strong); border-radius: var(--gi-radius-md); padding: 0.35rem; background: var(--gi-surface); box-shadow: var(--atlas-shadow-floating); }
|
||||
.municipality-search-results > p { margin: 0; padding: 0.75rem; color: var(--atlas-muted); font-size: 0.7rem; }
|
||||
.municipality-search-results > button { display: flex; width: 100%; min-width: 0; align-items: center; justify-content: space-between; border: 0; border-radius: 0.55rem; padding: 0.65rem 0.7rem; background: transparent; text-align: left; }
|
||||
.municipality-search-results > button { display: flex; width: 100%; min-width: 0; align-items: center; justify-content: space-between; border: 0; border-radius: var(--gi-radius-md); padding: 0.65rem 0.7rem; background: transparent; text-align: left; }
|
||||
.municipality-search-results > button:hover { background: var(--atlas-50); }
|
||||
.municipality-search-results > button span { display: grid; min-width: 0; gap: 0.12rem; }
|
||||
.municipality-search-results > button strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.municipality-search-results > button small { color: var(--atlas-muted); font-size: 0.58rem; }
|
||||
.municipality-search-results > button em { flex: 0 0 auto; color: var(--atlas-700); font-size: 0.6rem; font-style: normal; font-weight: 750; }
|
||||
.municipality-search-results > button em { flex: 0 0 auto; color: var(--atlas-700); font-size: 0.6rem; font-style: normal; font-weight: 600; }
|
||||
.municipality-search-status { display: grid; min-width: 0; gap: 0.15rem; border-left: 1px solid var(--atlas-line); padding-left: 0.85rem; }
|
||||
.municipality-search-status span { color: var(--atlas-muted); font-size: 0.56rem; text-transform: uppercase; }
|
||||
.municipality-search-status span { color: var(--atlas-muted); font-size: 0.56rem; text-transform: none; }
|
||||
.municipality-search-status strong { overflow: hidden; font-size: 0.7rem; text-overflow: ellipsis; white-space: nowrap; }
|
||||
|
||||
.geo-panel-heading h3 small { margin-left: 0.35rem; color: var(--atlas-600); font-size: 0.54rem; font-weight: 750; text-transform: uppercase; }
|
||||
.geo-panel-heading h3 small { margin-left: 0.35rem; color: var(--atlas-600); font-size: 0.54rem; font-weight: 600; text-transform: none; }
|
||||
.geo-theme-option { height: auto; min-height: 4.35rem; align-items: start; }
|
||||
.geo-theme-option > span:nth-child(2) { min-width: 0; align-self: start; }
|
||||
.geo-theme-option small { display: -webkit-box; overflow: hidden; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 1.25; }
|
||||
@@ -1104,7 +1101,7 @@ body {
|
||||
border-radius: var(--atlas-radius-lg);
|
||||
background:
|
||||
radial-gradient(circle at 45% 0%, rgba(44, 163, 141, 0.09), transparent 12rem),
|
||||
rgba(255, 255, 255, 0.76);
|
||||
color-mix(in srgb, var(--gi-surface) 76%, transparent);
|
||||
box-shadow: var(--atlas-shadow-xs);
|
||||
}
|
||||
|
||||
@@ -1134,10 +1131,10 @@ body {
|
||||
height: 5.25rem;
|
||||
overflow: hidden;
|
||||
border: 1px solid rgba(13, 102, 91, 0.14);
|
||||
border-radius: 1.1rem;
|
||||
border-radius: var(--gi-radius-xl);
|
||||
background:
|
||||
radial-gradient(circle at 50% 45%, color-mix(in srgb, var(--signal-accent) 18%, transparent), transparent 2.6rem),
|
||||
linear-gradient(145deg, rgba(255, 255, 255, 0.92), rgba(235, 245, 242, 0.82));
|
||||
linear-gradient(145deg, color-mix(in srgb, var(--gi-surface) 92%, transparent), rgba(235, 245, 242, 0.82));
|
||||
box-shadow: inset 0 1px 0 #fff, 0 12px 25px rgba(8, 42, 38, 0.08);
|
||||
}
|
||||
|
||||
@@ -1169,7 +1166,7 @@ body {
|
||||
height: 2.5rem;
|
||||
place-items: center;
|
||||
border: 1px solid color-mix(in srgb, var(--signal-accent) 28%, white);
|
||||
border-radius: 0.8rem;
|
||||
border-radius: var(--gi-radius-lg);
|
||||
color: #fff;
|
||||
background: linear-gradient(145deg, color-mix(in srgb, var(--signal-accent) 85%, white), var(--signal-accent));
|
||||
box-shadow: 0 8px 20px color-mix(in srgb, var(--signal-accent) 25%, transparent);
|
||||
@@ -1294,7 +1291,7 @@ body {
|
||||
.workspace-signal {
|
||||
width: 4.7rem;
|
||||
height: 4.1rem;
|
||||
border-radius: 0.85rem;
|
||||
border-radius: var(--gi-radius-lg);
|
||||
}
|
||||
|
||||
.workspace-signal-icon {
|
||||
@@ -1372,7 +1369,7 @@ body {
|
||||
|
||||
.project-atlas-copy > p strong {
|
||||
color: #fff;
|
||||
font-weight: 650;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.project-atlas-metrics {
|
||||
@@ -1388,7 +1385,7 @@ body {
|
||||
gap: 0.35rem;
|
||||
padding: 0.55rem 0.7rem;
|
||||
border: 1px solid rgba(178, 230, 216, 0.16);
|
||||
border-radius: 999px;
|
||||
border-radius: var(--gi-radius-pill);
|
||||
color: rgba(230, 247, 242, 0.7);
|
||||
background: rgba(255, 255, 255, 0.055);
|
||||
font-size: 0.7rem;
|
||||
@@ -1413,8 +1410,8 @@ body {
|
||||
height: auto;
|
||||
overflow: visible;
|
||||
border: 1px solid rgba(157, 222, 205, 0.18);
|
||||
border-radius: 1.75rem;
|
||||
box-shadow: 0 30px 70px rgba(1, 19, 23, 0.36);
|
||||
border-radius: var(--gi-radius-xl);
|
||||
box-shadow: var(--gi-shadow-lg);
|
||||
transform: rotateX(2deg) rotateY(-3deg);
|
||||
transform-origin: center;
|
||||
transition: transform 500ms cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 500ms ease;
|
||||
@@ -1422,7 +1419,7 @@ body {
|
||||
|
||||
.project-atlas:hover .project-atlas-visual svg,
|
||||
.project-atlas:focus-within .project-atlas-visual svg {
|
||||
box-shadow: 0 35px 82px rgba(1, 19, 23, 0.46);
|
||||
box-shadow: var(--gi-shadow-lg);
|
||||
transform: rotateX(0) rotateY(0) translateY(-0.2rem);
|
||||
}
|
||||
|
||||
@@ -1501,13 +1498,13 @@ body {
|
||||
gap: 0.4rem;
|
||||
padding: 0.45rem 0.6rem;
|
||||
border: 1px solid rgba(190, 236, 224, 0.16);
|
||||
border-radius: 999px;
|
||||
border-radius: var(--gi-radius-pill);
|
||||
color: rgba(238, 252, 248, 0.78);
|
||||
background: rgba(5, 35, 37, 0.7);
|
||||
font-size: 0.62rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0;
|
||||
text-transform: none;
|
||||
backdrop-filter: blur(12px);
|
||||
}
|
||||
|
||||
@@ -1515,7 +1512,7 @@ body {
|
||||
width: 0.42rem;
|
||||
height: 0.42rem;
|
||||
border-radius: 50%;
|
||||
background: #62dfbd;
|
||||
background: var(--gi-brand-50);
|
||||
box-shadow: 0 0 0 0 rgba(98, 223, 189, 0.55);
|
||||
animation: atlas-live-pulse 2.2s ease-out infinite;
|
||||
}
|
||||
@@ -1538,7 +1535,7 @@ body {
|
||||
min-width: 0;
|
||||
padding: 0.68rem;
|
||||
border: 1px solid rgba(178, 230, 216, 0.14);
|
||||
border-radius: 0.8rem;
|
||||
border-radius: var(--gi-radius-lg);
|
||||
color: rgba(230, 247, 242, 0.7);
|
||||
background: rgba(255, 255, 255, 0.045);
|
||||
text-align: left;
|
||||
@@ -1559,7 +1556,7 @@ body {
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
place-items: center;
|
||||
border-radius: 0.58rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
@@ -1581,15 +1578,15 @@ body {
|
||||
}
|
||||
|
||||
.project-atlas-stage small {
|
||||
color: rgba(213, 238, 232, 0.48);
|
||||
color: rgba(213, 238, 232, 0.66);
|
||||
font-size: 0.6rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: none;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
.project-atlas-stage-ready > span {
|
||||
color: #092f2b;
|
||||
background: #79d7bd;
|
||||
color: var(--gi-brand-600);
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.project-atlas-stage-active {
|
||||
@@ -1599,8 +1596,8 @@ body {
|
||||
}
|
||||
|
||||
.project-atlas-stage-active > span {
|
||||
color: #3a2b09;
|
||||
background: #edc86c;
|
||||
color: var(--gi-warn);
|
||||
background: var(--gi-warn-soft);
|
||||
box-shadow: 0 0 0 0.25rem rgba(237, 200, 108, 0.1);
|
||||
}
|
||||
|
||||
|
||||
@@ -65,10 +65,10 @@ textarea {
|
||||
right: 0.75rem;
|
||||
width: min(30rem, calc(100vw - 1.5rem));
|
||||
margin: 0;
|
||||
border-color: #efc2bf;
|
||||
border-color: var(--gi-danger-soft);
|
||||
border-radius: var(--atlas-radius);
|
||||
background: var(--atlas-danger-soft);
|
||||
box-shadow: 0 8px 24px rgba(53, 31, 29, 0.12);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
.workbench-layout {
|
||||
@@ -130,7 +130,7 @@ textarea {
|
||||
color: var(--atlas-primary);
|
||||
font-family: "Manrope", "Segoe UI", sans-serif;
|
||||
font-size: 1.05rem;
|
||||
font-weight: 800;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.sidebar-brand-copy {
|
||||
@@ -190,7 +190,7 @@ textarea {
|
||||
|
||||
.workbench-sidebar .nav-item-active {
|
||||
border-left-color: var(--atlas-primary);
|
||||
background: #eefaf7;
|
||||
background: var(--gi-brand-50);
|
||||
box-shadow: none;
|
||||
color: var(--atlas-primary);
|
||||
}
|
||||
@@ -222,7 +222,7 @@ textarea {
|
||||
min-height: var(--atlas-topbar-height);
|
||||
align-items: stretch;
|
||||
border-bottom: 1px solid var(--atlas-line);
|
||||
background: #eefdf9;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.context-account {
|
||||
@@ -277,8 +277,8 @@ textarea {
|
||||
}
|
||||
|
||||
.context-bar span {
|
||||
color: var(--atlas-muted) !important;
|
||||
font-size: 0.58rem !important;
|
||||
color: var(--atlas-muted);
|
||||
font-size: 0.58rem;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0;
|
||||
line-height: 1.1;
|
||||
@@ -368,7 +368,7 @@ textarea {
|
||||
color: var(--atlas-ink);
|
||||
font-family: "Manrope", "Segoe UI", sans-serif;
|
||||
font-size: 1.08rem;
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
@@ -482,24 +482,24 @@ textarea {
|
||||
|
||||
.section-kicker,
|
||||
.eyebrow {
|
||||
color: var(--atlas-secondary) !important;
|
||||
font-size: 0.62rem !important;
|
||||
font-weight: 760;
|
||||
color: var(--atlas-secondary);
|
||||
font-size: 0.62rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
.status-badge,
|
||||
.count-pill {
|
||||
border-color: var(--atlas-line-strong);
|
||||
border-radius: 999px;
|
||||
border-radius: var(--gi-radius-pill);
|
||||
background: var(--atlas-surface-muted);
|
||||
color: var(--atlas-ink-soft);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.status-badge-ready {
|
||||
border-color: #bddacf;
|
||||
background: #edf7f3;
|
||||
border-color: var(--gi-brand-50);
|
||||
background: var(--gi-brand-50);
|
||||
color: var(--atlas-primary-strong);
|
||||
}
|
||||
|
||||
@@ -543,7 +543,7 @@ textarea {
|
||||
color: var(--atlas-ink);
|
||||
font-family: "Manrope", "Segoe UI", sans-serif;
|
||||
font-size: 1.08rem;
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
@@ -566,7 +566,7 @@ textarea {
|
||||
.geo-analysis-mode button {
|
||||
min-height: 1.65rem;
|
||||
border: 0;
|
||||
border-radius: 3px;
|
||||
border-radius: var(--gi-radius-xs);
|
||||
padding: 0.32rem 0.7rem;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
@@ -577,7 +577,7 @@ textarea {
|
||||
.geo-analysis-mode button.active {
|
||||
background: var(--atlas-surface);
|
||||
color: var(--atlas-primary-strong);
|
||||
box-shadow: 0 1px 2px rgba(21, 37, 34, 0.08);
|
||||
box-shadow: var(--gi-shadow-xs);
|
||||
}
|
||||
|
||||
.geo-explorer-advanced {
|
||||
@@ -645,7 +645,7 @@ textarea {
|
||||
.geo-results-panel > .geo-panel-heading {
|
||||
padding: 0.85rem 1rem 0.75rem;
|
||||
border-bottom: 1px solid var(--atlas-line);
|
||||
background: #fbfefd;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.geo-panel-heading {
|
||||
@@ -677,10 +677,10 @@ textarea {
|
||||
.geo-loaded-scope {
|
||||
flex: 0 0 auto;
|
||||
margin: 0.7rem 0.85rem 0;
|
||||
border: 1px solid #c7ded8;
|
||||
border: 1px solid var(--gi-brand-50);
|
||||
border-radius: var(--atlas-radius);
|
||||
padding: 0.58rem;
|
||||
background: #eefaf7;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.geo-loaded-scope span,
|
||||
@@ -728,9 +728,9 @@ textarea {
|
||||
}
|
||||
|
||||
.geo-theme-option-active {
|
||||
border-color: #bddbd4;
|
||||
border-color: var(--gi-brand-50);
|
||||
border-radius: var(--atlas-radius);
|
||||
background: #f5fcfa;
|
||||
background: var(--gi-brand-50);
|
||||
box-shadow: inset 4px 0 0 var(--atlas-primary);
|
||||
}
|
||||
|
||||
@@ -779,7 +779,7 @@ textarea {
|
||||
position: relative;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
background: #dce8e6;
|
||||
background: var(--gi-surface-sunken);
|
||||
}
|
||||
|
||||
.geo-map-toolbar {
|
||||
@@ -798,7 +798,7 @@ textarea {
|
||||
border-radius: var(--atlas-radius);
|
||||
padding: 0.22rem;
|
||||
background: var(--atlas-surface);
|
||||
box-shadow: 0 2px 8px rgba(22, 38, 34, 0.1);
|
||||
box-shadow: var(--gi-shadow-sm);
|
||||
}
|
||||
|
||||
.geo-map-toolbar > .geo-panel-heading {
|
||||
@@ -851,7 +851,7 @@ textarea {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 0;
|
||||
background: #dce8e6;
|
||||
background: var(--gi-surface-sunken);
|
||||
}
|
||||
|
||||
.geo-map-canvas .map-container {
|
||||
@@ -862,8 +862,8 @@ textarea {
|
||||
.geo-map-legend {
|
||||
border: 1px solid rgba(21, 37, 34, 0.22);
|
||||
border-radius: var(--atlas-radius);
|
||||
background: rgba(255, 255, 255, 0.96);
|
||||
box-shadow: 0 2px 8px rgba(21, 37, 34, 0.1);
|
||||
background: color-mix(in srgb, var(--gi-surface) 96%, transparent);
|
||||
box-shadow: var(--gi-shadow-sm);
|
||||
}
|
||||
|
||||
.geo-results-panel {
|
||||
@@ -911,9 +911,9 @@ textarea {
|
||||
|
||||
.geo-result-next-actions {
|
||||
margin: auto 0.85rem 0.85rem;
|
||||
border-color: #bad7d1;
|
||||
border-color: var(--gi-brand-50);
|
||||
border-radius: var(--atlas-radius);
|
||||
background: #f0f8f6;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.geo-explorer-footer {
|
||||
@@ -935,7 +935,7 @@ textarea {
|
||||
.source-catalog-panel > .panel-title-row {
|
||||
border-bottom: 1px solid var(--atlas-line);
|
||||
padding: 0.85rem 1rem;
|
||||
background: #fbfefd;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.source-domain-grid {
|
||||
@@ -1017,8 +1017,8 @@ textarea {
|
||||
}
|
||||
|
||||
.workspace-grid-data .data-selection-summary {
|
||||
border-color: #c7ded8;
|
||||
background: #eefaf7;
|
||||
border-color: var(--gi-brand-50);
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.workspace-grid-data .entity-card,
|
||||
@@ -1044,7 +1044,7 @@ textarea {
|
||||
grid-column: 1 / -1;
|
||||
border-bottom: 1px solid var(--atlas-line);
|
||||
padding: 0.75rem 1rem;
|
||||
background: #fbfefd;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.geo-assistant-panel > .panel-title-row h2 {
|
||||
@@ -1069,7 +1069,7 @@ textarea {
|
||||
border-right: 1px solid var(--atlas-line);
|
||||
border-radius: 0;
|
||||
padding: 0.9rem;
|
||||
background: #eefaf7;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.assistant-context-strip > div {
|
||||
@@ -1083,8 +1083,8 @@ textarea {
|
||||
.assistant-context-strip label > span {
|
||||
color: var(--atlas-muted);
|
||||
font-size: 0.59rem;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
font-weight: 600;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
.assistant-context-strip > div strong {
|
||||
@@ -1112,15 +1112,15 @@ textarea {
|
||||
align-items: center;
|
||||
border-top: 1px solid var(--atlas-line);
|
||||
padding: 0.5rem 0.75rem;
|
||||
background: #fbfefd;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.assistant-suggestions button {
|
||||
min-height: 1.65rem;
|
||||
border-color: #bddbd4;
|
||||
border-color: var(--gi-brand-50);
|
||||
border-radius: var(--atlas-radius);
|
||||
padding: 0.3rem 0.55rem;
|
||||
background: #f5fcfa;
|
||||
background: var(--gi-brand-50);
|
||||
color: var(--atlas-ink-soft);
|
||||
font-size: 0.58rem;
|
||||
line-height: 1.15;
|
||||
@@ -1150,7 +1150,7 @@ textarea {
|
||||
|
||||
.assistant-message-assistant {
|
||||
border-left-color: var(--atlas-primary);
|
||||
background: #f2f8f6;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.assistant-composer {
|
||||
@@ -1161,7 +1161,7 @@ textarea {
|
||||
border-top: 1px solid var(--atlas-line);
|
||||
border-radius: 0;
|
||||
padding: 0.55rem 0.75rem;
|
||||
background: #eefaf7;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.assistant-composer textarea {
|
||||
@@ -1551,7 +1551,7 @@ textarea {
|
||||
width: min(22rem, 34vw);
|
||||
border-left: 1px solid var(--atlas-line);
|
||||
background: var(--atlas-surface);
|
||||
box-shadow: -8px 0 20px rgba(21, 37, 34, 0.06);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
/* Ultrawide keeps text rails stable and gives the map the additional width. */
|
||||
|
||||
+1013
-161
File diff suppressed because it is too large
Load Diff
@@ -40,7 +40,7 @@
|
||||
justify-items: start;
|
||||
min-width: 0;
|
||||
border: 1px solid var(--landing-line);
|
||||
border-radius: .8rem;
|
||||
border-radius: var(--gi-radius-lg);
|
||||
padding: .8rem;
|
||||
background: rgba(255, 255, 255, .72);
|
||||
color: var(--landing-muted);
|
||||
@@ -54,7 +54,7 @@
|
||||
bottom: 0;
|
||||
left: .8rem;
|
||||
height: 2px;
|
||||
border-radius: 999px;
|
||||
border-radius: var(--gi-radius-pill);
|
||||
background: var(--landing-primary);
|
||||
content: '';
|
||||
opacity: 0;
|
||||
@@ -69,7 +69,7 @@
|
||||
color: var(--landing-primary-strong);
|
||||
}
|
||||
.landing-story-tabs button[aria-selected='true']::after { opacity: 1; transform: scaleX(1); }
|
||||
.landing-story-tabs button > span { font-size: .54rem; font-weight: 800; letter-spacing: .1em; }
|
||||
.landing-story-tabs button > span { font-size: .54rem; font-weight: 700; letter-spacing: .1em; }
|
||||
.landing-story-tabs svg { width: 1rem; height: 1rem; }
|
||||
.landing-story-tabs strong { overflow: hidden; max-width: 100%; font-size: .65rem; text-overflow: ellipsis; }
|
||||
|
||||
@@ -80,13 +80,13 @@
|
||||
align-items: end;
|
||||
margin-top: 1rem;
|
||||
border-left: 3px solid var(--landing-primary);
|
||||
border-radius: 0 .8rem .8rem 0;
|
||||
border-radius: 0 var(--gi-radius-lg) var(--gi-radius-lg) 0;
|
||||
padding: 1rem 1.1rem;
|
||||
background: linear-gradient(90deg, rgba(222, 247, 241, .8), rgba(247, 252, 251, .55));
|
||||
animation: landing-story-enter .42s ease both;
|
||||
}
|
||||
|
||||
.landing-story-detail small { color: var(--landing-primary); font-size: .55rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
|
||||
.landing-story-detail small { color: var(--landing-primary); font-size: .55rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
|
||||
.landing-story-detail h3 { margin: .25rem 0 0; font-family: "Manrope", sans-serif; font-size: 1rem; }
|
||||
.landing-story-detail p { max-width: 54ch; margin: .35rem 0 0; color: var(--landing-muted); font-size: .69rem; line-height: 1.6; }
|
||||
.landing-story-metric { display: grid; min-width: 6.5rem; text-align: right; }
|
||||
@@ -99,15 +99,20 @@
|
||||
min-height: 38rem;
|
||||
overflow: hidden;
|
||||
border: 1px solid rgba(161, 215, 204, .6);
|
||||
border-radius: 1.6rem;
|
||||
border-radius: var(--gi-radius-xl);
|
||||
background: #072f2c;
|
||||
box-shadow: 0 35px 90px rgba(10, 67, 59, .2);
|
||||
box-shadow: var(--gi-shadow-lg);
|
||||
}
|
||||
|
||||
.landing-story-map {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: linear-gradient(145deg, rgba(4, 35, 32, .2), rgba(2, 26, 24, .78)), url('/portfolio/geointel-building-qa.webp') center / cover;
|
||||
/* De afbeelding komt pas wanneer het blok in de buurt van het scherm is;
|
||||
zie useDeferredBackground. De gradiënt staat er meteen, zodat het vlak
|
||||
nooit leeg oogt. */
|
||||
background: linear-gradient(145deg, rgba(4, 35, 32, .2), rgba(2, 26, 24, .78));
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
filter: saturate(.78) contrast(1.03);
|
||||
transform: scale(1.035);
|
||||
transition: transform 1.1s cubic-bezier(.22, 1, .36, 1), filter .5s ease;
|
||||
@@ -132,14 +137,14 @@
|
||||
z-index: 2;
|
||||
display: grid;
|
||||
border: 1px solid rgba(196, 244, 234, .24);
|
||||
border-radius: .9rem;
|
||||
border-radius: var(--gi-radius-lg);
|
||||
background: rgba(3, 39, 35, .78);
|
||||
color: #fff;
|
||||
box-shadow: 0 16px 40px rgba(0, 0, 0, .24);
|
||||
box-shadow: var(--gi-shadow-lg);
|
||||
backdrop-filter: blur(13px);
|
||||
}
|
||||
.landing-story-status { top: 1.25rem; left: 1.25rem; gap: .2rem; min-width: 10rem; padding: .8rem .95rem; }
|
||||
.landing-story-status span { color: #8ee7d2; font-size: .52rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
|
||||
.landing-story-status span { color: #8ee7d2; font-size: .52rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
|
||||
.landing-story-status i { display: inline-block; width: .42rem; height: .42rem; margin-right: .4rem; border-radius: 50%; background: #77e2ca; box-shadow: 0 0 0 5px rgba(119, 226, 202, .11); }
|
||||
.landing-story-status strong { font-family: "Manrope", sans-serif; font-size: .92rem; }
|
||||
.landing-story-status small { color: rgba(255, 255, 255, .58); font-size: .59rem; }
|
||||
@@ -163,7 +168,7 @@
|
||||
.landing-story-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
|
||||
.landing-story-detail { grid-template-columns: 1fr; }
|
||||
.landing-story-metric { text-align: left; }
|
||||
.landing-story-visual { min-height: 28rem; border-radius: 1.15rem; }
|
||||
.landing-story-visual { min-height: 28rem; border-radius: var(--gi-radius-xl); }
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
@@ -172,3 +177,10 @@
|
||||
transition-duration: .01ms !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.landing-story-map[data-achtergrond='geladen'] {
|
||||
background:
|
||||
linear-gradient(145deg, rgba(4, 35, 32, .2), rgba(2, 26, 24, .78)),
|
||||
url('/portfolio/geointel-building-qa.webp') center / cover;
|
||||
}
|
||||
|
||||
@@ -61,13 +61,13 @@ body.landing-body {
|
||||
z-index: 200;
|
||||
top: -5rem;
|
||||
left: 1rem;
|
||||
border-radius: 0.65rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
padding: 0.75rem 1rem;
|
||||
background: var(--landing-primary-dark);
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
box-shadow: 0 12px 30px rgba(4, 42, 37, 0.24);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
.landing-skip-link:focus {
|
||||
@@ -104,8 +104,8 @@ body.landing-body {
|
||||
.landing-brand-mark {
|
||||
width: 2.35rem;
|
||||
height: 2.35rem;
|
||||
border-radius: 0.7rem;
|
||||
box-shadow: 0 8px 22px rgba(3, 55, 49, 0.2);
|
||||
border-radius: var(--gi-radius-md);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
.landing-brand-copy {
|
||||
@@ -122,7 +122,7 @@ body.landing-body {
|
||||
.landing-brand-copy small {
|
||||
color: var(--landing-muted);
|
||||
font-size: 0.59rem;
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -138,7 +138,7 @@ body.landing-body {
|
||||
padding: 0.55rem 0;
|
||||
color: #3c5a55;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 650;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@@ -148,7 +148,7 @@ body.landing-body {
|
||||
bottom: 0.25rem;
|
||||
left: 0;
|
||||
height: 2px;
|
||||
border-radius: 999px;
|
||||
border-radius: var(--gi-radius-pill);
|
||||
background: var(--landing-primary);
|
||||
content: '';
|
||||
opacity: 0;
|
||||
@@ -176,10 +176,10 @@ body.landing-body {
|
||||
.landing-header-login,
|
||||
.landing-header-guest {
|
||||
min-height: 2.55rem;
|
||||
border-radius: 0.62rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
padding: 0.5rem 1rem;
|
||||
font-size: 0.76rem;
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease;
|
||||
}
|
||||
|
||||
@@ -187,7 +187,7 @@ body.landing-body {
|
||||
border: 1px solid var(--landing-primary);
|
||||
background: var(--landing-primary);
|
||||
color: #fff;
|
||||
box-shadow: 0 9px 22px rgba(8, 120, 108, 0.18);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
.landing-header-guest {
|
||||
@@ -315,17 +315,17 @@ body.landing-body {
|
||||
margin: 0;
|
||||
color: var(--landing-primary-strong);
|
||||
font-size: 0.67rem;
|
||||
font-weight: 800;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.105em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.landing-kicker {
|
||||
border: 1px solid rgba(104, 182, 169, 0.52);
|
||||
border-radius: 999px;
|
||||
border-radius: var(--gi-radius-pill);
|
||||
padding: 0.48rem 0.8rem;
|
||||
background: rgba(225, 250, 245, 0.82);
|
||||
box-shadow: 0 6px 18px rgba(48, 111, 101, 0.08);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
.landing-kicker svg {
|
||||
@@ -339,7 +339,7 @@ body.landing-body {
|
||||
color: var(--landing-ink);
|
||||
font-family: "Manrope", "Segoe UI", sans-serif;
|
||||
font-size: clamp(3.1rem, 5.2vw, 5.35rem);
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
letter-spacing: -0.06em;
|
||||
line-height: 0.99;
|
||||
text-wrap: balance;
|
||||
@@ -372,10 +372,10 @@ body.landing-body {
|
||||
gap: 0.6rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 0.72rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
padding: 0.8rem 1.2rem;
|
||||
font-size: 0.82rem;
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
|
||||
}
|
||||
@@ -384,7 +384,7 @@ body.landing-body {
|
||||
border: 1px solid var(--landing-primary);
|
||||
background: var(--landing-primary);
|
||||
color: #fff;
|
||||
box-shadow: 0 14px 30px rgba(8, 120, 108, 0.2);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
.landing-secondary-action {
|
||||
@@ -401,7 +401,7 @@ body.landing-body {
|
||||
|
||||
.landing-primary-action:hover:not(:disabled) {
|
||||
background: var(--landing-primary-strong);
|
||||
box-shadow: 0 18px 34px rgba(8, 120, 108, 0.24);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
.landing-secondary-action:hover {
|
||||
@@ -478,7 +478,7 @@ body.landing-body {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
border: 1px solid rgba(103, 147, 138, 0.48);
|
||||
border-radius: 1.25rem;
|
||||
border-radius: var(--gi-radius-xl);
|
||||
background: rgba(255, 255, 255, 0.96);
|
||||
box-shadow: var(--landing-shadow);
|
||||
scroll-margin-top: 6rem;
|
||||
@@ -543,7 +543,7 @@ body.landing-body {
|
||||
justify-content: space-between;
|
||||
color: rgba(255, 255, 255, 0.78);
|
||||
font-size: 0.61rem;
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.05em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -571,10 +571,10 @@ body.landing-body {
|
||||
align-items: center;
|
||||
margin: 1.4rem auto 1.1rem 0.7rem;
|
||||
border: 1px solid rgba(189, 240, 230, 0.25);
|
||||
border-radius: 0.8rem;
|
||||
border-radius: var(--gi-radius-lg);
|
||||
padding: 0.72rem 0.85rem;
|
||||
background: rgba(5, 36, 32, 0.78);
|
||||
box-shadow: 0 14px 36px rgba(0, 0, 0, 0.22);
|
||||
box-shadow: var(--gi-shadow-lg);
|
||||
backdrop-filter: blur(8px);
|
||||
}
|
||||
|
||||
@@ -583,7 +583,7 @@ body.landing-body {
|
||||
width: 2.15rem;
|
||||
height: 2.15rem;
|
||||
place-items: center;
|
||||
border-radius: 0.62rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
background: rgba(83, 223, 196, 0.16);
|
||||
color: #7be7d1;
|
||||
}
|
||||
@@ -615,7 +615,7 @@ body.landing-body {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
border: 1px solid rgba(214, 246, 240, 0.18);
|
||||
border-radius: 0.72rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
background: rgba(5, 33, 30, 0.66);
|
||||
backdrop-filter: blur(8px);
|
||||
}
|
||||
@@ -666,7 +666,7 @@ body.landing-body {
|
||||
.landing-login-icon {
|
||||
width: 2.45rem;
|
||||
height: 2.45rem;
|
||||
border-radius: 0.68rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
}
|
||||
|
||||
.landing-login-icon svg,
|
||||
@@ -683,7 +683,7 @@ body.landing-body {
|
||||
margin: 0 0 0.22rem;
|
||||
color: var(--landing-primary);
|
||||
font-size: 0.59rem;
|
||||
font-weight: 800;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.09em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -714,7 +714,7 @@ body.landing-body {
|
||||
margin-top: 0.35rem;
|
||||
color: #49645f;
|
||||
font-size: 0.58rem;
|
||||
font-weight: 800;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.055em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -723,7 +723,7 @@ body.landing-body {
|
||||
width: 100%;
|
||||
min-height: 2.85rem;
|
||||
border: 1px solid #b8d1cc;
|
||||
border-radius: 0.62rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
padding: 0.7rem 0.78rem;
|
||||
background: #f4fbf9;
|
||||
color: var(--landing-ink);
|
||||
@@ -759,7 +759,7 @@ body.landing-body {
|
||||
height: 2.15rem;
|
||||
place-items: center;
|
||||
border: 0;
|
||||
border-radius: 0.5rem;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
background: transparent;
|
||||
color: #55716b;
|
||||
transform: translateY(-50%);
|
||||
@@ -784,19 +784,19 @@ body.landing-body {
|
||||
justify-content: center;
|
||||
margin-top: 0.55rem;
|
||||
border: 1px solid var(--landing-primary);
|
||||
border-radius: 0.66rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
padding: 0.72rem 1rem;
|
||||
background: var(--landing-primary);
|
||||
color: #fff;
|
||||
font-size: 0.77rem;
|
||||
font-weight: 750;
|
||||
box-shadow: 0 10px 24px rgba(8, 120, 108, 0.16);
|
||||
font-weight: 600;
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
transition: background 160ms ease, transform 160ms ease, box-shadow 160ms ease;
|
||||
}
|
||||
|
||||
.landing-operator-submit:hover:not(:disabled) {
|
||||
background: var(--landing-primary-strong);
|
||||
box-shadow: 0 14px 26px rgba(8, 120, 108, 0.22);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
@@ -814,7 +814,7 @@ body.landing-body {
|
||||
margin: 0.5rem 0 0;
|
||||
border: 1px solid #efc4c1;
|
||||
border-left: 3px solid #a23e38;
|
||||
border-radius: 0.5rem;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
padding: 0.62rem 0.72rem;
|
||||
background: #fff3f2;
|
||||
color: #7c2d29;
|
||||
@@ -830,7 +830,7 @@ body.landing-body {
|
||||
margin: 1.15rem 0;
|
||||
color: #78908b;
|
||||
font-size: 0.58rem;
|
||||
font-weight: 650;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.landing-access-divider::before,
|
||||
@@ -846,7 +846,7 @@ body.landing-body {
|
||||
gap: 0.7rem;
|
||||
align-items: start;
|
||||
border: 1px solid #bfe0d9;
|
||||
border-radius: 0.75rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
padding: 0.78rem;
|
||||
background: linear-gradient(135deg, #f2fcfa, #ecf8f5);
|
||||
}
|
||||
@@ -854,7 +854,7 @@ body.landing-body {
|
||||
.landing-guest-icon {
|
||||
width: 2.15rem;
|
||||
height: 2.15rem;
|
||||
border-radius: 0.58rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
}
|
||||
|
||||
.landing-guest-access > div {
|
||||
@@ -881,12 +881,12 @@ body.landing-body {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border: 1px solid #90c8bd;
|
||||
border-radius: 0.6rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
padding: 0.62rem 0.78rem;
|
||||
background: #fff;
|
||||
color: var(--landing-primary-strong);
|
||||
font-size: 0.71rem;
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
|
||||
}
|
||||
|
||||
@@ -970,12 +970,12 @@ body.landing-body {
|
||||
overflow: hidden;
|
||||
min-height: 18rem;
|
||||
border: 1px solid var(--landing-line-soft);
|
||||
border-radius: 1rem;
|
||||
border-radius: var(--gi-radius-lg);
|
||||
padding: clamp(1.35rem, 2.5vw, 1.85rem);
|
||||
background:
|
||||
linear-gradient(180deg, rgba(242, 250, 248, 0.58), transparent 55%),
|
||||
#fff;
|
||||
box-shadow: 0 18px 45px rgba(19, 63, 56, 0.07);
|
||||
box-shadow: var(--gi-shadow-lg);
|
||||
transition: border-color 170ms ease, transform 170ms ease, box-shadow 170ms ease;
|
||||
}
|
||||
|
||||
@@ -992,7 +992,7 @@ body.landing-body {
|
||||
|
||||
.landing-capability:hover {
|
||||
border-color: #acd1ca;
|
||||
box-shadow: 0 23px 52px rgba(19, 63, 56, 0.1);
|
||||
box-shadow: var(--gi-shadow-lg);
|
||||
transform: translateY(-3px);
|
||||
}
|
||||
|
||||
@@ -1007,7 +1007,7 @@ body.landing-body {
|
||||
width: 2.85rem;
|
||||
height: 2.85rem;
|
||||
place-items: center;
|
||||
border-radius: 0.78rem;
|
||||
border-radius: var(--gi-radius-lg);
|
||||
background: var(--landing-mint);
|
||||
color: var(--landing-primary);
|
||||
}
|
||||
@@ -1021,7 +1021,7 @@ body.landing-body {
|
||||
color: #9aafaa;
|
||||
font-family: "Manrope", sans-serif;
|
||||
font-size: 0.68rem;
|
||||
font-weight: 800;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.1em;
|
||||
}
|
||||
|
||||
@@ -1058,9 +1058,9 @@ body.landing-body {
|
||||
min-height: 37rem;
|
||||
overflow: hidden;
|
||||
border: 1px solid rgba(115, 151, 144, 0.45);
|
||||
border-radius: 1.2rem;
|
||||
border-radius: var(--gi-radius-xl);
|
||||
background: #0a2824;
|
||||
box-shadow: 0 28px 70px rgba(10, 48, 42, 0.17);
|
||||
box-shadow: var(--gi-shadow-lg);
|
||||
isolation: isolate;
|
||||
}
|
||||
|
||||
@@ -1112,7 +1112,7 @@ body.landing-body {
|
||||
margin: 0 0 0.7rem;
|
||||
color: #7be6d1;
|
||||
font-size: 0.65rem;
|
||||
font-weight: 800;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.1em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -1145,11 +1145,11 @@ body.landing-body {
|
||||
gap: 0.65rem;
|
||||
align-items: center;
|
||||
border: 1px solid rgba(202, 244, 236, 0.28);
|
||||
border-radius: 0.72rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
padding: 0.68rem 0.78rem;
|
||||
background: rgba(4, 38, 34, 0.76);
|
||||
color: #fff;
|
||||
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.23);
|
||||
box-shadow: var(--gi-shadow-lg);
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
@@ -1203,12 +1203,12 @@ body.landing-body {
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
place-items: center;
|
||||
border-radius: 0.55rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
background: var(--landing-mint);
|
||||
color: var(--landing-primary-strong);
|
||||
font-family: "Manrope", sans-serif;
|
||||
font-size: 0.61rem;
|
||||
font-weight: 800;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.landing-workflow-steps h3 {
|
||||
@@ -1231,7 +1231,7 @@ body.landing-body {
|
||||
align-items: start;
|
||||
margin-top: 1.35rem;
|
||||
border: 1px solid #c2ddd7;
|
||||
border-radius: 0.8rem;
|
||||
border-radius: var(--gi-radius-lg);
|
||||
padding: 1rem;
|
||||
background: linear-gradient(135deg, #effbf8, #f7fcfb);
|
||||
scroll-margin-top: 6rem;
|
||||
@@ -1278,7 +1278,7 @@ body.landing-body {
|
||||
.landing-footer-mark {
|
||||
width: 2.25rem;
|
||||
height: 2.25rem;
|
||||
border-radius: 0.65rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
}
|
||||
|
||||
.landing-footer strong {
|
||||
@@ -1308,7 +1308,7 @@ body.landing-body {
|
||||
.landing-footer .itworx-signature > span {
|
||||
color: rgba(255, 255, 255, 0.45);
|
||||
font-size: 0.53rem;
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.07em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -1388,7 +1388,7 @@ body.landing-body {
|
||||
height: 2.45rem;
|
||||
place-items: center;
|
||||
border: 1px solid var(--landing-line);
|
||||
border-radius: 0.62rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
color: var(--landing-ink);
|
||||
}
|
||||
@@ -1409,10 +1409,10 @@ body.landing-body {
|
||||
align-items: stretch;
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--landing-line);
|
||||
border-radius: 0.8rem;
|
||||
border-radius: var(--gi-radius-lg);
|
||||
padding: 0.35rem;
|
||||
background: rgba(255, 255, 255, 0.98);
|
||||
box-shadow: 0 18px 45px rgba(10, 55, 48, 0.15);
|
||||
box-shadow: var(--gi-shadow-lg);
|
||||
}
|
||||
|
||||
.landing-nav-open {
|
||||
@@ -1420,7 +1420,7 @@ body.landing-body {
|
||||
}
|
||||
|
||||
.landing-nav a {
|
||||
border-radius: 0.55rem;
|
||||
border-radius: var(--gi-radius-md);
|
||||
padding: 0.75rem 0.8rem;
|
||||
}
|
||||
|
||||
@@ -1720,3 +1720,13 @@ body.landing-body {
|
||||
transition-duration: 0.01ms !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* De storingsmelding onder de knop, zolang de bezoeker nog niets geprobeerd
|
||||
heeft. Een mededeling, geen fout: zie de toelichting in LandingPage.tsx. */
|
||||
.landing-login-note {
|
||||
margin: 0.7rem 0 0;
|
||||
color: var(--landing-muted);
|
||||
font-size: 0.78rem;
|
||||
line-height: 1.45;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
+135
-135
@@ -60,14 +60,14 @@ body {
|
||||
|
||||
.workbench-shell button {
|
||||
border-color: var(--line-strong);
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
box-shadow: none;
|
||||
transition: border-color 120ms ease, background-color 120ms ease, color 120ms ease, box-shadow 120ms ease;
|
||||
}
|
||||
|
||||
.workbench-shell button:hover:not(:disabled) {
|
||||
border-color: #8fa3ae;
|
||||
background: #f8fafb;
|
||||
border-color: var(--gi-line);
|
||||
background: var(--gi-info-soft);
|
||||
box-shadow: 0 0 0 3px rgba(40, 105, 168, 0.08);
|
||||
}
|
||||
|
||||
@@ -87,7 +87,7 @@ body {
|
||||
.workbench-shell select,
|
||||
.workbench-shell textarea {
|
||||
border-color: var(--line-strong);
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@@ -96,9 +96,9 @@ body {
|
||||
.workbench-shell .context-bar span,
|
||||
.workbench-shell .status-tile-topline > span:first-child,
|
||||
.workbench-shell .inspector-field > span {
|
||||
color: #6b7782;
|
||||
color: var(--gi-ink-600);
|
||||
font-size: 0.69rem;
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@@ -115,7 +115,7 @@ body {
|
||||
align-items: center;
|
||||
border-bottom: 1px solid var(--line);
|
||||
padding: 0.65rem 1.25rem;
|
||||
background: rgba(255, 255, 255, 0.98);
|
||||
background: var(--gi-surface);
|
||||
box-shadow: 0 1px 0 rgba(23, 33, 43, 0.03);
|
||||
backdrop-filter: blur(14px);
|
||||
}
|
||||
@@ -133,11 +133,11 @@ body {
|
||||
height: 2.25rem;
|
||||
flex: 0 0 2.25rem;
|
||||
place-items: center;
|
||||
border-radius: 7px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
background: #123238;
|
||||
color: #ffffff;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 850;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.brand-block h1 {
|
||||
@@ -160,8 +160,8 @@ body {
|
||||
gap: 0;
|
||||
justify-content: stretch;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 7px;
|
||||
background: #f8fafb;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
background: var(--gi-info-soft);
|
||||
}
|
||||
|
||||
.context-bar > div {
|
||||
@@ -188,7 +188,7 @@ body {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
margin-top: 0.16rem;
|
||||
color: #27343f;
|
||||
color: var(--gi-ink-800);
|
||||
font-size: 0.78rem;
|
||||
line-height: 1.2;
|
||||
text-overflow: ellipsis;
|
||||
@@ -208,7 +208,7 @@ body {
|
||||
overflow: auto;
|
||||
border-right: 1px solid var(--line);
|
||||
padding: 0.9rem 0.7rem;
|
||||
background: #f8fafb;
|
||||
background: var(--gi-info-soft);
|
||||
}
|
||||
|
||||
.workbench-sidebar nav {
|
||||
@@ -233,16 +233,16 @@ body {
|
||||
width: 100%;
|
||||
min-height: 2.7rem;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
padding: 0.52rem 0.65rem;
|
||||
background: transparent;
|
||||
color: #34424d;
|
||||
color: var(--gi-ink-800);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.nav-item span {
|
||||
font-size: 0.86rem;
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.nav-item small {
|
||||
@@ -250,7 +250,7 @@ body {
|
||||
}
|
||||
|
||||
.nav-item-active {
|
||||
border-color: #c8ded9;
|
||||
border-color: var(--gi-brand-50);
|
||||
background: var(--accent-soft);
|
||||
color: var(--accent-strong);
|
||||
box-shadow: inset 3px 0 0 var(--accent);
|
||||
@@ -259,9 +259,9 @@ body {
|
||||
.nav-item-active small {
|
||||
display: block;
|
||||
margin-top: 0.18rem;
|
||||
color: #50746e;
|
||||
color: var(--gi-ink-600);
|
||||
font-size: 0.69rem;
|
||||
font-weight: 550;
|
||||
font-weight: 500;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
@@ -271,7 +271,7 @@ body {
|
||||
}
|
||||
|
||||
.workbench-sidebar .nav-item-active {
|
||||
border-color: #c8ded9;
|
||||
border-color: var(--gi-brand-50);
|
||||
background: var(--accent-soft);
|
||||
}
|
||||
|
||||
@@ -359,8 +359,8 @@ body {
|
||||
border: 0;
|
||||
border-left: 1px solid var(--line);
|
||||
padding: 1rem;
|
||||
background: #ffffff;
|
||||
box-shadow: -18px 0 44px rgba(28, 42, 53, 0.16);
|
||||
background: var(--gi-surface);
|
||||
box-shadow: var(--gi-shadow-lg);
|
||||
}
|
||||
|
||||
.inspector-header {
|
||||
@@ -374,7 +374,7 @@ body {
|
||||
margin: -1rem -1rem 0.8rem;
|
||||
border-bottom: 1px solid var(--line);
|
||||
padding: 1rem;
|
||||
background: rgba(255, 255, 255, 0.98);
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.inspector-header h2 {
|
||||
@@ -409,7 +409,7 @@ body {
|
||||
}
|
||||
|
||||
.inspector-tab-active {
|
||||
border-color: #b6d6d0;
|
||||
border-color: var(--gi-brand-50);
|
||||
background: var(--accent-soft);
|
||||
color: var(--accent-strong);
|
||||
}
|
||||
@@ -448,8 +448,8 @@ body {
|
||||
.handoff-action-card,
|
||||
.system-provider-card {
|
||||
border-color: var(--line);
|
||||
border-radius: 7px;
|
||||
background: #ffffff;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
background: var(--gi-surface);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@@ -469,10 +469,10 @@ body {
|
||||
.status-pill,
|
||||
.status-badge,
|
||||
.workflow-step-status {
|
||||
border-radius: 999px;
|
||||
background: #edf2f4;
|
||||
color: #4e5d68;
|
||||
font-weight: 700;
|
||||
border-radius: var(--gi-radius-pill);
|
||||
background: var(--gi-info-soft);
|
||||
color: var(--gi-ink-600);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.data-panel-form-block,
|
||||
@@ -488,23 +488,23 @@ body {
|
||||
|
||||
.table-scroll {
|
||||
border-color: var(--line);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
}
|
||||
|
||||
table thead th {
|
||||
background: #f4f7f8;
|
||||
color: #53616d;
|
||||
background: var(--gi-info-soft);
|
||||
color: var(--gi-ink-600);
|
||||
}
|
||||
|
||||
table tbody tr:hover {
|
||||
background: #f7fafb;
|
||||
background: var(--gi-info-soft);
|
||||
}
|
||||
|
||||
.error,
|
||||
.warning-message,
|
||||
.success-message,
|
||||
.demo-message {
|
||||
border-radius: 6px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
}
|
||||
|
||||
/* Data workspace */
|
||||
@@ -512,9 +512,9 @@ table tbody tr:hover {
|
||||
details.data-panel-form-block {
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
padding: 0;
|
||||
background: #f8fafb;
|
||||
background: var(--gi-info-soft);
|
||||
}
|
||||
|
||||
details.data-panel-form-block > summary {
|
||||
@@ -524,9 +524,9 @@ details.data-panel-form-block > summary {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0.65rem 0.75rem;
|
||||
color: #33424d;
|
||||
color: var(--gi-ink-800);
|
||||
font-size: 0.8rem;
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
@@ -542,7 +542,7 @@ details.data-panel-form-block > summary::after {
|
||||
|
||||
details.data-panel-form-block[open] > summary {
|
||||
border-bottom: 1px solid var(--line);
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
details.data-panel-form-block[open] > summary::after {
|
||||
@@ -560,7 +560,7 @@ details.data-panel-form-block > form {
|
||||
|
||||
.workspace-grid-data .data-selection-summary {
|
||||
border-left: 3px solid var(--accent);
|
||||
background: #f7faf9;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.workspace-grid-data .data-panel-list-block {
|
||||
@@ -576,26 +576,26 @@ details.data-panel-form-block > form {
|
||||
gap: 0.55rem;
|
||||
padding: 0.65rem;
|
||||
border-bottom: 1px solid var(--line);
|
||||
background: #f8fafb;
|
||||
background: var(--gi-info-soft);
|
||||
}
|
||||
|
||||
.catalog-browser-toolbar-datasets {
|
||||
margin-bottom: 0.65rem;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
}
|
||||
|
||||
.catalog-search-field {
|
||||
display: grid;
|
||||
gap: 0.3rem;
|
||||
color: #53616d;
|
||||
color: var(--gi-ink-600);
|
||||
font-size: 0.74rem;
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.catalog-search-field input {
|
||||
margin: 0;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.catalog-pagination {
|
||||
@@ -662,9 +662,9 @@ details.data-panel-form-block > form {
|
||||
details.ai-lab-model-surface {
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
padding: 0;
|
||||
background: #f8fafb;
|
||||
background: var(--gi-info-soft);
|
||||
}
|
||||
|
||||
details.ai-lab-model-surface > summary {
|
||||
@@ -675,9 +675,9 @@ details.ai-lab-model-surface > summary {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0.65rem 0.75rem;
|
||||
color: #33424d;
|
||||
color: var(--gi-ink-800);
|
||||
font-size: 0.8rem;
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
@@ -699,13 +699,13 @@ details.ai-lab-model-surface > summary strong {
|
||||
margin-left: auto;
|
||||
color: var(--muted);
|
||||
font-size: 0.72rem;
|
||||
font-weight: 650;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.ai-lab-disclosure-body {
|
||||
border-top: 1px solid var(--line);
|
||||
padding: 0.75rem;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.ai-lab-shell .lab-block,
|
||||
@@ -714,8 +714,8 @@ details.ai-lab-model-surface > summary strong {
|
||||
.ai-lab-shell .ai-lab-qa-surface,
|
||||
.ai-lab-shell > .ai-lab-model-surface[aria-label="Local model asset selection"] {
|
||||
border-color: var(--line);
|
||||
border-radius: 6px;
|
||||
background: #ffffff;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
background: var(--gi-surface);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@@ -773,9 +773,9 @@ details.ai-lab-model-surface > summary strong {
|
||||
.workbench-status-strip {
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 7px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
padding: 0;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.status-strip-header {
|
||||
@@ -786,7 +786,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
margin: 0;
|
||||
border-bottom: 1px solid var(--line);
|
||||
padding: 1.1rem 1.2rem;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.status-strip-header h2 {
|
||||
@@ -821,7 +821,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
margin-top: 0.25rem;
|
||||
color: var(--muted);
|
||||
font-size: 0.72rem;
|
||||
font-weight: 650;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.status-strip-grid {
|
||||
@@ -838,7 +838,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
border-right: 1px solid var(--line);
|
||||
border-radius: 0;
|
||||
padding: 0.75rem 0.8rem;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.status-tile:last-child {
|
||||
@@ -861,7 +861,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
margin-top: 0.4rem;
|
||||
color: #23313b;
|
||||
color: var(--gi-ink-800);
|
||||
font-size: 0.87rem;
|
||||
line-height: 1.25;
|
||||
-webkit-box-orient: vertical;
|
||||
@@ -882,12 +882,12 @@ details.ai-lab-model-surface > summary strong {
|
||||
.source-freshness-panel {
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 7px;
|
||||
background: #ffffff;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.source-freshness-header {
|
||||
display: flex !important;
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
@@ -925,7 +925,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
border-top: 1px solid var(--line);
|
||||
border-bottom: 1px solid var(--line);
|
||||
background: #f8fafb;
|
||||
background: var(--gi-info-soft);
|
||||
}
|
||||
|
||||
.source-freshness-summary span {
|
||||
@@ -942,7 +942,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
.source-freshness-summary strong {
|
||||
display: block;
|
||||
margin-bottom: 0.15rem;
|
||||
color: #24333d;
|
||||
color: var(--gi-ink-800);
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
|
||||
@@ -985,7 +985,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
}
|
||||
|
||||
.source-freshness-main strong {
|
||||
color: #23313b;
|
||||
color: var(--gi-ink-800);
|
||||
font-size: 0.86rem;
|
||||
}
|
||||
|
||||
@@ -1002,8 +1002,8 @@ details.ai-lab-model-surface > summary strong {
|
||||
|
||||
.source-freshness-status {
|
||||
flex: 0 0 auto;
|
||||
color: #33424d !important;
|
||||
font-weight: 750;
|
||||
color: var(--gi-ink-800);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.source-freshness-meta {
|
||||
@@ -1026,7 +1026,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
|
||||
.source-catalog-section {
|
||||
border-top: 1px solid var(--line);
|
||||
background: #fbfcfd;
|
||||
background: var(--gi-info-soft);
|
||||
}
|
||||
|
||||
.source-catalog-heading {
|
||||
@@ -1043,7 +1043,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
}
|
||||
|
||||
.source-catalog-heading strong {
|
||||
color: #23313b;
|
||||
color: var(--gi-ink-800);
|
||||
font-size: 0.84rem;
|
||||
}
|
||||
|
||||
@@ -1055,7 +1055,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
|
||||
.source-catalog-heading > span {
|
||||
flex: 0 0 auto;
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.source-catalog-empty {
|
||||
@@ -1105,7 +1105,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
|
||||
.grb-refresh-plan {
|
||||
border-top: 1px solid var(--line);
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.grb-refresh-plan-heading {
|
||||
@@ -1123,7 +1123,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
}
|
||||
|
||||
.grb-refresh-plan-heading strong {
|
||||
color: #23313b;
|
||||
color: var(--gi-ink-800);
|
||||
font-size: 0.84rem;
|
||||
}
|
||||
|
||||
@@ -1134,7 +1134,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
|
||||
.grb-refresh-plan-heading > span {
|
||||
flex: 0 0 auto;
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.grb-refresh-layer-list {
|
||||
@@ -1181,9 +1181,9 @@ details.ai-lab-model-surface > summary strong {
|
||||
}
|
||||
|
||||
.grb-refresh-layer > div:first-child span {
|
||||
color: #4d5c66;
|
||||
color: var(--gi-ink-600);
|
||||
font-size: 0.72rem;
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.grb-refresh-layer p {
|
||||
@@ -1198,9 +1198,9 @@ details.ai-lab-model-surface > summary strong {
|
||||
gap: 1rem;
|
||||
justify-content: space-between;
|
||||
padding: 0.72rem 1rem;
|
||||
color: #33424d;
|
||||
color: var(--gi-ink-800);
|
||||
font-size: 0.78rem;
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.source-freshness-list {
|
||||
@@ -1274,7 +1274,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
border: 1px solid var(--line);
|
||||
border-left: 1px solid var(--line);
|
||||
padding: 1rem 1.1rem;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.workflow-guidance-panel .panel-title-row {
|
||||
@@ -1295,23 +1295,23 @@ details.ai-lab-model-surface > summary strong {
|
||||
min-width: 0;
|
||||
min-height: 5rem;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
padding: 0.65rem;
|
||||
background: #f5f7f8;
|
||||
background: var(--gi-surface);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.workflow-guidance-step:hover:not(:disabled) {
|
||||
border-color: #bdcbd2;
|
||||
background: #f0f4f5;
|
||||
border-color: var(--gi-line);
|
||||
background: var(--gi-surface-soft);
|
||||
}
|
||||
|
||||
.workflow-guidance-step-ready {
|
||||
background: #f0f7f4;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.workflow-guidance-step-active {
|
||||
border-color: #91c5ba;
|
||||
border-color: var(--gi-brand-50);
|
||||
background: var(--accent-soft);
|
||||
}
|
||||
|
||||
@@ -1334,7 +1334,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
border: 1px solid var(--line);
|
||||
border-left: 1px solid var(--line);
|
||||
padding: 0.8rem 1rem;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.overview-action-copy h2 {
|
||||
@@ -1380,7 +1380,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
order: 1;
|
||||
border: 1px solid var(--line);
|
||||
padding: 0.75rem;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.map-workspace-shell .map-toolbar {
|
||||
@@ -1398,9 +1398,9 @@ details.ai-lab-model-surface > summary strong {
|
||||
.layer-control-card {
|
||||
min-height: 3.9rem;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
padding: 0.45rem 0.55rem;
|
||||
background: #f8fafb;
|
||||
background: var(--gi-info-soft);
|
||||
}
|
||||
|
||||
.map-status {
|
||||
@@ -1411,9 +1411,9 @@ details.ai-lab-model-surface > summary strong {
|
||||
min-height: auto;
|
||||
align-content: center;
|
||||
border-left: 3px solid var(--accent);
|
||||
border-radius: 4px;
|
||||
border-radius: var(--gi-radius-xs);
|
||||
padding: 0.45rem 0.65rem;
|
||||
background: #f3f8f7;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.map-status strong {
|
||||
@@ -1445,8 +1445,8 @@ details.ai-lab-model-surface > summary strong {
|
||||
.detection-qa-diagnostic span {
|
||||
color: var(--muted);
|
||||
font-size: 0.68rem;
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
.detection-qa-diagnostic strong {
|
||||
@@ -1461,15 +1461,15 @@ details.ai-lab-model-surface > summary strong {
|
||||
|
||||
.detection-qa-diagnostic-caution {
|
||||
border-left-color: var(--warning);
|
||||
background: #fff8eb;
|
||||
background: var(--gi-warn-soft);
|
||||
}
|
||||
|
||||
.basemap-policy-notice {
|
||||
margin-bottom: 0.65rem;
|
||||
border: 0;
|
||||
border-radius: 5px;
|
||||
border-radius: var(--gi-radius-xs);
|
||||
padding: 0.45rem 0.6rem;
|
||||
background: #f3f6f8;
|
||||
background: var(--gi-info-soft);
|
||||
}
|
||||
|
||||
.basemap-policy-notice strong,
|
||||
@@ -1480,11 +1480,11 @@ details.ai-lab-model-surface > summary strong {
|
||||
.map-frame-surface {
|
||||
order: 2;
|
||||
overflow: hidden;
|
||||
border: 1px solid #aebac2;
|
||||
border-radius: 7px;
|
||||
border: 1px solid var(--gi-line);
|
||||
border-radius: var(--gi-radius-sm);
|
||||
padding: 0;
|
||||
background: #e9eff1;
|
||||
box-shadow: 0 7px 22px rgba(29, 43, 54, 0.09);
|
||||
background: var(--gi-info-soft);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
.map-frame-surface .map-container,
|
||||
@@ -1499,8 +1499,8 @@ details.ai-lab-model-surface > summary strong {
|
||||
.map-advanced-tools {
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 7px;
|
||||
background: #ffffff;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.map-layer-details {
|
||||
@@ -1524,9 +1524,9 @@ details.ai-lab-model-surface > summary strong {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0.7rem 0.85rem;
|
||||
color: #263540;
|
||||
color: var(--gi-ink-800);
|
||||
font-size: 0.82rem;
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
@@ -1597,8 +1597,8 @@ details.ai-lab-model-surface > summary strong {
|
||||
|
||||
.map-empty-state {
|
||||
margin: 0;
|
||||
border: 1px dashed #afbdc5;
|
||||
background: #f8fafb;
|
||||
border: 1px dashed var(--gi-line);
|
||||
background: var(--gi-info-soft);
|
||||
}
|
||||
|
||||
.map-inspection-surface {
|
||||
@@ -1613,9 +1613,9 @@ details.ai-lab-model-surface > summary strong {
|
||||
|
||||
.gis-test-run-surface {
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 7px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
padding: 1rem;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.gis-test-run-grid,
|
||||
@@ -1635,7 +1635,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
border-right: 1px solid var(--line);
|
||||
border-bottom: 1px solid var(--line);
|
||||
border-radius: 0;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.map-advanced-tools-body > div:nth-child(2n) {
|
||||
@@ -1644,8 +1644,8 @@ details.ai-lab-model-surface > summary strong {
|
||||
|
||||
.qa-evidence-map-status {
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 7px;
|
||||
background: #ffffff;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
/* Responsive shell */
|
||||
@@ -1736,7 +1736,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
border: 0;
|
||||
border-bottom: 1px solid var(--line);
|
||||
padding: 0.45rem 0.65rem;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.workbench-sidebar nav {
|
||||
@@ -1953,9 +1953,9 @@ details.ai-lab-model-surface > summary strong {
|
||||
display: grid;
|
||||
gap: 0.2rem;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
padding: 0.65rem 0.7rem;
|
||||
background: #f7faf9;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.geo-loaded-scope span,
|
||||
@@ -1974,7 +1974,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
gap: 0.8rem;
|
||||
border-top: 1px solid var(--line);
|
||||
padding: 0.8rem;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.technical-management-body > .compact-form {
|
||||
@@ -1992,8 +1992,8 @@ details.ai-lab-model-surface > summary strong {
|
||||
.export-history-disclosure {
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
background: #f8fafb;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
background: var(--gi-info-soft);
|
||||
}
|
||||
|
||||
.technical-run-list > summary,
|
||||
@@ -2012,9 +2012,9 @@ details.ai-lab-model-surface > summary strong {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0.62rem 0.75rem;
|
||||
color: #33424d;
|
||||
color: var(--gi-ink-800);
|
||||
font-size: 0.8rem;
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
@@ -2063,7 +2063,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
overflow: auto;
|
||||
border-top: 1px solid var(--line);
|
||||
padding: 0.65rem;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.quality-advanced-disclosure {
|
||||
@@ -2083,8 +2083,8 @@ details.ai-lab-model-surface > summary strong {
|
||||
margin: -0.25rem 0 0.65rem;
|
||||
border-left: 3px solid #b37a2d;
|
||||
padding: 0.45rem 0.65rem;
|
||||
background: #fffbeb;
|
||||
color: #6f4b18;
|
||||
background: var(--gi-warn-soft);
|
||||
color: var(--gi-warn);
|
||||
}
|
||||
|
||||
.quality-advanced-disclosure > summary strong {
|
||||
@@ -2138,7 +2138,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
overflow: auto;
|
||||
padding: 0.5rem;
|
||||
list-style: none;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.dataset-history-list li {
|
||||
@@ -2183,13 +2183,13 @@ details.ai-lab-model-surface > summary strong {
|
||||
min-width: 0;
|
||||
gap: 0.25rem;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
padding: 0.75rem;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.ai-user-summary-card-primary {
|
||||
border-color: #bfd8d2;
|
||||
border-color: var(--gi-brand-50);
|
||||
background: var(--accent-soft);
|
||||
}
|
||||
|
||||
@@ -2263,7 +2263,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
gap: 0.75rem;
|
||||
border-top: 1px solid var(--line);
|
||||
padding: 0.75rem;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.export-history-body > div:first-child {
|
||||
@@ -2321,15 +2321,15 @@ details.ai-lab-model-surface > summary strong {
|
||||
|
||||
.workflow-guidance-steps .workflow-guidance-step {
|
||||
border-color: transparent;
|
||||
background: #f5f7f8;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.workflow-guidance-steps .workflow-guidance-step-ready {
|
||||
background: #f0f7f4;
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.workflow-guidance-steps .workflow-guidance-step-active {
|
||||
border-color: #91c5ba;
|
||||
border-color: var(--gi-brand-50);
|
||||
background: var(--accent-soft);
|
||||
}
|
||||
}
|
||||
@@ -2349,7 +2349,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
width: fit-content;
|
||||
cursor: pointer;
|
||||
color: var(--muted);
|
||||
font-weight: 750;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.technical-inline-details[open] > summary {
|
||||
@@ -2429,7 +2429,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
min-width: 0;
|
||||
gap: 0.15rem;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
padding: 0.55rem;
|
||||
background: var(--panel-soft);
|
||||
}
|
||||
@@ -2449,7 +2449,7 @@ details.ai-lab-model-surface > summary strong {
|
||||
|
||||
.geo-image-quality-context {
|
||||
margin: 0;
|
||||
border-left: 2px solid #91c5ba;
|
||||
border-left: 2px solid var(--gi-brand-50);
|
||||
padding-left: 0.55rem;
|
||||
color: var(--muted);
|
||||
font-size: 0.7rem;
|
||||
@@ -2500,9 +2500,9 @@ details.ai-lab-model-surface > summary strong {
|
||||
display: grid;
|
||||
gap: 0.6rem;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--gi-radius-sm);
|
||||
padding: 0.7rem;
|
||||
background: #ffffff;
|
||||
background: var(--gi-surface);
|
||||
}
|
||||
|
||||
.detection-review-item-heading {
|
||||
|
||||
@@ -36,13 +36,13 @@
|
||||
}
|
||||
|
||||
.context-account-guest {
|
||||
border-color: #9fcfc4;
|
||||
color: #0c5e55;
|
||||
background: linear-gradient(180deg, #f7fffc, #e8f7f3);
|
||||
border-color: var(--gi-brand-50);
|
||||
color: var(--gi-brand-600);
|
||||
background: linear-gradient(180deg, var(--gi-brand-50), var(--gi-brand-50));
|
||||
}
|
||||
|
||||
.context-account-guest > svg {
|
||||
color: #0d7d6f;
|
||||
color: var(--gi-brand-600);
|
||||
}
|
||||
|
||||
.workbench-shell-guest .workbench-stage {
|
||||
@@ -57,18 +57,18 @@
|
||||
gap: 0.72rem;
|
||||
align-items: center;
|
||||
min-width: 0;
|
||||
border-bottom: 1px solid #b7dbd3;
|
||||
border-bottom: 1px solid var(--gi-brand-50);
|
||||
padding: 0.68rem 1.35rem;
|
||||
color: #164d47;
|
||||
color: var(--gi-brand-600);
|
||||
background:
|
||||
radial-gradient(circle at 12% 0%, rgba(57, 172, 151, 0.13), transparent 16rem),
|
||||
linear-gradient(90deg, #edf9f6, #f7fcfa);
|
||||
linear-gradient(90deg, var(--gi-brand-50), var(--gi-brand-50));
|
||||
}
|
||||
|
||||
.guest-mode-banner > svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
color: #0f766e;
|
||||
color: var(--gi-brand-600);
|
||||
}
|
||||
|
||||
.guest-mode-banner > div {
|
||||
@@ -85,7 +85,7 @@
|
||||
|
||||
.guest-mode-banner span:not(.guest-mode-badge) {
|
||||
overflow: hidden;
|
||||
color: #52736d;
|
||||
color: var(--gi-ink-600);
|
||||
font-size: 0.72rem;
|
||||
line-height: 1.4;
|
||||
text-overflow: ellipsis;
|
||||
@@ -93,13 +93,13 @@
|
||||
}
|
||||
|
||||
.guest-mode-badge {
|
||||
border: 1px solid #9bcfc3;
|
||||
border-radius: 999px;
|
||||
border: 1px solid var(--gi-brand-50);
|
||||
border-radius: var(--gi-radius-pill);
|
||||
padding: 0.33rem 0.62rem;
|
||||
color: #0d665b;
|
||||
background: rgba(255, 255, 255, 0.82);
|
||||
color: var(--gi-brand-600);
|
||||
background: color-mix(in srgb, var(--gi-surface) 82%, transparent);
|
||||
font-size: 0.66rem;
|
||||
font-weight: 800;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.045em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -112,12 +112,12 @@
|
||||
max-width: min(28rem, calc(100vw - 2rem));
|
||||
gap: 0.65rem;
|
||||
align-items: center;
|
||||
border: 1px solid #b7d9d1;
|
||||
border-radius: 0.85rem;
|
||||
border: 1px solid var(--gi-brand-50);
|
||||
border-radius: var(--gi-radius-lg);
|
||||
padding: 0.72rem 0.9rem;
|
||||
color: #164d47;
|
||||
color: var(--gi-brand-600);
|
||||
background: rgba(250, 255, 253, 0.97);
|
||||
box-shadow: 0 18px 44px rgba(9, 65, 57, 0.16);
|
||||
box-shadow: var(--gi-shadow-lg);
|
||||
backdrop-filter: blur(16px);
|
||||
}
|
||||
|
||||
@@ -125,9 +125,9 @@
|
||||
width: 0.85rem;
|
||||
height: 0.85rem;
|
||||
flex: 0 0 auto;
|
||||
border: 2px solid #b5ddd4;
|
||||
border: 2px solid var(--gi-brand-50);
|
||||
border-top-color: #0f766e;
|
||||
border-radius: 999px;
|
||||
border-radius: var(--gi-radius-pill);
|
||||
animation: geointel-guest-spin 0.8s linear infinite;
|
||||
}
|
||||
|
||||
@@ -145,9 +145,9 @@
|
||||
grid-template-columns: auto minmax(0, 1fr);
|
||||
gap: 0.78rem;
|
||||
align-items: start;
|
||||
border: 1px solid #b9ddd5;
|
||||
color: #174f48;
|
||||
background: linear-gradient(135deg, #eef9f6, #fbfefd);
|
||||
border: 1px solid var(--gi-brand-50);
|
||||
color: var(--gi-brand-600);
|
||||
background: linear-gradient(135deg, var(--gi-brand-50), var(--gi-brand-50));
|
||||
}
|
||||
|
||||
.geo-guest-preview-note {
|
||||
@@ -160,7 +160,7 @@
|
||||
width: 1.12rem;
|
||||
height: 1.12rem;
|
||||
margin-top: 0.08rem;
|
||||
color: #0f766e;
|
||||
color: var(--gi-brand-600);
|
||||
}
|
||||
|
||||
.geo-guest-preview-note > div,
|
||||
@@ -177,21 +177,21 @@
|
||||
|
||||
.geo-guest-preview-note span,
|
||||
.guest-readonly-card span {
|
||||
color: #54756f;
|
||||
color: var(--gi-ink-600);
|
||||
font-size: 0.72rem;
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.guest-readonly-card {
|
||||
border-radius: 0.9rem;
|
||||
border-radius: var(--gi-radius-lg);
|
||||
padding: 0.9rem 1rem;
|
||||
box-shadow: 0 8px 22px rgba(20, 81, 71, 0.06);
|
||||
box-shadow: var(--gi-shadow-md);
|
||||
}
|
||||
|
||||
.geo-result-next-actions-readonly {
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
border-color: #b9dcd4;
|
||||
background: #f1faf7;
|
||||
border-color: var(--gi-brand-50);
|
||||
background: var(--gi-brand-50);
|
||||
}
|
||||
|
||||
.geo-result-next-actions-readonly small {
|
||||
|
||||
Reference in New Issue
Block a user