josh/TicketingSystem
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Retheme UI from blue to neutral zinc backgrounds with indigo accents
Build & Push / Test (client) (push) Successful in 33s
Details
Build & Push / Test (server) (push) Successful in 25s
Details
Build & Push / Build Client (push) Successful in 42s
Details
Build & Push / Build Server (push) Successful in 1m5s
Details

Browse Source 
Removes the blue tint from all dark-mode surfaces by switching CSS
variables to zinc-based neutrals, and replaces decorative blue classes
with indigo across buttons, focus rings, tabs, and links. Semantic blue
(severity badges, status badges, role badges, timeline markers) is
preserved.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Josh Wright
2026-04-21 13:29:50 -04:00
parent f98930b54f
commit a9bf332369
9 changed files with 60 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/pages/admin/CTI.tsx
+6 -6
View File
@@ -131,7 +131,7 @@ export default function AdminCTI() {
const itemClass = (active: boolean) =>
`flex items-center justify-between px-4 py-2.5 cursor-pointer group transition-colors ${
active
? 'bg-blue-600/20 border-l-2 border-blue-500'
? 'bg-indigo-600/20 border-l-2 border-indigo-500'
: 'hover:bg-gray-800 border-l-2 border-transparent'
}`;
@@ -144,7 +144,7 @@ export default function AdminCTI() {
<h3 className="text-sm font-semibold text-gray-300">Categories</h3>
<button
onClick={() => openAdd('category')}
className="text-blue-400 hover:text-blue-300 transition-colors"
className="text-indigo-400 hover:text-indigo-300 transition-colors"
>
<Plus size={16} />
</button>
@@ -199,7 +199,7 @@ export default function AdminCTI() {
{selectedCategory && (
<button
onClick={() => openAdd('type')}
className="text-blue-400 hover:text-blue-300 transition-colors"
className="text-indigo-400 hover:text-indigo-300 transition-colors"
>
<Plus size={16} />
</button>
@@ -257,7 +257,7 @@ export default function AdminCTI() {
{selectedType && (
<button
onClick={() => openAdd('item')}
className="text-blue-400 hover:text-blue-300 transition-colors"
className="text-indigo-400 hover:text-indigo-300 transition-colors"
>
<Plus size={16} />
</button>
@@ -314,7 +314,7 @@ export default function AdminCTI() {
onChange={(e) => setNameValue(e.target.value)}
required
autoFocus
className="w-full bg-gray-800 border border-gray-700 text-gray-100 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
className="w-full bg-gray-800 border border-gray-700 text-gray-100 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent"
/>
</div>
<div className="flex justify-end gap-3">
@@ -328,7 +328,7 @@ export default function AdminCTI() {
<button
type="submit"
disabled={submitting}
className="px-4 py-2 text-sm bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 transition-colors"
className="px-4 py-2 text-sm bg-indigo-600 text-white rounded-lg hover:bg-indigo-700 disabled:opacity-50 transition-colors"
>
{submitting ? 'Saving...' : 'Save'}
</button>
client/src/pages/admin/Users.tsx
+4 -4
View File
@@ -174,7 +174,7 @@ export default function AdminUsers() {
};
const inputClass =
'w-full bg-gray-800 border border-gray-700 text-gray-100 placeholder-gray-500 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent';
'w-full bg-gray-800 border border-gray-700 text-gray-100 placeholder-gray-500 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent';
const labelClass = 'block text-sm font-medium text-gray-300 mb-1';
return (
@@ -183,7 +183,7 @@ export default function AdminUsers() {
action={
<button
onClick={openAdd}
className="flex items-center gap-2 bg-blue-600 text-white px-4 py-2 rounded-lg text-sm hover:bg-blue-700 transition-colors"
className="flex items-center gap-2 bg-indigo-600 text-white px-4 py-2 rounded-lg text-sm hover:bg-indigo-700 transition-colors"
>
<Plus size={14} />
Add User
@@ -281,7 +281,7 @@ export default function AdminUsers() {
</div>
<button
onClick={closeModal}
className="w-full bg-blue-600 text-white py-2 rounded-lg text-sm hover:bg-blue-700 transition-colors"
className="w-full bg-indigo-600 text-white py-2 rounded-lg text-sm hover:bg-indigo-700 transition-colors"
>
Done
</button>
@@ -371,7 +371,7 @@ export default function AdminUsers() {
<button
type="submit"
disabled={submitting}
className="px-4 py-2 text-sm bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 transition-colors"
className="px-4 py-2 text-sm bg-indigo-600 text-white rounded-lg hover:bg-indigo-700 disabled:opacity-50 transition-colors"
>
{submitting ? 'Saving...' : modal === 'add' ? 'Create User' : 'Save Changes'}
</button>