marcoallegretti/likwid
1
0
Fork 0
mirror of https://codeberg.org/likwid/likwid.git synced 2026-02-09 21:13:09 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

ux: centralize ui-card modifiers

Browse source
This commit is contained in:
Marco Allegretti 2026-01-29 20:20:44 +01:00
parent dfb80980b1
commit 09efdab83b
2 changed files with 21 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
frontend/src/components/ui/DesignSystemStyles.astro
View file

@ -389,6 +389,24 @@
box-shadow: var(--shadow-sm); box-shadow: var(--shadow-sm);
} }
.ui-card-soft {
background: rgba(255, 255, 255, 0.03);
}
.ui-card-pad-md {
padding: 1.1rem;
}
.ui-card-interactive {
transition: transform 140ms ease, border-color 140ms ease, background 140ms ease;
}
.ui-card-interactive:hover {
transform: translateY(-2px);
border-color: var(--color-border-hover);
background: rgba(255, 255, 255, 0.05);
}
.ui-card-glass { .ui-card-glass {
background: var(--ui-glass-bg); background: var(--ui-glass-bg);
border-color: var(--ui-glass-border); border-color: var(--ui-glass-border);

20
frontend/src/pages/delegations.astro
View file

@ -270,20 +270,6 @@ import DelegationGraph from '../components/voting/DelegationGraph.astro';
gap: 1rem; gap: 1rem;
} }
.delegation-card, .delegate-card {
background: rgba(255, 255, 255, 0.03);
border: 1px solid var(--color-border);
border-radius: 14px;
padding: 1.1rem;
transition: transform 140ms ease, border-color 140ms ease, background 140ms ease;
}
.delegation-card:hover, .delegate-card:hover {
transform: translateY(-2px);
border-color: var(--color-border-hover);
background: rgba(255, 255, 255, 0.05);
}
.delegation-card header { .delegation-card header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -657,7 +643,7 @@ import DelegationGraph from '../components/voting/DelegationGraph.astro';
const safeId = escapeHtml(d.id); const safeId = escapeHtml(d.id);
return ` return `
<div class="delegation-card"> <div class="delegation-card ui-card ui-card-soft ui-card-interactive ui-card-pad-md">
<header> <header>
<span class="delegate-name">→ ${safeName}</span> <span class="delegate-name">→ ${safeName}</span>
<span class="scope-badge">${scopeLabel}</span> <span class="scope-badge">${scopeLabel}</span>
@ -708,7 +694,7 @@ import DelegationGraph from '../components/voting/DelegationGraph.astro';
const createdAt = d.created_at ? new Date(d.created_at).toLocaleDateString() : ''; const createdAt = d.created_at ? new Date(d.created_at).toLocaleDateString() : '';
return ` return `
<div class="delegation-card"> <div class="delegation-card ui-card ui-card-soft ui-card-interactive ui-card-pad-md">
<header> <header>
<span class="delegate-name">← ${safeName}</span> <span class="delegate-name">← ${safeName}</span>
<span class="scope-badge">${scopeLabel}</span> <span class="scope-badge">${scopeLabel}</span>
@ -747,7 +733,7 @@ import DelegationGraph from '../components/voting/DelegationGraph.astro';
const votes = Number(d.total_votes_cast) || 0; const votes = Number(d.total_votes_cast) || 0;
return ` return `
<div class="delegate-card"> <div class="delegate-card ui-card ui-card-soft ui-card-interactive ui-card-pad-md">
<div class="delegate-info"> <div class="delegate-info">
<h3>${safeName}</h3> <h3>${safeName}</h3>
<p class="bio">${safeBio}</p> <p class="bio">${safeBio}</p>