aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
authoreug-vs <eugene@eug-vs.xyz>2022-09-17 15:24:50 +0300
committereug-vs <eugene@eug-vs.xyz>2022-09-17 15:24:50 +0300
commit2a287f317a51f5f02b643af0acf2733cadbb8081 (patch)
tree725983c2fc98dfee2b7ed826f4fccb3bee6ca45a /src
downloadbenzin-next-2a287f317a51f5f02b643af0acf2733cadbb8081.tar.gz
feat: initial commit
Diffstat (limited to 'src')
-rw-r--r--src/deepReadDir.tsx12
-rw-r--r--src/pages/[...path].tsx56
-rw-r--r--src/pages/_app.tsx18
-rw-r--r--src/styles/globals.css143
4 files changed, 229 insertions, 0 deletions
diff --git a/src/deepReadDir.tsx b/src/deepReadDir.tsx
new file mode 100644
index 0000000..ec585ec
--- /dev/null
+++ b/src/deepReadDir.tsx
@@ -0,0 +1,12 @@
+import {lstat, readdir} from 'node:fs/promises'
+import {join} from 'node:path'
+
+const deepReadDir = async (dirPath: string): Promise<string[]> => await Promise.all(
+ (await readdir(dirPath)).map(async (entity) => {
+ const path = join(dirPath, entity)
+ return (await lstat(path)).isDirectory() ? await deepReadDir(path) : path
+ }),
+).then(arr => arr.flat());
+
+
+export default deepReadDir;
diff --git a/src/pages/[...path].tsx b/src/pages/[...path].tsx
new file mode 100644
index 0000000..30fdcd6
--- /dev/null
+++ b/src/pages/[...path].tsx
@@ -0,0 +1,56 @@
+import _ from 'lodash';
+import type { GetStaticPropsContext, NextPage } from "next";
+import ReactMarkdown from 'react-markdown';
+import Head from "next/head";
+import deepReadDir from "../deepReadDir";
+import fs from 'fs';
+
+
+const MARKDOWN_DIR = '../eug-vs-xyz/src';
+
+const transformLinkURI = (uri: string): string => {
+ return uri.match(/(.*)\.md/)?.[1] || uri;
+}
+
+export const getStaticProps = async (context: GetStaticPropsContext) => {
+ const path = _.isArray(context.params?.path) && context.params?.path || [context.params?.path];
+ const markdownSource = fs.readFileSync(`${MARKDOWN_DIR}/${path?.join('/')}.md`).toString();
+ return {
+ props: {
+ markdownSource,
+ path,
+ }
+ }
+}
+
+export const getStaticPaths = async () => {
+ const globalPaths = await deepReadDir(MARKDOWN_DIR);
+ const paths = globalPaths
+ .map(globalPath => globalPath.match(`${MARKDOWN_DIR}/(.*)\.md`)?.[1] )
+ .filter(p => p)
+ .map(p => p?.split('/'))
+ .map(path => ({ params: { path } }));
+ console.log(paths);
+ return {
+ paths,
+ fallback: false,
+ }
+}
+
+const Page: NextPage = ({ markdownSource }: any) => {
+ return (
+ <>
+ <Head>
+ <title>Create T3 App</title>
+ <meta name="description" content="Generated by create-t3-app" />
+ <link rel="icon" href="/favicon.ico" />
+ </Head>
+ <main>
+ <ReactMarkdown transformLinkUri={transformLinkURI}>{markdownSource}</ReactMarkdown>
+ </main>
+ </>
+ );
+};
+
+export default Page;
+
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
new file mode 100644
index 0000000..191f276
--- /dev/null
+++ b/src/pages/_app.tsx
@@ -0,0 +1,18 @@
+import "../styles/globals.css";
+import logo from '../../public/eug-vs.png';
+import type { AppProps } from "next/app";
+import Image from 'next/future/image';
+
+function MyApp({ Component, pageProps }: AppProps) {
+ return (
+ <>
+ <a href="/" style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', textDecoration: 'none', marginBottom: '12px' }}>
+ <Image src={logo} width={128} height={128} />
+ <h1>Eugene's Space</h1>
+ </a>
+ <Component {...pageProps} />
+ </>
+ )
+}
+
+export default MyApp;
diff --git a/src/styles/globals.css b/src/styles/globals.css
new file mode 100644
index 0000000..6023273
--- /dev/null
+++ b/src/styles/globals.css
@@ -0,0 +1,143 @@
+@font-face {
+ font-family: "Bitter";
+ src: url(../../public/fonts/Bitter-Regular.woff) format("truetype");
+}
+html {
+ font-family: "Open Sans", sans-serif;
+ color: #ebdbb2;
+ background-color: #282828;
+}
+body {
+ margin: 0 auto;
+ max-width: 1100px;
+ padding-left: 50px;
+ padding-right: 50px;
+ padding-top: 50px;
+ padding-bottom: 50px;
+ word-wrap: break-word;
+ text-rendering: optimizeLegibility;
+ font-kerning: normal;
+ font-size: 16px;
+}
+@media (max-width: 600px) {
+ body {
+ padding: 1em;
+ }
+}
+p {
+ margin: 1em 0;
+}
+a {
+ color: #fabd2f;
+ text-decoration: none;
+}
+a:hover {
+ text-decoration: underline;
+}
+img {
+ max-width: 100%;
+}
+h1 {
+ font-weight: normal;
+}
+h2, h3, h4, h5, h6 {
+ font-family: "Bitter", serif;
+ font-weight: normal;
+ line-height: 1.1;
+ margin-top: 1.4em;
+}
+h2 {
+ border-bottom: 1px solid rgba(255, 255, 255, 0.12);
+}
+h3 {
+ font-size: 21px;
+}
+ol, ul {
+ padding-left: 1.7em;
+ margin-top: 1em;
+}
+li > ol, li > ul {
+ margin-top: 0;
+}
+blockquote {
+ margin: 1em 0 1em 1.7em;
+ padding-left: 1em;
+ border-left: 2px solid #e6e6e6;
+ color: rgba(255, 255, 255, 0.75);
+ font-style: italic;
+}
+code {
+ font-family: monospace;
+ font-size: 90%;
+ margin: 0;
+ padding: 2px;
+ background: #1d2021;
+ border-radius: 4px;
+ border: 1px solid rgba(255, 255, 255, 0.12);
+}
+pre {
+ margin: 1em 0;
+ overflow: auto;
+ padding: 16px 8px;
+}
+pre code {
+ overflow: visible;
+}
+.sourceCode {
+ background-color: transparent;
+ overflow: visible;
+ border-radius: 4px;
+}
+div.sourceCode {
+ border: 1px solid rgba(255, 255, 255, 0.12);
+}
+code.sourceCode {
+ padding: 0;
+ border: none;
+}
+hr {
+ background-color: #1a1a1a;
+ border: none;
+ height: 1px;
+ margin: 1em 0;
+}
+table {
+ margin: 1em 0;
+ border-collapse: collapse;
+ width: 100%;
+ overflow-x: auto;
+ display: block;
+ font-variant-numeric: lining-nums tabular-nums;
+}
+table caption {
+ margin-bottom: 0.75em;
+}
+tbody {
+ margin-top: 0.5em;
+ border-top: 1px solid #1a1a1a;
+ border-bottom: 1px solid #1a1a1a;
+}
+th {
+ border-top: 1px solid #1a1a1a;
+ padding: 0.25em 0.5em 0.25em 0.5em;
+}
+td {
+ padding: 0.125em 0.5em 0.25em 0.5em;
+}
+header {
+ margin-bottom: 4em;
+ text-align: center;
+}
+#TOC li {
+ list-style: none;
+}
+#TOC a:not(:hover) {
+ text-decoration: none;
+}
+code{white-space: pre-wrap;}
+span.smallcaps{font-variant: small-caps;}
+span.underline{text-decoration: underline;}
+div.column{display: inline-block; vertical-align: top; width: 50%;}
+div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}
+ul.task-list{list-style: none;}
+.display.math{display: block; text-align: center; margin: 0.5rem auto;}