Joseph Doherty
697a773340
Foundation task of the AdminUI UI sweep. CSS/link/doc only — no behavior change
beyond restoring styles that were built but never served.
- App.razor: link the RCL's scoped-CSS bundle
(_content/ZB.MOM.WW.OtOpcUa.AdminUI/ZB.MOM.WW.OtOpcUa.AdminUI.bundle.scp.css).
It is produced on every compile and served by the Host, but nothing referenced
it, so ContextMenu.razor.css was dead at runtime and context menus rendered
in-flow with no position:fixed.
- site.css: three additions.
* .btn / .btn-sm sizing as Bootstrap CSS-VARIABLE overrides (never box
properties — .btn-group depends on Bootstrap's own .btn rules for its seams
and end-cap radii). Theme 0.3.1 ships no .btn rule, so Bootstrap's 1rem
applied against the theme's 0.9rem body. Upstreaming candidate, same as the
ignitionoee router's app.css.
* .notice-alert — red variant of the kit's amber .notice, on the --bad/
--bad-bg/--bad-border tokens. The 13 existing call sites hack this with
style="border-color:var(--alert)", and no --alert token exists anywhere, so
the tint silently no-ops today. Call-site migration is a separate task.
* .tree-twist — shared 18px expander column for the tree components, replacing
repeated inline style="width:18px". Rows are d-flex, so flex-basis is what
actually holds the column. Adoption is a separate task.
- ContextMenu.razor.css: correct the header comment — the kit is light-only
(no dark block in Theme 0.3.1, site.css, or this file). No rule changes.
- docs/Telemetry.md: record that driver-health is keyed per driver instance
across the cluster, not per Akka member (the wire record carries no per-member
identity). The fact previously lived only in Hosts.razor page copy.
- docs/Configuration.md: new audit-log subsection recording that EventId gives
cross-restart dedup, enforced by the filtered unique index
UX_ConfigAuditLog_EventId, so a retried apply inserts no duplicate row;
CorrelationId joins a row to its originating workflow. Previously only in the
historical v2 rebuild plan and ClusterAudit page copy.
110 lines
2.5 KiB
CSS
110 lines
2.5 KiB
CSS
/* Scoped styles for ContextMenu. Colours come from the shared ZB.MOM.WW.Theme
|
|
tokens (theme.css) so the menu tracks the app palette. The kit is light-only —
|
|
Theme 0.3.1 ships no dark-scheme block, and neither does site.css or this file —
|
|
so there is no dark variant to track. */
|
|
|
|
.ctx-surface {
|
|
display: inline;
|
|
}
|
|
|
|
/* Positioned wrap so a keyboard-opened menu can anchor below the "⋯" button. */
|
|
.ctx-ellipsis-wrap {
|
|
position: relative;
|
|
display: inline-block;
|
|
}
|
|
|
|
/* The "⋯" fallback trigger — a compact, quiet icon button. */
|
|
.ctx-ellipsis {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 1.75rem;
|
|
height: 1.75rem;
|
|
padding: 0;
|
|
border: 1px solid transparent;
|
|
border-radius: 0.375rem;
|
|
background: transparent;
|
|
color: var(--ink-soft);
|
|
font-size: 1.1rem;
|
|
line-height: 1;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.ctx-ellipsis:hover,
|
|
.ctx-ellipsis[aria-expanded="true"] {
|
|
background: var(--hover-bg);
|
|
border-color: var(--bs-border-color);
|
|
color: var(--ink);
|
|
}
|
|
|
|
/* Transparent full-viewport catch-all; sits just under the menu. */
|
|
.ctx-backdrop {
|
|
position: fixed;
|
|
inset: 0;
|
|
z-index: 1080;
|
|
background: transparent;
|
|
}
|
|
|
|
.ctx-menu {
|
|
position: fixed;
|
|
z-index: 1081; /* above the backdrop, below toasts (1090) */
|
|
min-width: 11rem;
|
|
max-width: 20rem;
|
|
padding: 0.25rem;
|
|
background: var(--card);
|
|
border: 1px solid var(--bs-border-color);
|
|
border-radius: 0.5rem;
|
|
box-shadow: 0 6px 24px rgba(0, 0, 0, 0.16);
|
|
outline: none;
|
|
}
|
|
|
|
/* Keyboard-opened placement: anchored just below the "⋯" trigger instead of the pointer. */
|
|
.ctx-menu--anchored {
|
|
position: absolute;
|
|
top: 100%;
|
|
left: 0;
|
|
margin-top: 0.25rem;
|
|
}
|
|
|
|
.ctx-item {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
width: 100%;
|
|
padding: 0.35rem 0.6rem;
|
|
border: 0;
|
|
border-radius: 0.375rem;
|
|
background: transparent;
|
|
color: var(--ink);
|
|
font-size: 0.875rem;
|
|
text-align: left;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.ctx-item:hover:not(:disabled),
|
|
.ctx-item.active:not(:disabled) {
|
|
background: var(--hover-bg);
|
|
}
|
|
|
|
.ctx-item:disabled {
|
|
color: var(--ink-faint);
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.ctx-icon {
|
|
display: inline-flex;
|
|
flex: 0 0 auto;
|
|
width: 1.1rem;
|
|
justify-content: center;
|
|
}
|
|
|
|
.ctx-label {
|
|
flex: 1 1 auto;
|
|
}
|
|
|
|
.ctx-separator {
|
|
height: 1px;
|
|
margin: 0.25rem 0.3rem;
|
|
background: var(--bs-border-color);
|
|
}
|