Files
hermes-os/app/globals.css
T
Hermes 4f5fde34a3 Visual redesign, message input, reversed messages, systemd service
- New visual identity: solid dark cards, purple accent, iOS-like feel
- Session replay: newest messages first, message input with send button
- Chat proxy route for sending messages to sessions
- systemd user service with deploy script
- All pages restyled: Pulse, Memory, History, Skills, Cron, Soul, Config
2026-04-09 21:12:14 -05:00

86 lines
1.8 KiB
CSS

@import "tailwindcss";
:root {
--safe-bottom: env(safe-area-inset-bottom, 0px);
--accent: #7c6ef0;
--accent-dim: rgba(124, 110, 240, 0.12);
--bg: #111113;
--bg-raised: #1a1a1f;
--bg-hover: #222228;
--border: rgba(255, 255, 255, 0.06);
--text-1: #ececef;
--text-2: #8e8e93;
--text-3: #48484a;
}
body {
background: var(--bg);
color: var(--text-1);
font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;
-webkit-font-smoothing: antialiased;
overscroll-behavior: none;
}
/* Card - solid, not glass */
.card {
background: var(--bg-raised);
border-radius: 14px;
border: 1px solid var(--border);
}
.card-hover:active {
background: var(--bg-hover);
}
/* Scrollbar */
::-webkit-scrollbar { width: 0; }
/* Safe area */
.pb-safe {
padding-bottom: calc(4.5rem + var(--safe-bottom));
}
/* Platform badges */
.badge {
font-size: 10px;
font-weight: 600;
padding: 2px 8px;
border-radius: 100px;
letter-spacing: 0.02em;
}
.badge-cli { background: rgba(255,255,255,0.06); color: #8e8e93; }
.badge-telegram { background: rgba(0,136,204,0.12); color: #29b6f6; }
.badge-discord { background: rgba(88,101,242,0.12); color: #7289da; }
.badge-whatsapp { background: rgba(37,211,102,0.12); color: #25d366; }
.badge-web { background: rgba(124,110,240,0.12); color: #7c6ef0; }
/* Accent button */
.btn-accent {
background: var(--accent);
color: white;
border: none;
border-radius: 10px;
font-weight: 600;
font-size: 14px;
padding: 10px 16px;
transition: opacity 0.15s;
}
.btn-accent:active { opacity: 0.7; }
.btn-accent:disabled { opacity: 0.3; }
/* Divider */
.divider {
height: 1px;
background: var(--border);
margin: 0 -16px;
}
/* Section label */
.section-label {
font-size: 13px;
font-weight: 600;
color: var(--text-2);
text-transform: uppercase;
letter-spacing: 0.04em;
}