Paul Payne
8086a09bf7
A spatial control surface for the whole node. Tools, jobs, services, and frontends sit in lanes with program-source grips; edges show requires (dependency), same-program siblings, and exposure to LAN/Internet targets. Direct manipulation, each backed by the existing config PUT + apply: - drag a node to LAN/Internet to set reach (internal/public) - delete an exposure line or a node (with confirm) to unexpose/remove - right-click or the per-node ⋯ menu: open, restart, expose, delete - click the source grip to open the backing program Nodes are draggable with Shift-/toggle box-select; layout persists to localStorage with a reset control. Adds useSetReach/useDeleteDeployment hooks, the @xyflow/react dep, and the nav entry + route.
42 lines
1.1 KiB
CSS
42 lines
1.1 KiB
CSS
@import "tailwindcss";
|
|
|
|
:root {
|
|
--background: #0f1117;
|
|
--foreground: #e1e4e8;
|
|
--card: #161b22;
|
|
--card-foreground: #e1e4e8;
|
|
--border: #30363d;
|
|
--muted: #8b949e;
|
|
--primary: #58a6ff;
|
|
--destructive: #da3633;
|
|
--success: #238636;
|
|
}
|
|
|
|
body {
|
|
background-color: var(--background);
|
|
color: var(--foreground);
|
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
|
|
}
|
|
|
|
/* Native <select> popups otherwise fall back to the OS default (light)
|
|
background while inheriting the light theme text — unreadable. Pin both. */
|
|
select {
|
|
color: var(--foreground);
|
|
}
|
|
select option {
|
|
background-color: var(--card);
|
|
color: var(--foreground);
|
|
}
|
|
|
|
/* System Map: make a selected edge unmistakable — thicken it and lay a bright
|
|
halo behind the colored stroke so the current selection reads at a glance
|
|
before a Backspace/Delete removes it. */
|
|
.react-flow__edge.selected .react-flow__edge-path {
|
|
stroke-width: 3.5;
|
|
filter: drop-shadow(0 0 5px rgba(240, 246, 252, 0.9));
|
|
}
|
|
.react-flow__edge:hover .react-flow__edge-path {
|
|
stroke-width: 3;
|
|
cursor: pointer;
|
|
}
|