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: dedupe features page cards via ui-card

Browse source
This commit is contained in:
Marco Allegretti 2026-01-30 10:04:22 +01:00
parent ba659eef80
commit 1088aef346
1 changed files with 27 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

73
frontend/src/pages/features.astro
View file

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