ui: improve about page navigation

This commit is contained in:
Marco Allegretti 2026-02-02 11:54:14 +01:00
parent 2d915da2c4
commit 1843dd80c3

View file

@ -10,9 +10,17 @@ import PublicLayout from '../layouts/PublicLayout.astro';
Likwid is a modular governance engine designed for organizations that need
structured, transparent, and auditable decision-making processes.
</p>
<nav class="page-nav" aria-label="On this page">
<a class="ui-pill ui-pill-recommended" href="#problem">Problem</a>
<a class="ui-pill ui-pill-core" href="#is">What it is</a>
<a class="ui-pill ui-pill-core" href="#is-not">What it is not</a>
<a class="ui-pill ui-pill-core" href="#audience">Who it's for</a>
<a class="ui-pill ui-pill-core" href="#principles">Principles</a>
<a class="ui-pill ui-pill-core" href="#technical">Tech</a>
</nav>
</header>
<section class="content-section">
<section class="content-section" id="problem">
<h2>What Problem Does Likwid Solve?</h2>
<p>
Most organizations—whether open source projects, political movements, or member associations—struggle
@ -34,7 +42,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</p>
</section>
<section class="content-section">
<section class="content-section" id="is">
<h2>What Likwid Is</h2>
<div class="is-grid">
<div class="is-item ui-card ui-card-pad-lg">
@ -56,7 +64,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
</section>
<section class="content-section">
<section class="content-section" id="is-not">
<h2>What Likwid Is Not</h2>
<div class="isnot-grid">
<div class="isnot-item ui-card ui-card-pad-lg">
@ -78,7 +86,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
</section>
<section class="content-section">
<section class="content-section" id="audience">
<h2>Who Is Likwid For?</h2>
<div class="audience-section">
<div class="audience-block ui-card ui-card-pad-lg">
@ -116,7 +124,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
</section>
<section class="content-section">
<section class="content-section" id="principles">
<h2>Core Principles</h2>
<div class="principles-grid">
<div class="principle">
@ -125,7 +133,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
<div class="principle">
<h4>Privacy Where It Matters</h4>
<p>Civic identities (who you are in discussions) and voting identities (how you voted) are separated. Participate openly while voting privately.</p>
<p>Voting results visibility can be permissioned. Communities decide who can view results details while keeping participation accessible.</p>
</div>
<div class="principle">
<h4>Process Over Features</h4>
@ -138,7 +146,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</div>
</section>
<section class="content-section">
<section class="content-section" id="technical">
<h2>Technical Foundation</h2>
<p>
Likwid is free and open source software (EUPL-1.2), built with modern, auditable technology:
@ -172,7 +180,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
</p>
</section>
<section class="content-section cta-section">
<section class="content-section cta-section" id="learn-more">
<h2>Learn More</h2>
<p>
Explore Likwid's capabilities, understand our vision, or see the system in action.
@ -209,6 +217,18 @@ import PublicLayout from '../layouts/PublicLayout.astro';
margin-bottom: 3rem;
}
.page-nav {
margin-top: 1.75rem;
display: flex;
gap: 0.5rem;
justify-content: center;
flex-wrap: wrap;
}
.page-nav a {
text-decoration: none;
}
.page-header h1 {
font-size: 2.5rem;
font-weight: 700;
@ -226,6 +246,7 @@ import PublicLayout from '../layouts/PublicLayout.astro';
.content-section {
padding: 2.5rem 0;
border-bottom: 1px solid var(--color-border);
scroll-margin-top: 6.5rem;
}
.content-section:last-child {