CRM_ENVIROMENT/Newbie_CRM
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed Black & White Theme. Text is more readable
Build & Auto-Repair / build (push) Has been cancelled
Details

Browse Source
This commit is contained in:
JCBSComputer
2026-07-02 17:15:25 +02:00
parent 12115644e9
commit 9df7475f35
2 changed files with 35 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Web_Backgrounds/bw-theme.css
+31 -30
View File
@@ -1,47 +1,48 @@
.dark.theme-bw { .dark.theme-bw {
--background: 0 0% 5%; --background: 0 0% 5%;
--foreground: 0 0% 95%; --foreground: 0 0% 97%;
--card: 0 0% 10%; --card: 0 0% 10%;
--card-foreground: 0 0% 95%;
--card-foreground: 0 0% 97%;
--popover: 0 0% 10%; --popover: 0 0% 10%;
--popover-foreground: 0 0% 95%; --popover-foreground: 0 0% 97%;
--primary: 0 0% 95%; --primary: 0 0% 97%;
--primary-foreground: 0 0% 0%; --primary-foreground: 0 0% 0%;
--secondary: 0 0% 55%; --secondary: 0 0% 68%;
--secondary-foreground: 0 0% 0%; --secondary-foreground: 0 0% 0%;
--muted: 0 0% 15%; --muted: 0 0% 15%;
--muted-foreground: 0 0% 60%; --muted-foreground: 0 0% 72%;
--accent: 0 0% 25%; --accent: 0 0% 25%;
--accent-foreground: 0 0% 95%; --accent-foreground: 0 0% 97%;
--destructive: 0 0% 40%; --destructive: 0 0% 40%;
--destructive-foreground: 0 0% 95%; --destructive-foreground: 0 0% 97%;
--border: 0 0% 25%; --border: 0 0% 25%;
--input: 0 0% 25%; --input: 0 0% 25%;
--ring: 0 0% 70%; --ring: 0 0% 70%;
--radius: 0.5rem; --radius: 0.5rem;
--sidebar: 0 0% 4%; --sidebar: 0 0% 4%;
--sidebar-foreground: 0 0% 95%; --sidebar-foreground: 0 0% 97%;
--sidebar-primary: 0 0% 95%; --sidebar-primary: 0 0% 97%;
--sidebar-primary-foreground: 0 0% 0%; --sidebar-primary-foreground: 0 0% 0%;
--sidebar-accent: 0 0% 15%; --sidebar-accent: 0 0% 15%;
--sidebar-accent-foreground: 0 0% 95%; --sidebar-accent-foreground: 0 0% 97%;
--sidebar-border: 0 0% 18%; --sidebar-border: 0 0% 18%;
--sidebar-ring: 0 0% 70%; --sidebar-ring: 0 0% 70%;
} }
.light.theme-bw { .light.theme-bw {
--background: 0 0% 97%; --background: 0 0% 97%;
--foreground: 0 0% 10%; --foreground: 0 0% 8%;
--card: 0 0% 100%; --card: 0 0% 100%;
--card-foreground: 0 0% 10%; --card-foreground: 0 0% 8%;
--popover: 0 0% 100%; --popover: 0 0% 100%;
--popover-foreground: 0 0% 10%; --popover-foreground: 0 0% 8%;
--primary: 0 0% 10%; --primary: 0 0% 8%;
--primary-foreground: 0 0% 100%; --primary-foreground: 0 0% 100%;
--secondary: 0 0% 45%; --secondary: 0 0% 55%;
--secondary-foreground: 0 0% 100%; --secondary-foreground: 0 0% 100%;
--muted: 0 0% 93%; --muted: 0 0% 93%;
--muted-foreground: 0 0% 50%; --muted-foreground: 0 0% 38%;
--accent: 0 0% 20%; --accent: 0 0% 20%;
--accent-foreground: 0 0% 100%; --accent-foreground: 0 0% 100%;
--destructive: 0 0% 60%; --destructive: 0 0% 60%;
@@ -51,11 +52,11 @@
--ring: 0 0% 45%; --ring: 0 0% 45%;
--radius: 0.5rem; --radius: 0.5rem;
--sidebar: 0 0% 100%; --sidebar: 0 0% 100%;
--sidebar-foreground: 0 0% 10%; --sidebar-foreground: 0 0% 8%;
--sidebar-primary: 0 0% 10%; --sidebar-primary: 0 0% 8%;
--sidebar-primary-foreground: 0 0% 100%; --sidebar-primary-foreground: 0 0% 100%;
--sidebar-accent: 0 0% 90%; --sidebar-accent: 0 0% 90%;
--sidebar-accent-foreground: 0 0% 10%; --sidebar-accent-foreground: 0 0% 8%;
--sidebar-border: 0 0% 80%; --sidebar-border: 0 0% 80%;
--sidebar-ring: 0 0% 45%; --sidebar-ring: 0 0% 45%;
} }
@@ -558,7 +559,7 @@
.dark.theme-bw .text-teal-500, .dark.theme-bw .dark\:text-teal-500, .dark.theme-bw .text-teal-500, .dark.theme-bw .dark\:text-teal-500,
.dark.theme-bw .text-indigo-500, .dark.theme-bw .dark\:text-indigo-500, .dark.theme-bw .text-indigo-500, .dark.theme-bw .dark\:text-indigo-500,
.dark.theme-bw .text-pink-500, .dark.theme-bw .dark\:text-pink-500, .dark.theme-bw .text-pink-500, .dark.theme-bw .dark\:text-pink-500,
.dark.theme-bw .text-rose-500, .dark.theme-bw .dark\:text-rose-500 { color: hsl(0,0%,50%) !important; } .dark.theme-bw .text-rose-500, .dark.theme-bw .dark\:text-rose-500 { color: hsl(0,0%,65%) !important; }
.dark.theme-bw .text-blue-600, .dark.theme-bw .dark\:text-blue-600, .dark.theme-bw .text-blue-600, .dark.theme-bw .dark\:text-blue-600,
.dark.theme-bw .text-amber-600, .dark.theme-bw .dark\:text-amber-600, .dark.theme-bw .text-amber-600, .dark.theme-bw .dark\:text-amber-600,
@@ -567,7 +568,7 @@
.dark.theme-bw .text-green-600, .dark.theme-bw .dark\:text-green-600, .dark.theme-bw .text-green-600, .dark.theme-bw .dark\:text-green-600,
.dark.theme-bw .text-orange-600, .dark.theme-bw .dark\:text-orange-600, .dark.theme-bw .text-orange-600, .dark.theme-bw .dark\:text-orange-600,
.dark.theme-bw .text-yellow-600, .dark.theme-bw .dark\:text-yellow-600, .dark.theme-bw .text-yellow-600, .dark.theme-bw .dark\:text-yellow-600,
.dark.theme-bw .text-violet-600, .dark.theme-bw .dark\:text-violet-600 { color: hsl(0,0%,35%) !important; } .dark.theme-bw .text-violet-600, .dark.theme-bw .dark\:text-violet-600 { color: hsl(0,0%,50%) !important; }
.dark.theme-bw .text-blue-400, .dark.theme-bw .dark\:text-blue-400, .dark.theme-bw .text-blue-400, .dark.theme-bw .dark\:text-blue-400,
.dark.theme-bw .text-red-400, .dark.theme-bw .dark\:text-red-400, .dark.theme-bw .text-red-400, .dark.theme-bw .dark\:text-red-400,
@@ -577,7 +578,7 @@
.dark.theme-bw .text-green-400, .dark.theme-bw .dark\:text-green-400, .dark.theme-bw .text-green-400, .dark.theme-bw .dark\:text-green-400,
.dark.theme-bw .text-rose-400, .dark.theme-bw .dark\:text-rose-400, .dark.theme-bw .text-rose-400, .dark.theme-bw .dark\:text-rose-400,
.dark.theme-bw .text-orange-400, .dark.theme-bw .dark\:text-orange-400, .dark.theme-bw .text-orange-400, .dark.theme-bw .dark\:text-orange-400,
.dark.theme-bw .text-purple-400, .dark.theme-bw .dark\:text-purple-400 { color: hsl(0,0%,60%) !important; } .dark.theme-bw .text-purple-400, .dark.theme-bw .dark\:text-purple-400 { color: hsl(0,0%,75%) !important; }
.dark.theme-bw .text-blue-700, .dark.theme-bw .dark\:text-blue-700, .dark.theme-bw .text-blue-700, .dark.theme-bw .dark\:text-blue-700,
.dark.theme-bw .text-amber-700, .dark.theme-bw .dark\:text-amber-700, .dark.theme-bw .text-amber-700, .dark.theme-bw .dark\:text-amber-700,
@@ -585,10 +586,10 @@
.dark.theme-bw .text-red-700, .dark.theme-bw .dark\:text-red-700, .dark.theme-bw .text-red-700, .dark.theme-bw .dark\:text-red-700,
.dark.theme-bw .text-orange-700, .dark.theme-bw .dark\:text-orange-700, .dark.theme-bw .text-orange-700, .dark.theme-bw .dark\:text-orange-700,
.dark.theme-bw .text-yellow-700, .dark.theme-bw .dark\:text-yellow-700, .dark.theme-bw .text-yellow-700, .dark.theme-bw .dark\:text-yellow-700,
.dark.theme-bw .text-violet-700, .dark.theme-bw .dark\:text-violet-700 { color: hsl(0,0%,25%) !important; } .dark.theme-bw .text-violet-700, .dark.theme-bw .dark\:text-violet-700 { color: hsl(0,0%,35%) !important; }
.dark.theme-bw .text-emerald-600\/60, .dark.theme-bw .dark\:text-emerald-600\/60 { color: hsla(0,0%,35%,0.6) !important; } .dark.theme-bw .text-emerald-600\/60, .dark.theme-bw .dark\:text-emerald-600\/60 { color: hsla(0,0%,50%,0.7) !important; }
.dark.theme-bw .text-red-500\/40, .dark.theme-bw .dark\:text-red-500\/40 { color: hsla(0,0%,50%,0.4) !important; } .dark.theme-bw .text-red-500\/40, .dark.theme-bw .dark\:text-red-500\/40 { color: hsla(0,0%,65%,0.5) !important; }
/* ----- Dark mode: border-{color}-{shade} ----- */ /* ----- Dark mode: border-{color}-{shade} ----- */
.dark.theme-bw .border-blue-500, .dark.theme-bw .dark\:border-blue-500, .dark.theme-bw .border-blue-500, .dark.theme-bw .dark\:border-blue-500,
@@ -746,20 +747,20 @@
} }
/* ---- Dashboard cards (Pipeline Overview stat cards, Analytics charts, Recent Leads table) ---- */ /* ---- Dashboard cards (Pipeline Overview stat cards, Analytics charts, Recent Leads table) ---- */
.dark.theme-bw .z-\[1\].space-y-6 .rounded-lg.border.bg-card { .dark.theme-bw .z-\[1\].space-y-6 .rounded-xl.border.bg-card {
box-shadow: 0 0 16px hsla(0,0%,100%,0.05), 0 0 40px hsla(0,0%,100%,0.015) !important; box-shadow: 0 0 16px hsla(0,0%,100%,0.05), 0 0 40px hsla(0,0%,100%,0.015) !important;
} }
.dark.theme-bw .z-\[1\].space-y-6 .rounded-lg.border.bg-card .rounded-xl { .dark.theme-bw .z-\[1\].space-y-6 .rounded-xl.border.bg-card .rounded-xl {
background: transparent !important; background: transparent !important;
box-shadow: 0 0 12px hsla(0,0%,100%,0.15), inset 0 0 8px hsla(0,0%,100%,0.05) !important; box-shadow: 0 0 12px hsla(0,0%,100%,0.15), inset 0 0 8px hsla(0,0%,100%,0.05) !important;
} }
.dark.theme-bw .z-\[1\].space-y-6 .rounded-lg.border.bg-card .rounded-xl svg { .dark.theme-bw .z-\[1\].space-y-6 .rounded-xl.border.bg-card .rounded-xl svg {
color: hsl(0,0%,70%) !important; color: hsl(0,0%,70%) !important;
} }
.dark.theme-bw .z-\[1\].space-y-6 .rounded-lg.border.bg-card .h-1\.5.bg-muted.rounded-full .rounded-full { .dark.theme-bw .z-\[1\].space-y-6 .rounded-xl.border.bg-card .h-1\.5.bg-muted.rounded-full .rounded-full {
background: hsl(0,0%,50%) !important; background: hsl(0,0%,50%) !important;
box-shadow: 0 0 8px hsla(0,0%,100%,0.3) !important; box-shadow: 0 0 8px hsla(0,0%,100%,0.3) !important;
} }
src/components/ai/ai-chat.tsx
+4 -4
View File
@@ -320,7 +320,7 @@ export const AIChat = forwardRef<{ fillInput: (text: string) => void }, AIChatPr
<div key={i}> <div key={i}>
{msg.role === "assistant" ? ( {msg.role === "assistant" ? (
<div className="flex gap-3 items-start"> <div className="flex gap-3 items-start">
<div className="w-8 h-8 rounded-lg bg-gradient-to-br from-primary to-primary flex items-center justify-center text-white text-sm flex-shrink-0"> <div className="w-8 h-8 rounded-lg bg-gradient-to-br from-primary to-primary flex items-center justify-center text-primary-foreground text-sm flex-shrink-0">
<Bot className="h-4 w-4" /> <Bot className="h-4 w-4" />
</div> </div>
<div className="flex-1 min-w-0"> <div className="flex-1 min-w-0">
@@ -352,7 +352,7 @@ export const AIChat = forwardRef<{ fillInput: (text: string) => void }, AIChatPr
loading="lazy" loading="lazy"
/> />
) : ( ) : (
<div className="text-white text-sm leading-7 whitespace-pre-wrap">{msg.content}</div> <div className="text-primary-foreground text-sm leading-7 whitespace-pre-wrap">{msg.content}</div>
)} )}
</div> </div>
</div> </div>
@@ -362,7 +362,7 @@ export const AIChat = forwardRef<{ fillInput: (text: string) => void }, AIChatPr
))} ))}
{loading && ( {loading && (
<div className="flex gap-3 items-start"> <div className="flex gap-3 items-start">
<div className="w-8 h-8 rounded-lg bg-gradient-to-br from-primary to-primary flex items-center justify-center text-white text-sm flex-shrink-0"> <div className="w-8 h-8 rounded-lg bg-gradient-to-br from-primary to-primary flex items-center justify-center text-primary-foreground text-sm flex-shrink-0">
<Bot className="h-4 w-4" /> <Bot className="h-4 w-4" />
</div> </div>
<div className="bg-card rounded-2xl rounded-tl-sm border border-border border-l-2 border-l-primary px-5 py-4 inline-flex items-center gap-1.5"> <div className="bg-card rounded-2xl rounded-tl-sm border border-border border-l-2 border-l-primary px-5 py-4 inline-flex items-center gap-1.5">
@@ -416,7 +416,7 @@ export const AIChat = forwardRef<{ fillInput: (text: string) => void }, AIChatPr
type="button" type="button"
onClick={() => sendMessage()} onClick={() => sendMessage()}
disabled={!input.trim()} disabled={!input.trim()}
className={`w-9 h-9 rounded-xl flex-shrink-0 bg-gradient-to-br from-primary to-primary flex items-center justify-center text-white transition-all duration-200 ${input.trim() ? "hover:shadow-[0_0_20px_hsl(var(--primary)_/_0.4)] hover:scale-105 active:scale-95" : "opacity-40 cursor-not-allowed"}`} className={`w-9 h-9 rounded-xl flex-shrink-0 bg-gradient-to-br from-primary to-primary flex items-center justify-center text-primary-foreground transition-all duration-200 ${input.trim() ? "hover:shadow-[0_0_20px_hsl(var(--primary)_/_0.4)] hover:scale-105 active:scale-95" : "opacity-40 cursor-not-allowed"}`}
> >
<Send className="h-4 w-4" /> <Send className="h-4 w-4" />
</button> </button>