Add TOC and Layout components; update pages
This commit is contained in:
21
src/components/ContentTOC.astro
Normal file
21
src/components/ContentTOC.astro
Normal file
@@ -0,0 +1,21 @@
|
||||
---
|
||||
import { getCollection } from "astro:content";
|
||||
|
||||
const { sectionName } = Astro.props;
|
||||
|
||||
const entries = (await getCollection(sectionName)).sort((a, b) =>
|
||||
a.data.title.localeCompare(b.data.title),
|
||||
);
|
||||
|
||||
const articles = entries.filter((entry) => entry.id !== "index");
|
||||
---
|
||||
|
||||
<ul>
|
||||
{articles.map((entry) => (
|
||||
<li>
|
||||
<a href={`/${sectionName}/${entry.id}`}>
|
||||
{entry.data.title}
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
49
src/components/TOC.astro
Normal file
49
src/components/TOC.astro
Normal file
@@ -0,0 +1,49 @@
|
||||
---
|
||||
import { getCollection } from "astro:content";
|
||||
import { collectionNames } from "../config/content";
|
||||
|
||||
const sections = await Promise.all(
|
||||
collectionNames.map(async (name) => {
|
||||
const entries = (await getCollection(name)).sort((a, b) =>
|
||||
a.data.title.localeCompare(b.data.title),
|
||||
);
|
||||
|
||||
const indexEntry = entries.find((entry) => entry.id === "index");
|
||||
const articles = entries.filter((entry) => entry.id !== "index");
|
||||
|
||||
return {
|
||||
name,
|
||||
indexEntry,
|
||||
articles,
|
||||
};
|
||||
}),
|
||||
);
|
||||
---
|
||||
|
||||
<ul>
|
||||
{
|
||||
sections.map((section) => (
|
||||
<li>
|
||||
{section.indexEntry ? (
|
||||
<a href={`/${section.name}`}>
|
||||
{section.indexEntry.data.title}
|
||||
</a>
|
||||
) : (
|
||||
section.name
|
||||
)}
|
||||
|
||||
{section.articles.length > 0 && (
|
||||
<ul>
|
||||
{section.articles.map((entry) => (
|
||||
<li>
|
||||
<a href={`/${section.name}/${entry.id}`}>
|
||||
{entry.data.title}
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</li>
|
||||
))
|
||||
}
|
||||
</ul>
|
||||
@@ -2,9 +2,14 @@
|
||||
title: Website
|
||||
description: Learn about the Radium website
|
||||
---
|
||||
# Website
|
||||
import ContentTOC from '../../components/ContentTOC.astro';
|
||||
|
||||
The Radium website is the central hub for all things Radium. It includes the following sections:
|
||||
- [Home](https://radium.live/): The main landing page for Radium, where you can learn about the project and its features.
|
||||
- [Documentation](https://docs.radium.live/): The official documentation for Radium, which includes guides, API references, and tutorials.
|
||||
- [Community Forum](https://forum.radium.live/): A place to ask questions, share ideas, and connect with other Radium users.
|
||||
- [Blog](https://blog.radium.live/): A collection of articles and updates about Radium, including release notes, feature announcements, and community highlights.
|
||||
- [Blog](https://blog.radium.live/): A collection of articles and updates about Radium, including release notes, feature announcements, and community highlights.
|
||||
|
||||
|
||||
## Table of Contents
|
||||
<ContentTOC sectionName="website" />
|
||||
15
src/layouts/Layout.astro
Normal file
15
src/layouts/Layout.astro
Normal file
@@ -0,0 +1,15 @@
|
||||
---
|
||||
const { title } = Astro.props;
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Radium Help - {title}</title>
|
||||
</head>
|
||||
<body>
|
||||
<slot />
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
import { getCollection, render } from "astro:content";
|
||||
import { collectionNames, isSiteCollection } from "../../config/content";
|
||||
import Layout from "../../layouts/Layout.astro";
|
||||
|
||||
export async function getStaticPaths() {
|
||||
const paths = [];
|
||||
@@ -32,4 +33,6 @@ const { entry } = Astro.props;
|
||||
const { Content } = await render(entry);
|
||||
---
|
||||
|
||||
<Content />
|
||||
<Layout title={entry.data.title}>
|
||||
<Content />
|
||||
</Layout>
|
||||
@@ -1,43 +1,8 @@
|
||||
---
|
||||
import { getCollection } from "astro:content";
|
||||
import { collectionNames } from "../config/content";
|
||||
|
||||
const sections = await Promise.all(
|
||||
collectionNames.map(async (name) => {
|
||||
const entries = (await getCollection(name)).sort((a, b) =>
|
||||
a.data.title.localeCompare(b.data.title)
|
||||
);
|
||||
|
||||
const indexEntry = entries.find((entry) => entry.id === "index");
|
||||
const articles = entries.filter((entry) => entry.id !== "index");
|
||||
|
||||
return {
|
||||
name,
|
||||
indexEntry,
|
||||
articles,
|
||||
};
|
||||
})
|
||||
);
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
import TOC from "../components/TOC.astro";
|
||||
---
|
||||
|
||||
<ul>
|
||||
{sections.map((section) => (
|
||||
<li>
|
||||
{section.indexEntry ? (
|
||||
<a href={`/${section.name}`}>{section.indexEntry.data.title}</a>
|
||||
) : (
|
||||
section.name
|
||||
)}
|
||||
|
||||
{section.articles.length > 0 && (
|
||||
<ul>
|
||||
{section.articles.map((entry) => (
|
||||
<li>
|
||||
<a href={`/${section.name}/${entry.id}`}>{entry.data.title}</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
<Layout title="Home">
|
||||
<TOC />
|
||||
</Layout>
|
||||
|
||||
Reference in New Issue
Block a user