diff --git a/static/js/main.css b/static/js/main.css deleted file mode 100755 index 52b59fe..0000000 --- a/static/js/main.css +++ /dev/null @@ -1,311 +0,0 @@ -/* Main styles for Linux Kernel Visualization */ - -body { - margin: 0; - background-color: #f2f2f2; - color: #222; - font-family: 'Share Tech Mono', monospace; - overflow: hidden; -} - -svg { - width: 100%; - height: 100vh; -} - -/* Central circle */ -.central-circle { - fill: rgba(0, 0, 0, 0.05); - stroke: #333; - stroke-width: 1.5; -} - -/* Tag icons */ -.tag-icon { - cursor: pointer; - opacity: 0.9; - transition: opacity 0.3s ease; -} - -.tag-icon:hover { - opacity: 1; - filter: brightness(1.2); -} - -/* Connection lines */ -.connection-line { - stroke: rgba(60, 60, 60, 0.3); - stroke-width: 0.8; -} - -/* Item blocks */ -.item-box { - fill: rgba(255, 255, 255, 0.04); - stroke: #aaa; - stroke-width: 0.5; -} - -/* Socket text */ -.socket-text { - font-size: 12px; - fill: #444; - font-family: 'Share Tech Mono', monospace; -} - -/* Feature panels */ -.feature-panel { - fill: rgba(0, 0, 0, 0.03); - stroke: #888; - stroke-width: 1; -} - -.feature-text { - font-size: 12px; - fill: #333; - font-family: 'Share Tech Mono', monospace; -} - -/* Node circles */ -.node-circle { - fill: #555; - stroke: #222; - stroke-width: 0.5; -} - -/* Process nodes with color coding */ -.process-node { - transition: r 0.3s ease, opacity 0.3s ease; -} - -.process-node:hover { - stroke-width: 1.5; - filter: brightness(1.3); -} - -/* Curve paths */ -.curve-path { - fill: none; - stroke: rgba(100, 100, 100, 0.2); - stroke-width: 0.7; -} - -/* Connection styles */ -.connection-box { - fill: rgba(255, 255, 255, 0.04); - stroke: #aaa; - stroke-width: 0.5; - rx: 4; -} - -.connection-text { - font-size: 12px; - fill: #444; - font-family: 'Share Tech Mono', monospace; -} - -.connection-details { - font-size: 10px; - fill: #666; - font-family: 'Share Tech Mono', monospace; -} - -/* Syscall styles - Diegetic UI panel style */ -.syscall-box { - /* Styles are now set inline in JavaScript for diegetic UI look */ - transition: all 0.2s ease; - cursor: default; -} - -.syscall-text { - /* Styles are now set inline in JavaScript for diegetic UI look */ - pointer-events: none; -} - -/* File label styles */ -.file-label { - font-size: 11px; - fill: #333; - font-family: 'Share Tech Mono', monospace; - text-anchor: start; -} - -.file-label-bg { - fill: rgba(255, 255, 255, 0.8); - stroke: #ccc; - stroke-width: 0.5; - rx: 2; -} - -/* Tooltip styles */ -.tooltip { - position: absolute; - background: rgba(0, 0, 0, 0.9); - color: white; - padding: 8px; - border-radius: 4px; - font-size: 12px; - pointer-events: none; - z-index: 1000; - max-width: 300px; -} - -/* Bezier curve styles - matching connection lines */ -.bezier-curve { - fill: none; - stroke: rgba(60, 60, 60, 0.3); - stroke-width: 0.8; -} - -.file-endpoint { - fill: #555; - stroke: #222; - stroke-width: 0.5; -} - -/* Right semicircle menu styles - Logo color scheme */ -.right-semicircle-menu { - fill: rgba(60, 60, 60, 0.8); /* Dark gray background like logo */ - stroke: #555; - stroke-width: 1px; -} - -.right-menu-item { - fill: #3C3C3C; /* Dark gray like logo background */ - stroke: #555; - stroke-width: 1px; - cursor: pointer; - transition: all 0.3s ease; -} - -.right-menu-item:hover { - fill: #666; - stroke: #888; -} - -/* Selected state - white highlight like in example */ -.right-menu-item[data-item-id].selected, -.right-menu-item.selected { - fill: #ffffff !important; - stroke: #ffffff !important; - stroke-width: 2px !important; - filter: drop-shadow(0 0 4px rgba(255, 255, 255, 0.5)); -} - -.right-menu-icon { - font-size: 14px; - fill: #D9D9C7; /* Yellowish color like logo elements */ - text-anchor: middle; - dominant-baseline: central; -} - -.right-menu-line { - /* Now it's a wide rectangle (line) containing text */ - transition: all 0.3s ease; - pointer-events: none; /* Don't interfere with hover on circle */ -} - -/* Selected line - white highlight */ -.right-menu-line[data-item-id].selected, -.right-menu-line.selected { - fill: #ffffff !important; - stroke: #ffffff !important; - stroke-width: 2px !important; -} - -.right-menu-label { - font-size: 11px; - fill: #333; - font-family: 'Share Tech Mono', monospace; - text-anchor: end; - dominant-baseline: central; - transition: all 0.3s ease; -} - -/* Selected label - white highlight */ -.right-menu-label[data-item-id].selected, -.right-menu-label.selected { - fill: #ffffff !important; - font-weight: bold !important; -} - -/* Label background (плашка) styles */ -.right-menu-label-bg { - transition: all 0.3s ease; - pointer-events: none; /* Don't interfere with hover on circle */ -} - -/* Legacy semicircle menu styles (kept for compatibility) */ -.semicircle-menu { - fill: rgba(255, 255, 255, 0.04); - stroke: #aaa; - stroke-width: 0.5; -} - -.menu-item { - fill: rgba(255, 255, 255, 0.04); - stroke: #aaa; - stroke-width: 0.5; - cursor: pointer; -} - -.menu-item:hover { - fill: rgba(255, 255, 255, 0.08); -} - -.menu-icon { - fill: #444; - font-family: 'Share Tech Mono', monospace; - font-size: 12px; - text-anchor: middle; - dominant-baseline: central; -} - -.individual-menu-bar { - fill: rgba(255, 255, 255, 0.04); - stroke: #aaa; - stroke-width: 0.5; -} - -.individual-menu-label { - fill: #444; - font-family: 'Share Tech Mono', monospace; - font-size: 11px; - text-anchor: start; - dominant-baseline: central; -} - -/* Animations - removed unused pulse animation */ - -/* Responsiveness */ -@media (max-width: 768px) { - .socket-text, .connection-text, .syscall-text { - font-size: 10px; - } - - .feature-text, .connection-details { - font-size: 9px; - } - - .file-label, .menu-icon, .individual-menu-label { - font-size: 10px; - } - - .tooltip { - font-size: 10px; - max-width: 250px; - } -} - -.seo-only { - position: absolute; - left: -10000px; - top: auto; - width: 1px; - height: 1px; - overflow: hidden; -} - -/* Subsystem indicators */ -.subsystem-indicator { - pointer-events: none; -}