Files
OpenJarvis/frontend/src/styles/base.css
T
Jon Saad-FalconandClaude Opus 4.6 a834a470ec Restyle PWA with Catppuccin Mocha dark theme and scoped CSS files
Split monolithic App.css into 5 scoped files:
- variables.css: Catppuccin Mocha palette + semantic tokens
- base.css: reset, layout, responsive breakpoints
- sidebar.css: sidebar, model selector, conversations, savings
- chat.css: messages, bubbles, tool calls, streaming
- input.css: textarea, buttons, pasted-pill attachments

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-28 18:06:27 +00:00

65 lines
995 B
CSS

/* Reset & layout */
*, *::before, *::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
background: var(--color-bg);
color: var(--color-text);
height: 100vh;
overflow: hidden;
}
#root {
height: 100vh;
}
.app {
display: flex;
height: 100vh;
position: relative;
}
.sidebar-toggle {
display: none;
position: fixed;
top: 12px;
left: 12px;
z-index: 1000;
background: var(--color-primary);
color: var(--ctp-crust);
border: none;
border-radius: 8px;
width: 36px;
height: 36px;
font-size: 18px;
cursor: pointer;
align-items: center;
justify-content: center;
}
@media (max-width: 768px) {
.sidebar-toggle {
display: flex;
}
.sidebar {
position: fixed;
left: 0;
top: 0;
z-index: 999;
transform: translateX(-100%);
}
.sidebar.open {
transform: translateX(0);
}
.message-bubble {
max-width: 90%;
}
}