Skip to content

chore: docs, handbok, 404 page #470

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
ronggur merged 1 commit into from
Oct 31, 2025
Merged

chore: docs, handbok, 404 page #470

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 9 additions & 0 deletions astro.config.mjs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -109,38 +109,47 @@ export default defineConfig({
{
label: 'Datum Documentation',
autogenerate: { directory: 'docs/overview' },
collapsed: false, // First group is expanded by default
},
{
label: 'Quickstart',
autogenerate: { directory: 'docs/quickstart' },
collapsed: true, // All other groups are collapsed by default
},
{
label: 'Platform',
autogenerate: { directory: 'docs/platform' },
collapsed: true,
},
{
label: 'API',
autogenerate: { directory: 'docs/api' },
collapsed: true,
},
{
label: 'Runtime',
autogenerate: { directory: 'docs/runtime' },
collapsed: true,
},
{
label: 'Workflows',
autogenerate: { directory: 'docs/workflows' },
collapsed: true,
},
{
label: 'Assets',
autogenerate: { directory: 'docs/assets' },
collapsed: true,
},
{
label: 'For Alt Clouds',
autogenerate: { directory: 'docs/alt-cloud' },
collapsed: true,
},
{
label: 'Guides',
autogenerate: { directory: 'docs/guides' },
collapsed: true,
},
{
label: 'Glossary',
Expand Down
83 changes: 40 additions & 43 deletions src/components/TableOfContents.astro
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,10 @@ const {
const filteredHeadings = headings.filter((heading: MarkdownHeading) => heading.depth <= 3);
---

<aside class={`toc-container ${className || ''} ${sticky ? 'sticky top-0' : ''}`}>
{showTitle && <h3 class="toc-title">{title}</h3>}

{
filteredHeadings.length > 0 ? (
{
filteredHeadings.length > 0 && (
<aside class={`toc-container ${className || ''} ${sticky ? 'sticky top-0' : ''}`}>
{showTitle && <h3 class="toc-title">{title}</h3>}
<nav class={`toc-nav`}>
<ul class="toc-list">
{filteredHeadings.map((heading: MarkdownHeading) => (
Expand All @@ -29,54 +28,52 @@ const filteredHeadings = headings.filter((heading: MarkdownHeading) => heading.d
))}
</ul>
</nav>
) : (
<div class="toc-empty">
<p>No table of contents available</p>
</div>
)
}
</aside>
</aside>
)
}

<script>
// Add active link highlighting based on scroll position
function updateActiveTOCLink() {
// Check if TOC exists before running the script
document.addEventListener('DOMContentLoaded', () => {
const tocLinks = document.querySelectorAll('.toc-link');
const sections = document.querySelectorAll('h1[id], h2[id], h3[id], h4[id], h5[id], h6[id]');
if (tocLinks.length === 0) return;

let current = '';
// Add active link highlighting based on scroll position
function updateActiveTOCLink() {
const sections = document.querySelectorAll('h1[id], h2[id], h3[id], h4[id], h5[id], h6[id]');
let current = '';

sections.forEach((section) => {
const element = section as HTMLElement;
const sectionTop = element.offsetTop;
if (window.scrollY >= sectionTop - 200) {
current = section.getAttribute('id') || '';
}
});
sections.forEach((section) => {
const element = section as HTMLElement;
const sectionTop = element.offsetTop;
if (window.scrollY >= sectionTop - 200) {
current = section.getAttribute('id') || '';
}
});

tocLinks.forEach((link) => {
link.classList.remove('active');
if (link.getAttribute('href') === `#${current}`) {
link.classList.add('active');
}
});
}
tocLinks.forEach((link) => {
link.classList.remove('active');
if (link.getAttribute('href') === `#${current}`) {
link.classList.add('active');
}
});
}

// Throttle scroll events
let ticking = false;
function requestTick() {
if (!ticking) {
requestAnimationFrame(updateActiveTOCLink);
ticking = true;
// Throttle scroll events
let ticking = false;
function requestTick() {
if (!ticking) {
requestAnimationFrame(updateActiveTOCLink);
ticking = true;
}
}
}

function handleScroll() {
ticking = false;
requestTick();
}
function handleScroll() {
ticking = false;
requestTick();
}

// Add scroll listener and initialize
document.addEventListener('DOMContentLoaded', () => {
// Initialize and add scroll listener
updateActiveTOCLink();
window.addEventListener('scroll', handleScroll);
});
Expand Down
Empty file removed src/components/starlight/TableOfContents.astro
View file
Open in desktop
Empty file.
22 changes: 13 additions & 9 deletions src/pages/404.astro
View file
Open in desktop
Copy link
Collaborator

@felixwidjaja felixwidjaja Oct 31, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nice find!

Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@ import '@v1/styles/global.css';
import Layout from '@layouts/Layout.astro';
import Hero from '@components/Hero.astro';
import Footer from '@components/Footer.astro';
import Button from '@components/Button.astro';
import Image404 from '@v1/assets/images/404.png';
import Icon from '@components/Icon.astro';
import { Image } from 'astro:assets';

const title = "Sorry, we can't find that page";
Expand All @@ -22,14 +22,18 @@ const description = 'The page you are looking for does not exist.';
<Image src={Image404} alt="404" class="mx-auto mb-12 h-auto w-full max-w-[423px]" />
<article class="prose prose-xl mx-auto text-center">
<p class="mb-12">Please check the URL and try again.</p>
<a href="/" class="btn btn--glacier-mist-700 btn--large mr-1">
Return to homepage
<Icon name="arrow-right" size="md" />
</a>
<a href="/docs/" class="btn btn--glacier-mist-700 btn--large ml-1">
Browse our Docs
<Icon name="arrow-right" size="md" />
</a>
<Button
text="Return to homepage"
href="/"
class="btn btn--alpha mr-1"
icon={{ name: 'arrow-right', size: 'md' }}
/>
<Button
text="Browse our Docs"
href="/docs/"
class="btn btn--alpha ml-1"
icon={{ name: 'arrow-right', size: 'md' }}
/>
</article>
</main>
</div>
Expand Down
4 changes: 4 additions & 0 deletions src/v1/styles/components-handbook.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,10 @@

.handbook-toc {
@apply border-glacier-mist-900 relative hidden w-full flex-col gap-y-4 border-l-1 pt-9 pb-12 pl-7 md:mb-0 md:max-w-60.25 lg:flex;

.article-aside {
@apply mb-6;
}
}

.handbook-toc .toc-container {
Expand Down
Loading