fix: button text visible on Steel/Brutalist; org list redesign — row layout, sharp corners
This commit is contained in:
parent
909ce97aea
commit
62ce5266b7
|
|
@ -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; }
|
||||
|
|
|
|||
|
|
@ -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) {
|
||||
|
|
|
|||
Loading…
Reference in New Issue