Files
Remote-Terminal-for-MeshCore/frontend/src/index.css
2026-03-10 19:26:31 -07:00

137 lines
3.2 KiB
CSS

@tailwind base;
@tailwind components;
@tailwind utilities;
@layer base {
:root {
--background: 224 14% 8%;
--foreground: 213 15% 90%;
--card: 224 13% 11%;
--card-foreground: 213 15% 90%;
--popover: 224 13% 12%;
--popover-foreground: 213 15% 90%;
--primary: 152 60% 38%;
--primary-foreground: 0 0% 100%;
--secondary: 224 12% 17%;
--secondary-foreground: 213 12% 85%;
--muted: 224 12% 15%;
--muted-foreground: 218 10% 65%;
--accent: 224 11% 19%;
--accent-foreground: 213 15% 90%;
--destructive: 0 72% 51%;
--destructive-foreground: 0 0% 100%;
--border: 224 11% 23%;
--input: 224 11% 23%;
--ring: 152 60% 38%;
--radius: 0.5rem;
/* Semantic colors for specific contexts */
--msg-outgoing: 152 30% 14%;
--msg-incoming: 224 12% 15%;
/* Status indicator pips */
--status-connected: 142 71% 45%;
--status-disconnected: 220 9% 46%;
/* Semantic feedback colors */
--warning: 38 92% 50%;
--warning-foreground: 0 0% 100%;
--success: 142 71% 45%;
--success-foreground: 0 0% 100%;
--info: 217 91% 60%;
--info-foreground: 0 0% 100%;
--region-override: 270 80% 74%;
/* Favorites */
--favorite: 43 96% 56%;
/* Console / terminal */
--console: 142 69% 58%;
--console-command: 142 76% 73%;
--console-bg: 0 0% 0%;
/* Unread badges */
--badge-unread: var(--primary);
--badge-unread-foreground: var(--primary-foreground);
--badge-mention: var(--destructive);
--badge-mention-foreground: var(--destructive-foreground);
/* Error toast */
--toast-error: 0 30% 14%;
--toast-error-foreground: 0 56% 77%;
--toast-error-border: 0 27% 23%;
/* Code editor */
--code-editor-bg: 220 13% 18%;
/* Overlay / backdrop */
--overlay: 0 0% 0%;
/* Typography */
--font-sans: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
--font-mono:
ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
/* Scrollbar */
--scrollbar: 224 11% 22%;
--scrollbar-hover: 224 11% 28%;
}
}
@layer base {
* {
@apply border-border;
}
body {
@apply bg-background text-foreground;
font-family: var(--font-sans);
font-size: 14px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
}
/* Custom scrollbar — thin, unobtrusive, matches palette */
::-webkit-scrollbar {
width: 6px;
height: 6px;
}
::-webkit-scrollbar-track {
background: transparent;
}
::-webkit-scrollbar-thumb {
background: hsl(var(--scrollbar));
border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
background: hsl(var(--scrollbar-hover));
}
/* Firefox scrollbar */
* {
scrollbar-width: thin;
scrollbar-color: hsl(var(--scrollbar)) transparent;
}
/* Message highlight animation for jump-to-message */
@keyframes message-highlight {
0% {
box-shadow: 0 0 0 2px hsl(var(--primary));
}
100% {
box-shadow: 0 0 0 2px transparent;
}
}
.message-highlight {
animation: message-highlight 2s ease-out forwards;
}
/* Constrain CodeMirror editor width */
.cm-editor {
max-width: 100% !important;
contain: inline-size;
}
.cm-editor .cm-scroller {
overflow-x: auto !important;
}