Joseph Doherty
c3277b52c9
Wave-0 reviewer findings (no Critical/High): - T0-1 M: ContextMenuItem.OnClick Action→Func<Task> (kills async-void at menu call sites Wave A/B/C need); keyboard-activated ⋯ now anchors below the button instead of viewport (0,0); focus returns to trigger on close; backdrop closes on native right-click too. - T0-3 M: guard test now discovers *DriverFactoryExtensions.Register by convention from the deployed driver assemblies instead of a hand-copied list, so a future driver lacking a constant is actually caught. - T0-2 L: corrected the round-trip 'sole non-round-trippable shape' comment (any table whose final row is a lone empty field). Claude-Session: https://claude.ai/code/session_01LVneM3eh1UtJxEisFXgmox
108 lines
2.3 KiB
CSS
108 lines
2.3 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 in light and dark. */
|
|
|
|
.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);
|
|
}
|