refactor to pages

This commit is contained in:
Janis
2023-01-29 20:01:56 +01:00
parent 976a11a78f
commit 0997e8fdb8
26 changed files with 2050 additions and 1252 deletions

View File

@@ -0,0 +1,22 @@
import React from "react";
import styles from "../styles/modules/ArticleContentTable.module.scss";
export default function ContentTable({ contentTableData }: { contentTableData: any }) {
return (
<div className={styles.articleContentTable}>
<div className={styles.stickyContainer}>
<div className={styles.list}>
<h2>Contents</h2>
{contentTableData?.map((e, i) => {
return (
<a key={i} href={"#" + e.anchor}>
{e.title}
</a>
);
})}
</div>
{contentTableData?.length < 15 ? <div className={styles.adContainer}>Future advertisement</div> : ""}
</div>
</div>
);
}

View File

@@ -8,10 +8,9 @@ import styles from "../styles/modules/markdown.module.scss";
import remarkGfm from "remark-gfm";
import remarkGemoji from "remark-gemoji";
import remarkStringify from "remark-stringify";
import { useState, useEffect } from "react";
import { useLocalStorage } from "usehooks-ts";
import React from "react";
import Head from "../app/head";
import { formatTextToUrlName } from "../utils";
function flatten(text, child) {
@@ -31,6 +30,7 @@ export default function Markdown({ value }: { value: any }) {
className={styles.markdown}
//@ts-ignore
remarkPlugins={[remarkGfm, remarkGemoji, remarkStringify]}
//@ts-ignore
components={{
h1: HeadingRenderer,
h2: HeadingRenderer,

28
components/Sidebar.tsx Normal file
View File

@@ -0,0 +1,28 @@
import React from "react";
import styles from "../styles/modules/Sidebar.module.scss";
export default function Sidebar() {
return (
<div className={styles.sidebar}>
<div className={styles.stickyContainer}>
<div className={styles.sidebarContainer}>
<h3>Popular</h3>
<a href="#"> Set up Docker</a>
<a href="#"> Set up Docker</a>
<a href="#"> Set up Docker</a>
<a href="#"> Set up Docker</a>
<a href="#"> Set up Docker</a>
</div>
<div className={styles.sidebarContainer}>
<h3>Related</h3>
<a href="#"> Set up Docker</a>
<a href="#"> Set up Docker</a>
<a href="#"> Set up Docker</a>
<a href="#"> Set up Docker</a>
<a href="#"> Set up Docker</a>
</div>
<div className={styles.adContainer}>Future advertisement</div>
</div>
</div>
);
}