feat: regroup homepage into apps/tutorial/services/libraries cards

- assign each repo a section via config.yml (blog -> apps,
  media-manager -> tutorial, auth-server -> services, rest -> libraries)
- render one card per repo with a bottom-justified action row containing
  one link per available kind (view docs / view wiki / view lib /
  view tutorial)
- switch card grid to three columns with responsive breakpoints and
  taller cards
This commit is contained in:
2026-09-11 23:49:59 +05:30
parent 42e5ed290e
commit bd8ba6e67c
3 changed files with 170 additions and 94 deletions

View File

@@ -30,19 +30,25 @@
padding:3px 8px; border-radius:6px; font-size:0.85rem; font-weight:600;
border:1px solid #484f58;
}
.section { width:100%; max-width:900px; margin-bottom:2.5rem; }
.section { width:100%; max-width:1200px; margin-bottom:2.5rem; }
.section h2 {
font-size:1.2rem; color:var(--muted); text-transform:uppercase;
letter-spacing:1.5px; margin-bottom:1rem; border-bottom:1px solid var(--border);
padding-bottom:0.4rem;
}
.grid {
display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:1.5rem; width:100%;
display:grid; grid-template-columns:repeat(3, 1fr); gap:1.5rem; width:100%;
}
@media (max-width: 1024px) {
.grid { grid-template-columns:repeat(2, 1fr); }
}
@media (max-width: 640px) {
.grid { grid-template-columns:1fr; }
}
.card {
background:var(--card); border:1px solid var(--border); border-radius:12px;
padding:1.8rem; text-align:left;
padding:1.6rem; text-align:left; display:flex; flex-direction:column;
height:100%; min-height:200px;
transition:transform 0.15s ease,box-shadow 0.15s ease;
}
.card:hover {
@@ -51,11 +57,19 @@
}
.card h3 { color:var(--accent); font-size:1.4rem; margin-bottom:0.4rem; }
.card p { color:var(--muted); font-size:0.95rem; line-height:1.6; }
.card a {
color:var(--accent); text-decoration:none; display:inline-block;
margin-top:0.8rem; font-weight:500;
.card-actions {
margin-top:auto; padding-top:1.2rem; display:flex; flex-wrap:wrap; gap:0.6rem;
}
.card-actions a {
color:var(--accent); text-decoration:none; font-size:0.85rem; font-weight:600;
padding:0.45rem 0.9rem; border:1px solid var(--border); border-radius:999px;
background:rgba(45,212,191,0.06);
transition:border-color 0.15s ease,background 0.15s ease,color 0.15s ease;
}
.card-actions a:hover {
color:var(--accent-dim); border-color:var(--accent);
background:rgba(45,212,191,0.14);
}
.card a:hover { color:var(--accent-dim); text-decoration:underline; }
footer { margin-top:4rem; text-align:center; color:var(--muted); font-size:0.9rem; }
</style>
</head>
@@ -65,86 +79,104 @@
<p class="subtitle">Central documentation hub for Aetoskia projects</p>
</header>
<section class="section">
<h2>Apps</h2>
<div class="grid">
<div class="card">
<h3>Blog API</h3>
<p>A modular, async Blog API backend for FastAPI microservices. Provides streamlined CRUD operations for articles and authors.</p>
<div class="card-actions">
<a href="/blog/" target="_blank">view docs</a>
</div>
</div>
</div>
</section>
<section class="section">
<h2>Tutorial</h2>
<div class="grid">
<div class="card">
<h3>Media Manager Tutorial</h3>
<p>Step-by-step guide to the Media Manager architecture, ingestion pipeline, automation workflows, and integrations.</p>
<div class="card-actions">
<a href="/media-manager/" target="_blank">view tutorial</a>
</div>
</div>
</div>
</section>
<section class="section">
<h2>Services</h2>
<div class="grid">
<div class="card">
<h3>Auth Server</h3>
<p>Aetoskia authentication service. OpenAPI-driven, FastAPI backend for auth flows.</p>
<div class="card-actions">
<a href="/auth-server/api/" target="_blank">view docs</a>
</div>
</div>
</div>
</section>
<section class="section">
<h2>Libraries</h2>
<div class="grid">
<div class="card">
<h3>OpenAPI First</h3>
<p>Design-first API development toolkit enforcing OpenAPI contracts as the single source of truth.</p>
<a href="/openapi-first/lib/" target="_blank">View Documentation &rarr;</a>
<div class="card-actions">
<a href="/openapi-first/lib/" target="_blank">view lib</a>
</div>
</div>
<div class="card">
<h3>Doc Forge</h3>
<p>Renderer-agnostic Python documentation compiler powering MkDocs and MCP generation across Aetoskia projects.</p>
<a href="/doc-forge/lib/" target="_blank">View Documentation &rarr;</a>
<div class="card-actions">
<a href="/doc-forge/wiki/" target="_blank">view wiki</a>
<a href="/doc-forge/lib/" target="_blank">view lib</a>
</div>
</div>
<div class="card">
<h3>DAG Pipe</h3>
<p>Deterministic pipeline framework for executing state transformations through a directed acyclic graph (DAG).</p>
<a href="/dagpipe/lib/" target="_blank">View Documentation &rarr;</a>
<div class="card-actions">
<a href="/dagpipe/lib/" target="_blank">view lib</a>
</div>
</div>
<div class="card">
<h3>Mail Intake</h3>
<p>High-performance email ingestion and processing framework with pluggable adapters and automation workflows.</p>
<a href="/mail-intake/lib/" target="_blank">View Documentation &rarr;</a>
<div class="card-actions">
<a href="/mail-intake/lib/" target="_blank">view lib</a>
</div>
</div>
<div class="card">
<h3>Omniread</h3>
<p>Unified ingestion and normalization layer for structured and unstructured data sources.</p>
<a href="/omniread/lib/" target="_blank">View Documentation &rarr;</a>
<div class="card-actions">
<a href="/omniread/lib/" target="_blank">view lib</a>
</div>
</div>
<div class="card">
<h3>Py JWT</h3>
<p>Lightweight, explicit JWT utilities for Python services with strong validation and minimal magic.</p>
<a href="/py-jwt/lib/" target="_blank">View Documentation &rarr;</a>
<div class="card-actions">
<a href="/py-jwt/lib/" target="_blank">view lib</a>
</div>
</div>
<div class="card">
<h3>Hexa</h3>
<p>Hexagonal architecture framework and toolbox for Python services.</p>
<a href="/hexa/lib/" target="_blank">View Documentation &rarr;</a>
</div>
</div>
</section>
<section class="section">
<h2>APIs</h2>
<div class="grid">
<div class="card">
<h3>Auth Server</h3>
<p>Aetoskia authentication service. OpenAPI-driven, FastAPI backend for auth flows.</p>
<a href="/auth-server/api/" target="_blank">View Documentation &rarr;</a>
</div>
<div class="card">
<h3>Blog API</h3>
<p>A modular, async Blog API backend for FastAPI microservices. Provides streamlined CRUD operations for articles and authors.</p>
<a href="/blog/" target="_blank">View Documentation &rarr;</a>
</div>
</div>
</section>
<section class="section">
<h2>Wiki</h2>
<div class="grid">
<div class="card">
<h3>Doc Forge</h3>
<p>Renderer-agnostic Python documentation compiler powering MkDocs and MCP generation across Aetoskia projects.</p>
<a href="/doc-forge/wiki/" target="_blank">View Documentation &rarr;</a>
<div class="card-actions">
<a href="/hexa/lib/" target="_blank">view lib</a>
</div>
</div>
<div class="card">
<h3>Mongo Ops</h3>
<p>A modular, async MongoDB operations layer for FastAPI microservices. Simplifies CRUD, transactions, and model management.</p>
<a href="/mongo-ops/" target="_blank">View Documentation &rarr;</a>
</div>
</div>
</section>
<section class="section">
<h2>Tutorials</h2>
<div class="grid">
<div class="card">
<h3>Media Manager Tutorial</h3>
<p>Step-by-step guide to the Media Manager architecture, ingestion pipeline, automation workflows, and integrations.</p>
<a href="/media-manager/" target="_blank">View Tutorial &rarr;</a>
<div class="card-actions">
<a href="/mongo-ops/" target="_blank">view wiki</a>
</div>
</div>
</div>
</section>