fix: button text visible on Steel/Brutalist; org list redesign — row layout, sharp corners

This commit is contained in:
James 2026-03-12 02:57:53 -04:00
parent 909ce97aea
commit 62ce5266b7
2 changed files with 15 additions and 13 deletions

View File

@ -110,9 +110,9 @@ html[data-theme="steel"] {
--ds-hf: 'DM Sans', sans-serif;
}
html[data-theme="steel"] * { font-family: 'DM Sans', sans-serif !important; }
html[data-theme="steel"] [class*="text-[#c9a84c]"],
html[data-theme="steel"] [class*="bg-[#c9a84c]"] { color: #3b82f6 !important; }
html[data-theme="steel"] [class*="bg-[#c9a84c]"] { background: #3b82f6 !important; }
html[data-theme="steel"] [class*="text-[#c9a84c]"] { color: #3b82f6 !important; }
html[data-theme="steel"] [class*="bg-[#c9a84c]"] { background: #3b82f6 !important; color: #fff !important; }
html[data-theme="steel"] [class*="border-[#c9a84c]"] { border-color: #3b82f6 !important; }
html[data-theme="steel"] .sidebar-link.active { background: rgba(59,130,246,.12) !important; color: #3b82f6 !important; }
html[data-theme="steel"] #ds-theme-bar button.active { background: #3b82f6 !important; color: #fff !important; }
@ -134,8 +134,8 @@ html[data-theme="brutalist"] {
}
html[data-theme="brutalist"] * { font-family: 'Space Mono', monospace !important; }
html[data-theme="brutalist"] [class*="text-[#c9a84c]"] { color: #ff6600 !important; }
html[data-theme="brutalist"] [class*="bg-[#c9a84c]"] { background: #ff6600 !important; }
html[data-theme="brutalist"] [class*="border-\[#c9a84c\]"] { border-color: #ff6600 !important; }
html[data-theme="brutalist"] [class*="bg-[#c9a84c]"] { background: #ff6600 !important; color: #fff !important; }
html[data-theme="brutalist"] [class*="border-[#c9a84c]"] { border-color: #ff6600 !important; }
html[data-theme="brutalist"] .sidebar-link.active { background: rgba(255,102,0,.1) !important; color: #ff6600 !important; }
html[data-theme="brutalist"] #ds-theme-bar button.active { background: #ff6600 !important; color: #fff !important; }
header { background: var(--ds-sf) !important; border-color: var(--ds-bd) !important; }

View File

@ -1,5 +1,5 @@
{{define "content"}}
<div class="px-8 pt-4 pb-8 max-w-5xl">
<div class="px-8 pt-4 pb-8">
<div class="flex items-center justify-between mb-6">
<div>
<h1 class="text-2xl font-bold text-white mb-1">Organizations</h1>
@ -7,7 +7,7 @@
</div>
<button id="newOrgBtn" class="hidden px-4 py-2 bg-[#c9a84c] hover:bg-[#b8973f] text-[#0a1628] font-semibold rounded-lg text-sm transition">+ New Organization</button>
</div>
<div id="orgGrid" class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div id="orgGrid" class="flex flex-col divide-y" style="border:1px solid var(--ds-bd);border-radius:6px;overflow:hidden">
<div class="text-[#94a3b8] text-sm col-span-2">Loading...</div>
</div>
<div id="emptyState" class="hidden text-center py-20">
@ -99,13 +99,15 @@
const rc = roleColors[role] || 'bg-gray-500/20 text-gray-300';
const domains = Array.isArray(o.domains) ? o.domains : (o.domains ? [o.domains] : []);
return `<div onclick="openEditModal(${JSON.stringify(JSON.stringify(o))})"
class="card bg-[#0d1f3c] border border-white/[0.08] rounded-xl p-6 cursor-pointer hover:border-white/[0.18] transition">
<div class="flex items-start justify-between mb-3">
<h3 class="text-white font-semibold leading-tight">${escHtml(name)}</h3>
<span class="ml-2 shrink-0 px-2 py-0.5 rounded-full text-xs font-medium capitalize ${rc}">${role || '—'}</span>
class="flex items-center gap-4 px-5 py-3.5 cursor-pointer transition"
style="background:var(--ds-sf)" onmouseover="this.style.background='var(--ds-hv)'" onmouseout="this.style.background='var(--ds-sf)'">
<div class="w-8 h-8 rounded flex items-center justify-center text-sm font-bold shrink-0"
style="background:var(--ds-ac);color:#fff">${escHtml(name[0]||'?').toUpperCase()}</div>
<div class="flex-1 min-w-0">
<div class="font-semibold text-white">${escHtml(name)}</div>
<div class="text-xs mt-0.5" style="color:var(--ds-tx3)">${domains.map(d=>'@'+escHtml(d)).join(' · ') || (o.website||'')}</div>
</div>
<div class="flex gap-1.5 flex-wrap">${domains.map(dm => `<span class="text-xs font-mono text-[#94a3b8] bg-white/[0.05] px-2 py-0.5 rounded">@${escHtml(dm)}</span>`).join('')}</div>
${o.website ? `<div class="mt-2 text-xs text-[#94a3b8]">${escHtml(o.website)}</div>` : ''}
<span class="shrink-0 px-2.5 py-0.5 text-xs font-medium capitalize ${rc}" style="border-radius:3px">${role || '—'}</span>
</div>`;
}).join('');
} catch(e) {