ux: dedupe features page cards via ui-card

This commit is contained in:
Marco Allegretti 2026-01-30 10:04:22 +01:00
parent ba659eef80
commit 1088aef346

View file

@ -22,7 +22,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
<div class="voting-methods">
<div class="method-card">
<div class="method-card ui-card ui-card-pad-lg">
<div class="method-header">
<h3>Schulze Method</h3>
<span class="method-tag">Condorcet-consistent</span>
@ -36,7 +36,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
</div>
<div class="method-card">
<div class="method-card ui-card ui-card-pad-lg">
<div class="method-header">
<h3>STAR Voting</h3>
<span class="method-tag">Score + Runoff</span>
@ -50,7 +50,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
</div>
<div class="method-card">
<div class="method-card ui-card ui-card-pad-lg">
<div class="method-header">
<h3>Quadratic Voting</h3>
<span class="method-tag">Intensity-weighted</span>
@ -64,7 +64,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
</div>
<div class="method-card">
<div class="method-card ui-card ui-card-pad-lg">
<div class="method-header">
<h3>Ranked Choice</h3>
<span class="method-tag">Instant Runoff</span>
@ -78,7 +78,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
</div>
<div class="method-card">
<div class="method-card ui-card ui-card-pad-lg">
<div class="method-header">
<h3>Approval Voting</h3>
<span class="method-tag">Simple multi-select</span>
@ -105,28 +105,28 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
<div class="feature-grid">
<div class="feature-item">
<div class="feature-item ui-card ui-card-pad-lg">
<h4>Scoped Delegation</h4>
<p>
Delegate your voice globally or within a specific community to people you trust.
You can always vote directly and override your delegation.
</p>
</div>
<div class="feature-item">
<div class="feature-item ui-card ui-card-pad-lg">
<h4>Transitive Chains</h4>
<p>
Your delegate can further delegate to their trusted experts, creating chains
of trust. Cycle detection ensures no infinite loops.
</p>
</div>
<div class="feature-item">
<div class="feature-item ui-card ui-card-pad-lg">
<h4>Always Revocable</h4>
<p>
Override any delegation by voting directly. Revoke delegation at any time.
Your voice remains under your control.
</p>
</div>
<div class="feature-item">
<div class="feature-item ui-card ui-card-pad-lg">
<h4>Transparent Networks</h4>
<p>
See delegation relationships (with privacy controls). Understand who influences
@ -147,7 +147,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
<div class="process-visual">
<div class="process-phase">
<div class="process-phase ui-card ui-card-pad-lg">
<div class="phase-icon">📖</div>
<h4>Inform</h4>
<p>
@ -156,7 +156,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</p>
</div>
<div class="process-arrow">→</div>
<div class="process-phase">
<div class="process-phase ui-card ui-card-pad-lg">
<div class="phase-icon">💬</div>
<h4>Discuss</h4>
<p>
@ -165,7 +165,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</p>
</div>
<div class="process-arrow">→</div>
<div class="process-phase">
<div class="process-phase ui-card ui-card-pad-lg">
<div class="phase-icon">✓</div>
<h4>Decide</h4>
<p>
@ -176,19 +176,19 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
<div class="feature-grid" style="margin-top: 2rem;">
<div class="feature-item">
<div class="feature-item ui-card ui-card-pad-lg">
<h4>Facilitator Tools</h4>
<p>Designated facilitators can organize discussions, highlight key points, and manage conversation flow.</p>
</div>
<div class="feature-item">
<div class="feature-item ui-card ui-card-pad-lg">
<h4>Configurable Phases</h4>
<p>Set minimum and maximum durations for each phase. Extend deadlines when needed.</p>
</div>
<div class="feature-item">
<div class="feature-item ui-card ui-card-pad-lg">
<h4>Notification System</h4>
<p>Members receive timely notifications about proposals, phase transitions, and voting deadlines.</p>
</div>
<div class="feature-item">
<div class="feature-item ui-card ui-card-pad-lg">
<h4>Amendment Process</h4>
<p>Proposals can be amended during deliberation based on feedback, with clear change tracking.</p>
</div>
@ -206,7 +206,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
<div class="moderation-features">
<div class="mod-feature">
<div class="mod-feature ui-card ui-card-pad-lg">
<h4>Public Moderation Ledger</h4>
<p>
Every moderation action is logged with who took it, what rule was violated,
@ -214,21 +214,21 @@ import PublicLayout from '../layouts/PublicLayout.astro';
No shadow banning. No hidden removals.
</p>
</div>
<div class="mod-feature">
<div class="mod-feature ui-card ui-card-pad-lg">
<h4>Cryptographic Audit Trail</h4>
<p>
The moderation ledger is cryptographically chained. Each entry references
the previous one, making retroactive alteration detectable. Integrity you can verify.
</p>
</div>
<div class="mod-feature">
<div class="mod-feature ui-card ui-card-pad-lg">
<h4>Rule-Based Actions</h4>
<p>
Communities define their moderation rules. Actions reference specific rules,
creating consistency and enabling appeals based on documented standards.
</p>
</div>
<div class="mod-feature">
<div class="mod-feature ui-card ui-card-pad-lg">
<h4>Separate Identities</h4>
<p>
Civic identity (who you are in discussions) and voting identity (how you voted)
@ -249,7 +249,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
<div class="plugin-categories">
<div class="plugin-category">
<div class="plugin-category ui-card ui-card-pad-lg">
<h4>Voting Plugins</h4>
<ul>
<li>Approval Voting</li>
@ -259,7 +259,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
<li>Quadratic Voting</li>
</ul>
</div>
<div class="plugin-category">
<div class="plugin-category ui-card ui-card-pad-lg">
<h4>Feature Plugins</h4>
<ul>
<li>Liquid Delegation</li>
@ -269,7 +269,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
<li>Conflict Resolution</li>
</ul>
</div>
<div class="plugin-category">
<div class="plugin-category ui-card ui-card-pad-lg">
<h4>Integration Plugins</h4>
<ul>
<li>GitLab Integration</li>
@ -300,19 +300,19 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
<div class="feature-grid">
<div class="feature-item">
<div class="feature-item ui-card ui-card-pad-lg">
<h4>Cross-Instance Coordination</h4>
<p>Communities on different Likwid instances can federate, sharing proposals and decisions.</p>
</div>
<div class="feature-item">
<div class="feature-item ui-card ui-card-pad-lg">
<h4>Trust Levels</h4>
<p>Configure trust levels for federated instances. Control what information is shared and how.</p>
</div>
<div class="feature-item">
<div class="feature-item ui-card ui-card-pad-lg">
<h4>Autonomy Preserved</h4>
<p>Each community maintains control over its own governance. Federation is cooperative, not hierarchical.</p>
</div>
<div class="feature-item">
<div class="feature-item ui-card ui-card-pad-lg">
<h4>Network Effects</h4>
<p>Federated communities can coordinate across geographic or functional boundaries.</p>
</div>
@ -397,13 +397,6 @@ import PublicLayout from '../layouts/PublicLayout.astro';
gap: 1.5rem;
}
.method-card {
background: var(--color-surface);
border: 1px solid var(--color-border);
border-radius: var(--radius-lg);
padding: 1.5rem;
}
.method-header {
display: flex;
align-items: center;
@ -456,9 +449,6 @@ import PublicLayout from '../layouts/PublicLayout.astro';
}
.feature-item {
padding: 1.5rem;
background: var(--color-surface);
border: 1px solid var(--color-border);
border-radius: var(--radius-md);
}
@ -488,9 +478,6 @@ import PublicLayout from '../layouts/PublicLayout.astro';
flex: 1;
max-width: 280px;
text-align: center;
padding: 1.5rem;
background: var(--color-surface);
border: 1px solid var(--color-border);
border-radius: var(--radius-lg);
}
@ -547,9 +534,6 @@ import PublicLayout from '../layouts/PublicLayout.astro';
}
.mod-feature {
padding: 1.5rem;
background: var(--color-surface);
border: 1px solid var(--color-border);
border-radius: var(--radius-md);
border-left: 3px solid var(--color-success);
}
@ -581,9 +565,6 @@ import PublicLayout from '../layouts/PublicLayout.astro';
}
.plugin-category {
padding: 1.5rem;
background: var(--color-surface);
border: 1px solid var(--color-border);
border-radius: var(--radius-md);
}