modelcontextprotocol/inspector
Watch
1
0
Fork
You've already forked inspector
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 2

web: server-screen, footer, monitoring-sidebar, and responsive-header polish (#1683)
Some checks failed
Run install, format, lint, build, and test on every push / build (push) Has been cancelled
Details
Run install, format, lint, build, and test on every push / publish (push) Has been cancelled
Details
Run install, format, lint, build, and test on every push / publish-github-container-registry (push) Has been cancelled
Details

Browse source 
Closes #1682

Server-screen, footer, monitoring-sidebar, and responsive-header polish: connected-card highlight/scroll + Failed status, footer row + MCP-docs tooltip, Servers box, card-surface refresh (gray-0 entry cards + white code), monitoring-sidebar layout, a 1280px responsive floor honored by the header (always-icon Disconnect, always-SegmentedControl tabs, 1500px status text, always-available sidebar), a horizontally-scrollable long resource URI in the compact Protocol entry, and copy buttons beside resource URIs / network URLs.

🤖 Generated with [Claude Code](https://claude.com/claude-code)
This commit is contained in:
Cliff Hall 2026-07-14 08:55:39 -04:00 • committed by GitHub
commit 8d33e76f97
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 707 additions and 274 deletions
Download patch file Download diff file Expand all files Collapse all files

25
clients/web/src/theme/Text.ts
View file

@ -37,33 +37,20 @@ export const ThemeText = Text.extend({
},
};
}
// Two small, unobtrusive labels pinned to the bottom corners of the screen
// on the same row (#1639): the build version (bottom-left) and the
// copyright notice (bottom-right). Each occupies the full-height `xl` bottom
// margin band (`height: xl` + flex centering) so the text sits vertically
// centered in it, and insets by `xl` horizontally to line up with the
// content's left/right margins. Both are grey, non-interactive (clicks pass
// through), and out of the tab/selection flow.
// Two small, unobtrusive labels that sit in the footer row (#1682): the
// build version (left) and the copyright notice (right), positioned by the
// footer's `space-between` Group. Both are grey, single-line, and out of the
// text-selection flow. (Superseded the fixed bottom-corner badges of #1639
// now that the footer is a real, full-width AppShell row.)
if (
props.variant === "versionBadge" ||
props.variant === "copyrightBadge"
) {
const horizontal =
props.variant === "versionBadge"
? { left: "var(--mantine-spacing-xl)" }
: { right: "var(--mantine-spacing-xl)" };
return {
root: {
position: "fixed",
bottom: 0,
height: "var(--mantine-spacing-xl)",
display: "flex",
alignItems: "center",
...horizontal,
zIndex: 100,
color: "var(--inspector-text-secondary)",
fontSize: "var(--mantine-font-size-xs)",
pointerEvents: "none",
whiteSpace: "nowrap",
userSelect: "none",
},
};