| @import "tailwindcss"; |
|
|
| :root { |
| --bg-base: #0d1117; |
| --bg-surface: #161b22; |
| --bg-elevated: #1c2128; |
| --bg-overlay: #21262d; |
| --border: #30363d; |
| --border-muted: #21262d; |
|
|
| --text-primary: #e6edf3; |
| --text-secondary: #8b949e; |
| --text-muted: #484f58; |
|
|
| --accent-blue: #58a6ff; |
| --accent-cyan: #39d353; |
| --accent-purple: #bc8cff; |
| --accent-orange: #f78166; |
| --accent-yellow: #e3b341; |
| --accent-red: #ff7b72; |
| --accent-green: #3fb950; |
|
|
| --font-sans: "Inter", system-ui, sans-serif; |
| --font-mono: "JetBrains Mono", "Fira Code", "Cascadia Code", monospace; |
| } |
|
|
| *, *::before, *::after { box-sizing: border-box; } |
|
|
| html, body, #root { |
| height: 100%; |
| margin: 0; |
| padding: 0; |
| background: var(--bg-base); |
| color: var(--text-primary); |
| font-family: var(--font-sans); |
| font-size: 14px; |
| line-height: 1.5; |
| -webkit-font-smoothing: antialiased; |
| } |
|
|
| |
| ::-webkit-scrollbar { width: 6px; height: 6px; } |
| ::-webkit-scrollbar-track { background: transparent; } |
| ::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; } |
| ::-webkit-scrollbar-thumb:hover { background: var(--text-muted); } |
|
|
| |
| .cm-editor { |
| height: 100%; |
| font-family: var(--font-mono) !important; |
| font-size: 13px !important; |
| background: var(--bg-base) !important; |
| } |
| .cm-editor.cm-focused { outline: none !important; } |
| .cm-scroller { overflow: auto !important; } |
| .cm-gutters { |
| background: var(--bg-surface) !important; |
| border-right: 1px solid var(--border) !important; |
| color: var(--text-muted) !important; |
| } |
| .cm-activeLineGutter { background: var(--bg-elevated) !important; } |
| .cm-activeLine { background: rgba(88, 166, 255, 0.04) !important; } |
| .cm-selectionBackground { background: rgba(88, 166, 255, 0.15) !important; } |
| .cm-cursor { border-left-color: var(--accent-blue) !important; } |
| .cm-content { caret-color: var(--accent-blue) !important; } |
|
|
| |
| .ast-tree { font-family: var(--font-mono); font-size: 12px; } |
| .ast-node-toggle { cursor: pointer; user-select: none; } |
| .ast-node-toggle:hover { opacity: 0.8; } |
|
|
| |
| [data-panel-resize-handle-id] { |
| background: var(--border); |
| transition: background 0.15s; |
| } |
| [data-panel-resize-handle-id]:hover, |
| [data-panel-resize-handle-id][data-resize-handle-active] { |
| background: var(--accent-blue); |
| } |
|
|
| |
| .swagger-ui-frame { |
| width: 100%; |
| height: 100%; |
| border: none; |
| background: #fff; |
| } |
|
|
