Selection never showed. getRowSx set a background on the <tr>, but every <td> paints background.paper over it, and the hover rule targets cells - so hover won and selection was invisible. Selection and hover are now both cell-level rules in DataTable, with selection first so hover layers on top, and rows carry an `is-selected` class from a new isRowSelected prop. Uptime, Docker and Infrastructure tables all had the same broken copy of this; they now share the one implementation, and any future table gets it for free. action.selected/selectedHover are defined explicitly and tinted with the brand, so a selected row reads as chosen rather than dirty. Kept low (6-11%) so the highlight does not swamp the row, especially in dark mode. From code review: - Dropped the Google Fonts @import at the top of index.css. Nothing has used Inter since the switch to Geist, and it was a render-blocking third-party request on every load - exactly what self-hosting the font was meant to avoid on air-gapped installs. - TextInput's autofill override painted background.default, which used to equal paper and no longer does, so Chrome-autofilled fields showed a grey block on white cards. Now paper. - Sidebar background moved from sx to the bgcolor prop (convention rule 1, and it was a new lint warning), and the backdropFilter dropped - the background is opaque, so the blur only cost a compositing layer. - Tab no longer bolds the selected label. That is the same reflow the ToggleButton change removed, and worse here because the indicator animates toward a target that moves as the label widens. - Corrected the StatBox gradient comment: contrastText is white in light mode but near-black in dark, so the constraint is staying near `main`, not staying dark. Claude-Session: https://claude.ai/code/session_01AbYLvwpEaZFXktHVcqrFRd
20 lines
257 B
CSS
20 lines
257 B
CSS
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
html,
|
|
body {
|
|
overscroll-behavior: none;
|
|
}
|
|
|
|
html {
|
|
scroll-behavior: smooth;
|
|
}
|
|
|
|
:root {
|
|
font-synthesis: none;
|
|
text-rendering: optimizeLegibility;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|