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

ui: polish demo page interactions

Browse source
This commit is contained in:
Marco Allegretti 2026-02-02 11:44:51 +01:00
parent 6881c12c16
commit d2650fba57
1 changed files with 827 additions and 808 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
frontend/src/pages/demo.astro
View file

@ -28,6 +28,10 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
</div>
` : ''}
<div class="demo-status-banner" id="demo-status">
<p>Loading demo status...</p>
</div>
<section class="demo-intro">
<div class="intro-content">
<h2>Why a Demo Instance?</h2>
@ -56,7 +60,7 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
</p>
<div class="community-cards" id="community-cards">
<div class="community-card ui-card ui-card-pad-lg ui-card-interactive">
<a href="/demo?enter=1&next=/communities/aurora" class="community-card ui-card ui-card-pad-lg ui-card-interactive">
<div class="card-header">
<h3>Aurora Framework</h3>
<span class="card-tag">Open Source Project</span>
@ -69,10 +73,10 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
<div class="card-stats" id="stats-aurora">
<span class="loading-text">Loading...</span>
</div>
<a href="/demo?enter=1&next=/communities/aurora" class="card-link">Explore Aurora →</a>
</div>
<span class="card-link">Explore Aurora →</span>
</a>
<div class="community-card ui-card ui-card-pad-lg ui-card-interactive">
<a href="/demo?enter=1&next=/communities/civic-commons" class="community-card ui-card ui-card-pad-lg ui-card-interactive">
<div class="card-header">
<h3>Civic Commons Network</h3>
<span class="card-tag">Political Movement</span>
@ -85,10 +89,10 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
<div class="card-stats" id="stats-civic-commons">
<span class="loading-text">Loading...</span>
</div>
<a href="/demo?enter=1&next=/communities/civic-commons" class="card-link">Explore Civic Commons →</a>
</div>
<span class="card-link">Explore Civic Commons →</span>
</a>
<div class="community-card ui-card ui-card-pad-lg ui-card-interactive">
<a href="/demo?enter=1&next=/communities/makers" class="community-card ui-card ui-card-pad-lg ui-card-interactive">
<div class="card-header">
<h3>Regional Makers Collective</h3>
<span class="card-tag">Federation</span>
@ -101,8 +105,8 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
<div class="card-stats" id="stats-makers">
<span class="loading-text">Loading...</span>
</div>
<a href="/demo?enter=1&next=/communities/makers" class="card-link">Explore Makers →</a>
</div>
<span class="card-link">Explore Makers →</span>
</a>
</div>
</section>
@ -128,21 +132,21 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
vote on proposals, create delegations, and see the member experience firsthand.
</p>
<div class="demo-accounts">
<button class="demo-login-btn ui-card ui-card-soft" data-username="contributor">
<button class="demo-login-btn ui-card ui-card-soft ui-card-interactive" data-username="contributor">
<div class="btn-icon">👤</div>
<div class="btn-info">
<strong>Contributor</strong>
<span>Standard member - can vote and participate</span>
</div>
</button>
<button class="demo-login-btn ui-card ui-card-soft" data-username="moderator">
<button class="demo-login-btn ui-card ui-card-soft ui-card-interactive" data-username="moderator">
<div class="btn-icon">🛡️</div>
<div class="btn-info">
<strong>Moderator</strong>
<span>Can moderate content and view logs</span>
</div>
</button>
<button class="demo-login-btn ui-card ui-card-soft" data-username="observer">
<button class="demo-login-btn ui-card ui-card-soft ui-card-interactive" data-username="observer">
<div class="btn-icon">👁️</div>
<div class="btn-info">
<strong>Observer</strong>
@ -376,6 +380,17 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
margin-bottom: 1rem;
}
.community-card {
display: flex;
flex-direction: column;
text-decoration: none;
color: inherit;
}
.community-card:hover {
color: inherit;
}
.card-stats {
display: flex;
gap: 1rem;
@ -652,6 +667,10 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
text-decoration: underline;
}
.community-card:hover .card-link {
text-decoration: underline;
}
.loading-text {
color: var(--color-text-muted);
font-style: italic;