Skip to content

feat: hacker/terminal dark theme UI for client#448

Merged
muke1908 merged 2 commits intomasterfrom
copilot/refactor-ui-structure-and-design
Apr 12, 2026
Merged

feat: hacker/terminal dark theme UI for client#448
muke1908 merged 2 commits intomasterfrom
copilot/refactor-ui-structure-and-design

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Apr 12, 2026

Replaces the indigo glassmorphism aesthetic with a matrix-green terminal theme. All purple/indigo color tokens are gone; the UI now reads as a CRT terminal with monospace type, green glows, and scanline effects.

Design system

  • Palette: --primary: #00ff41, --bg: #080808, near-white --text: #d4ffd4, --danger: #ff2244; introduces --glow-sm/md/lg shadow tokens used consistently everywhere
  • Font: OutfitJetBrains Mono (Google Fonts)
  • Background: 40px green grid + body::after CRT scanline overlay
  • Surfaces: glassmorphism backdrop-filter: blur replaced with opaque rgba(0,10,0,0.92) + green border glow

Components

  • Button: transparent outlined style, uppercase + letter-spacing, green border/glow on hover
  • Input: dark terminal field, > label prefix via CSS, green caret + focus glow
  • SetupOverlay: terminal window-chrome top bar via ::before; copy updated to CHAT_E2EE / // end-to-end encrypted · zero knowledge · ephemeral
  • ChatHeader: pulsing @keyframes on connected status dot, uppercase channel title
  • MessageBubble: sent = dark-green bg + glow; received = near-black + left accent border marker
  • ChatFooter: > terminal prompt prefix before input
  • CallOverlay: callPulse glow animation replacing shimmer; all color values use --glow-* vars (no hardcoded rgba)

Copilot AI and others added 2 commits April 12, 2026 21:12
- Switch font from Outfit to JetBrains Mono (monospace)
- New color palette: matrix green (#00ff41) primary, near-black (#080808) bg
- Terminal grid background + CRT scanline overlay on body
- Replace glassmorphism with sharp terminal-surface styling
- Outlined/glow buttons with uppercase letter-spacing
- Terminal-style inputs with > label prefix, green focus glow
- SetupOverlay: terminal window chrome, CHAT_E2EE title
- ChatHeader: pulsing status dot animation, monospace hash badge
- MessageBubble: sent=dark-green, received=near-black with left border marker
- ChatFooter: > prompt prefix, terminal input
- CallOverlay: pulsing green avatar glow instead of shimmer
- Updated legacy style.css root variables to match new palette

Agent-Logs-Url: https://github.com/muke1908/chat-e2ee/sessions/ea673779-4e43-42ec-9eb3-4f5bcb37241e

Co-authored-by: muke1908 <20297989+muke1908@users.noreply.github.com>
@sonarqubecloud
Copy link
Copy Markdown

Quality Gate Failed Quality Gate failed

Failed conditions
C Reliability Rating on New Code (required ≥ A)

See analysis details on SonarQube Cloud

Catch issues before they fail your Quality Gate with our IDE extension SonarQube for IDE

@muke1908 muke1908 merged commit 89c9d1b into master Apr 12, 2026
1 check failed
@muke1908 muke1908 deleted the copilot/refactor-ui-structure-and-design branch April 12, 2026 21:16
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants