ux: dedupe about page cards via ui-card

This commit is contained in:
Marco Allegretti 2026-01-30 10:10:45 +01:00
parent 1088aef346
commit f6099c7637

View file

@ -37,19 +37,19 @@ import PublicLayout from '../layouts/PublicLayout.astro';
<section class="content-section"> <section class="content-section">
<h2>What Likwid Is</h2> <h2>What Likwid Is</h2>
<div class="is-grid"> <div class="is-grid">
<div class="is-item"> <div class="is-item ui-card ui-card-pad-lg">
<h4>A Governance Engine</h4> <h4>A Governance Engine</h4>
<p>Likwid provides the core infrastructure for collective decision-making: proposals, deliberation, voting, and implementation tracking.</p> <p>Likwid provides the core infrastructure for collective decision-making: proposals, deliberation, voting, and implementation tracking.</p>
</div> </div>
<div class="is-item"> <div class="is-item ui-card ui-card-pad-lg">
<h4>Modular by Design</h4> <h4>Modular by Design</h4>
<p>Every component is a plugin. Communities choose their voting methods, delegation rules, moderation policies, and integrations.</p> <p>Every component is a plugin. Communities choose their voting methods, delegation rules, moderation policies, and integrations.</p>
</div> </div>
<div class="is-item"> <div class="is-item ui-card ui-card-pad-lg">
<h4>Transparent by Default</h4> <h4>Transparent by Default</h4>
<p>All moderation actions are logged with reasons. There is no shadow banning. Audit trails are cryptographically verifiable.</p> <p>All moderation actions are logged with reasons. There is no shadow banning. Audit trails are cryptographically verifiable.</p>
</div> </div>
<div class="is-item"> <div class="is-item ui-card ui-card-pad-lg">
<h4>Self-Hostable</h4> <h4>Self-Hostable</h4>
<p>Organizations control their own data. Likwid runs on your infrastructure with no vendor lock-in.</p> <p>Organizations control their own data. Likwid runs on your infrastructure with no vendor lock-in.</p>
</div> </div>
@ -59,19 +59,19 @@ import PublicLayout from '../layouts/PublicLayout.astro';
<section class="content-section"> <section class="content-section">
<h2>What Likwid Is Not</h2> <h2>What Likwid Is Not</h2>
<div class="isnot-grid"> <div class="isnot-grid">
<div class="isnot-item"> <div class="isnot-item ui-card ui-card-pad-lg">
<h4>Not a Social Network</h4> <h4>Not a Social Network</h4>
<p>Likwid is not designed for casual conversation, content sharing, or social interactions. It's governance infrastructure.</p> <p>Likwid is not designed for casual conversation, content sharing, or social interactions. It's governance infrastructure.</p>
</div> </div>
<div class="isnot-item"> <div class="isnot-item ui-card ui-card-pad-lg">
<h4>Not a Simple Poll Tool</h4> <h4>Not a Simple Poll Tool</h4>
<p>While Likwid supports voting, it's designed for complex decisions with deliberation phases, multiple options, and sophisticated tallying methods.</p> <p>While Likwid supports voting, it's designed for complex decisions with deliberation phases, multiple options, and sophisticated tallying methods.</p>
</div> </div>
<div class="isnot-item"> <div class="isnot-item ui-card ui-card-pad-lg">
<h4>Not a Forum</h4> <h4>Not a Forum</h4>
<p>Discussions in Likwid are structured and goal-oriented. They're part of a decision process, not open-ended conversation.</p> <p>Discussions in Likwid are structured and goal-oriented. They're part of a decision process, not open-ended conversation.</p>
</div> </div>
<div class="isnot-item"> <div class="isnot-item ui-card ui-card-pad-lg">
<h4>Not a CRM or Membership System</h4> <h4>Not a CRM or Membership System</h4>
<p>Likwid handles governance, not member management, donations, or communications. It integrates with those systems.</p> <p>Likwid handles governance, not member management, donations, or communications. It integrates with those systems.</p>
</div> </div>
@ -81,7 +81,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
<section class="content-section"> <section class="content-section">
<h2>Who Is Likwid For?</h2> <h2>Who Is Likwid For?</h2>
<div class="audience-section"> <div class="audience-section">
<div class="audience-block"> <div class="audience-block ui-card ui-card-pad-lg">
<h4>Open Source & FLOSS Communities</h4> <h4>Open Source & FLOSS Communities</h4>
<p> <p>
Projects that need to make technical and organizational decisions collectively. Projects that need to make technical and organizational decisions collectively.
@ -89,7 +89,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
Integration with development workflows (GitLab, Forgejo, Gitea) and documentation systems. Integration with development workflows (GitLab, Forgejo, Gitea) and documentation systems.
</p> </p>
</div> </div>
<div class="audience-block"> <div class="audience-block ui-card ui-card-pad-lg">
<h4>Associations & NGOs</h4> <h4>Associations & NGOs</h4>
<p> <p>
Member-driven organizations requiring formal decision processes. Member-driven organizations requiring formal decision processes.
@ -97,7 +97,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
Transparent moderation for community standards enforcement. Transparent moderation for community standards enforcement.
</p> </p>
</div> </div>
<div class="audience-block"> <div class="audience-block ui-card ui-card-pad-lg">
<h4>Political Movements & Parties</h4> <h4>Political Movements & Parties</h4>
<p> <p>
Grassroots organizations, civic lists, and political parties. Grassroots organizations, civic lists, and political parties.
@ -105,7 +105,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
Liquid democracy features for modern participatory politics. Liquid democracy features for modern participatory politics.
</p> </p>
</div> </div>
<div class="audience-block"> <div class="audience-block ui-card ui-card-pad-lg">
<h4>Federated & Distributed Organizations</h4> <h4>Federated & Distributed Organizations</h4>
<p> <p>
Networks of chapters, working groups, or autonomous units. Networks of chapters, working groups, or autonomous units.
@ -143,7 +143,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
<p> <p>
Likwid is free and open source software (EUPL-1.2), built with modern, auditable technology: Likwid is free and open source software (EUPL-1.2), built with modern, auditable technology:
</p> </p>
<div class="tech-table"> <div class="tech-table ui-card">
<div class="tech-row"> <div class="tech-row">
<span class="tech-label">Backend</span> <span class="tech-label">Backend</span>
<span class="tech-value">Rust (Axum framework)</span> <span class="tech-value">Rust (Axum framework)</span>
@ -178,15 +178,15 @@ import PublicLayout from '../layouts/PublicLayout.astro';
Explore Likwid's capabilities, understand our vision, or see the system in action. Explore Likwid's capabilities, understand our vision, or see the system in action.
</p> </p>
<div class="cta-grid"> <div class="cta-grid">
<a href="/features" class="cta-card"> <a href="/features" class="cta-card ui-card ui-card-pad-lg">
<h4>Features</h4> <h4>Features</h4>
<p>Detailed explanation of voting methods, delegation, and moderation tools.</p> <p>Detailed explanation of voting methods, delegation, and moderation tools.</p>
</a> </a>
<a href="/manifesto" class="cta-card"> <a href="/manifesto" class="cta-card ui-card ui-card-pad-lg">
<h4>Manifesto</h4> <h4>Manifesto</h4>
<p>The technical and political vision behind Likwid's design.</p> <p>The technical and political vision behind Likwid's design.</p>
</a> </a>
<a href="/demo" class="cta-card"> <a href="/demo" class="cta-card ui-card ui-card-pad-lg">
<h4>Demo</h4> <h4>Demo</h4>
<p>Explore a live instance with pre-populated governance history.</p> <p>Explore a live instance with pre-populated governance history.</p>
</a> </a>
@ -284,9 +284,6 @@ import PublicLayout from '../layouts/PublicLayout.astro';
} }
.is-item, .isnot-item { .is-item, .isnot-item {
padding: 1.5rem;
background: var(--color-surface);
border: 1px solid var(--color-border);
border-radius: var(--radius-md); border-radius: var(--radius-md);
} }
@ -317,9 +314,6 @@ import PublicLayout from '../layouts/PublicLayout.astro';
} }
.audience-block { .audience-block {
padding: 1.5rem;
background: var(--color-surface);
border: 1px solid var(--color-border);
border-radius: var(--radius-md); border-radius: var(--radius-md);
} }
@ -369,8 +363,6 @@ import PublicLayout from '../layouts/PublicLayout.astro';
/* Tech table */ /* Tech table */
.tech-table { .tech-table {
background: var(--color-surface);
border: 1px solid var(--color-border);
border-radius: var(--radius-md); border-radius: var(--radius-md);
overflow: hidden; overflow: hidden;
margin: 1.5rem 0; margin: 1.5rem 0;
@ -435,9 +427,6 @@ import PublicLayout from '../layouts/PublicLayout.astro';
.cta-card { .cta-card {
display: block; display: block;
padding: 1.5rem;
background: var(--color-surface);
border: 1px solid var(--color-border);
border-radius: var(--radius-md); border-radius: var(--radius-md);
text-decoration: none; text-decoration: none;
transition: all var(--motion-fast) var(--easing-standard); transition: all var(--motion-fast) var(--easing-standard);