john/tractatus
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: Add missing Tailwind gradient utilities to theme CSS

Browse source 
All gradient backgrounds (bg-gradient-to-r/br, from-*, via-*, to-*)
were not rendering because the classes weren't in the compiled Tailwind
CSS. Added 60+ gradient utility classes to tractatus-theme.css so
gradients render correctly site-wide.

Fixes white-on-white text in Koha section (gradient background was
transparent, making white text invisible against page background).
Also fixes Production Evidence section and all other gradient sections.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
TheFlow 2026-02-07 15:52:39 +13:00
parent e54ddc1aa8
commit af3ef61a19
2 changed files with 66 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

65
public/css/tractatus-theme.css
View file

@ -649,6 +649,71 @@ h3 { letter-spacing: -0.015em; }
background: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%);
}
/* Tailwind Gradient Utilities (not in compiled tailwind.css) */
.bg-gradient-to-r { background-image: linear-gradient(to right, var(--tw-gradient-stops)); }
.bg-gradient-to-br { background-image: linear-gradient(to bottom right, var(--tw-gradient-stops)); }
.bg-gradient-to-b { background-image: linear-gradient(to bottom, var(--tw-gradient-stops)); }
/* From colors */
.from-blue-50 { --tw-gradient-from: #eff6ff; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(239,246,255,0)); }
.from-blue-600 { --tw-gradient-from: #2563eb; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(37,99,235,0)); }
.from-blue-900 { --tw-gradient-from: #1e3a8a; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(30,58,138,0)); }
.from-emerald-500 { --tw-gradient-from: #10b981; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(16,185,129,0)); }
.from-indigo-50 { --tw-gradient-from: #eef2ff; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(238,242,255,0)); }
.from-indigo-500 { --tw-gradient-from: #6366f1; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(99,102,241,0)); }
.from-indigo-600 { --tw-gradient-from: #4f46e5; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(79,70,229,0)); }
.from-amber-50 { --tw-gradient-from: #fffbeb; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(255,251,235,0)); }
.from-amber-500 { --tw-gradient-from: #f59e0b; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(245,158,11,0)); }
.from-purple-50 { --tw-gradient-from: #faf5ff; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(250,245,255,0)); }
.from-purple-500 { --tw-gradient-from: #a855f7; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(168,85,247,0)); }
.from-purple-600 { --tw-gradient-from: #9333ea; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(147,51,234,0)); }
.from-rose-500 { --tw-gradient-from: #f43f5e; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(244,63,94,0)); }
.from-teal-50 { --tw-gradient-from: #f0fdfa; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(240,253,250,0)); }
.from-teal-500 { --tw-gradient-from: #14b8a6; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(20,184,166,0)); }
.from-teal-600 { --tw-gradient-from: #0d9488; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(13,148,136,0)); }
.from-teal-700 { --tw-gradient-from: #0f766e; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(15,118,110,0)); }
.from-yellow-50 { --tw-gradient-from: #fefce8; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(254,252,232,0)); }
.from-orange-50 { --tw-gradient-from: #fff7ed; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(255,247,237,0)); }
.from-gray-50 { --tw-gradient-from: #f9fafb; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(249,250,251,0)); }
.from-gray-800 { --tw-gradient-from: #1f2937; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(31,41,55,0)); }
.from-green-50 { --tw-gradient-from: #f0fdf4; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(240,253,244,0)); }
.from-sky-500 { --tw-gradient-from: #0ea5e9; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(14,165,233,0)); }
.from-pink-50 { --tw-gradient-from: #fdf2f8; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(253,242,248,0)); }
.from-pink-500 { --tw-gradient-from: #ec4899; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(236,72,153,0)); }
/* Via colors */
.via-blue-50 { --tw-gradient-stops: var(--tw-gradient-from), #eff6ff, var(--tw-gradient-to, rgba(239,246,255,0)); }
.via-blue-700 { --tw-gradient-stops: var(--tw-gradient-from), #1d4ed8, var(--tw-gradient-to, rgba(29,78,216,0)); }
.via-teal-50 { --tw-gradient-stops: var(--tw-gradient-from), #f0fdfa, var(--tw-gradient-to, rgba(240,253,250,0)); }
.via-teal-800 { --tw-gradient-stops: var(--tw-gradient-from), #115e59, var(--tw-gradient-to, rgba(17,94,89,0)); }
/* To colors */
.to-blue-50 { --tw-gradient-to: #eff6ff; }
.to-blue-600 { --tw-gradient-to: #2563eb; }
.to-blue-700 { --tw-gradient-to: #1d4ed8; }
.to-purple-50 { --tw-gradient-to: #faf5ff; }
.to-purple-600 { --tw-gradient-to: #9333ea; }
.to-purple-700 { --tw-gradient-to: #7e22ce; }
.to-purple-900 { --tw-gradient-to: #581c87; }
.to-emerald-50 { --tw-gradient-to: #ecfdf5; }
.to-emerald-600 { --tw-gradient-to: #059669; }
.to-emerald-700 { --tw-gradient-to: #047857; }
.to-emerald-800 { --tw-gradient-to: #065f46; }
.to-indigo-50 { --tw-gradient-to: #eef2ff; }
.to-indigo-600 { --tw-gradient-to: #4f46e5; }
.to-amber-600 { --tw-gradient-to: #d97706; }
.to-rose-600 { --tw-gradient-to: #e11d48; }
.to-teal-50 { --tw-gradient-to: #f0fdfa; }
.to-teal-600 { --tw-gradient-to: #0d9488; }
.to-orange-50 { --tw-gradient-to: #fff7ed; }
.to-cyan-600 { --tw-gradient-to: #0891b2; }
.to-green-50 { --tw-gradient-to: #f0fdf4; }
.to-red-50 { --tw-gradient-to: #fef2f2; }
.to-violet-600 { --tw-gradient-to: #7c3aed; }
.to-gray-100 { --tw-gradient-to: #f3f4f6; }
.to-gray-900 { --tw-gradient-to: #111827; }
.to-pink-600 { --tw-gradient-to: #db2777; }
/* Text Shadows */
.text-shadow-sm {
text-shadow: 0 1px 2px rgba(0,0,0,0.1);

2
public/css/tractatus-theme.min.css vendored
View file

File diff suppressed because one or more lines are too long