From ae7d0a9ab79c3b14105c356344623927bb3fd20c Mon Sep 17 00:00:00 2001 From: juanatsap Date: Mon, 27 Apr 2026 00:07:59 +0100 Subject: [PATCH] fix: white avatar circle background + dark theme uses same grid as light --- static/css/01-foundation/_themes.css | 16 ++++++++++------ static/css/04-interactive/_chat.css | 2 +- 2 files changed, 11 insertions(+), 7 deletions(-) diff --git a/static/css/01-foundation/_themes.css b/static/css/01-foundation/_themes.css index fc9ddc1..bbab290 100644 --- a/static/css/01-foundation/_themes.css +++ b/static/css/01-foundation/_themes.css @@ -77,9 +77,11 @@ /* Page Background - Medium gray for dark pattern visibility */ --page-bg: #3a3a3a; - /* Diagonal Grid with Green Glow - Dark */ - --page-bg-pattern: repeating-linear-gradient(45deg, rgba(0, 255, 128, 0.15) 0, rgba(0, 255, 128, 0.15) 1px, transparent 1px, transparent 20px), - repeating-linear-gradient(-45deg, rgba(0, 255, 128, 0.15) 0, rgba(0, 255, 128, 0.15) 1px, transparent 1px, transparent 20px); + /* Concentric Squares Pattern - Dark (same shape as light, adapted colors) */ + --page-bg-pattern: repeating-linear-gradient(0deg, transparent, transparent 5px, rgba(200, 210, 220, 0.06) 5px, rgba(200, 210, 220, 0.06) 6px, transparent 6px, transparent 15px), + repeating-linear-gradient(90deg, transparent, transparent 5px, rgba(200, 210, 220, 0.06) 5px, rgba(200, 210, 220, 0.06) 6px, transparent 6px, transparent 15px), + repeating-linear-gradient(0deg, transparent, transparent 10px, rgba(180, 190, 200, 0.04) 10px, rgba(180, 190, 200, 0.04) 11px, transparent 11px, transparent 30px), + repeating-linear-gradient(90deg, transparent, transparent 10px, rgba(180, 190, 200, 0.04) 10px, rgba(180, 190, 200, 0.04) 11px, transparent 11px, transparent 30px); /* Paper/Card Backgrounds */ --paper-bg: #1a1a1a; @@ -135,9 +137,11 @@ /* Page Background - Medium gray for dark pattern visibility */ --page-bg: #3a3a3a; - /* Diagonal Grid with Green Glow - Dark */ - --page-bg-pattern: repeating-linear-gradient(45deg, rgba(0, 255, 128, 0.15) 0, rgba(0, 255, 128, 0.15) 1px, transparent 1px, transparent 20px), - repeating-linear-gradient(-45deg, rgba(0, 255, 128, 0.15) 0, rgba(0, 255, 128, 0.15) 1px, transparent 1px, transparent 20px); + /* Concentric Squares Pattern - Dark (same shape as light, adapted colors) */ + --page-bg-pattern: repeating-linear-gradient(0deg, transparent, transparent 5px, rgba(200, 210, 220, 0.06) 5px, rgba(200, 210, 220, 0.06) 6px, transparent 6px, transparent 15px), + repeating-linear-gradient(90deg, transparent, transparent 5px, rgba(200, 210, 220, 0.06) 5px, rgba(200, 210, 220, 0.06) 6px, transparent 6px, transparent 15px), + repeating-linear-gradient(0deg, transparent, transparent 10px, rgba(180, 190, 200, 0.04) 10px, rgba(180, 190, 200, 0.04) 11px, transparent 11px, transparent 30px), + repeating-linear-gradient(90deg, transparent, transparent 10px, rgba(180, 190, 200, 0.04) 10px, rgba(180, 190, 200, 0.04) 11px, transparent 11px, transparent 30px); /* Paper/Card Backgrounds */ --paper-bg: #1a1a1a; diff --git a/static/css/04-interactive/_chat.css b/static/css/04-interactive/_chat.css index 4782732..753efd7 100644 --- a/static/css/04-interactive/_chat.css +++ b/static/css/04-interactive/_chat.css @@ -358,7 +358,7 @@ .chat-avatar-juan { width: 36px; height: 36px; - background: none; + background: #ffffff; padding: 0; overflow: hidden; }