commit
9ea7accfb7
3
.gitignore
vendored
3
.gitignore
vendored
|
|
@ -8,3 +8,6 @@ build/
|
|||
*.js
|
||||
*.log
|
||||
*.lg
|
||||
|
||||
# ignore test articles
|
||||
src/public/Blog/*
|
||||
12
README.md
12
README.md
|
|
@ -1,21 +1,17 @@
|
|||
# [Blog in a Matrix](https://bloginamatrix.xyz)
|
||||
|
||||
New single page blog site application written in Nim.
|
||||
New blog site written in Nim.
|
||||
|
||||
Articles/blogs written in markdown using [Joplin](https://github.com/laurent22/joplin/ "The best notes app/markdown editor ever made.") then exported as `HTML` to the `/src/public` directory. Joplin has support for [the extended markdown syntax](https://github.com/laurent22/joplin/blob/dev/readme/markdown.md), [KaTeX](https://khan.github.io/KaTeX/), and [Mermaid.js](https://mermaidjs.github.io/) out of the box. The syntax can be farther extended with [plugins](https://github.com/joplin/plugins/) (e.g. [music sheet notation](https://github.com/joplin/plugin-abc-sheet-music)).
|
||||
Articles/blogs written in markdown using [Joplin](https://github.com/laurent22/joplin/ "The best notes app/markdown editor ever made.") then exported as a HTML directory to `/src/public` where it will create a `Blog` folder.
|
||||
|
||||
MTH tech stack is used, pronounced _Meth_ or _Math_:
|
||||
|
||||
- [Markdown](https://daringfireball.net/projects/markdown/)
|
||||
- [Tailwindcss](https://tailwindcss.com/)
|
||||
- [HappyX](https://hapticx.github.io/happyx/)
|
||||
Joplin has support for [the extended markdown](https://github.com/laurent22/joplin/blob/dev/readme/markdown.md), [KaTeX](https://khan.github.io/KaTeX/), and [Mermaid.js](https://mermaidjs.github.io/) out of the box and can be farther extended with [plugins](https://github.com/joplin/plugins/) like [music sheet notation](https://github.com/joplin/plugin-abc-sheet-music).
|
||||
|
||||
## Development
|
||||
|
||||
Install Nim dependencies:
|
||||
|
||||
```sh
|
||||
nimble install happyx
|
||||
nimble install happyx@#head
|
||||
```
|
||||
|
||||
Development server:
|
||||
|
|
|
|||
|
|
@ -1,8 +1,17 @@
|
|||
import happyx
|
||||
|
||||
component Glass:
|
||||
arg: string
|
||||
var
|
||||
newClass = "flex items-center justify-center flex-1 m-14 max-md:m-7 max-sm:m-0 rounded-3xl max-sm:rounded-none bg-white/20 backdrop-blur-xl drop-shadow-lg noise text-5xl"
|
||||
newHomeClass = newClass & " font-giga"
|
||||
|
||||
component Glass:
|
||||
text: string
|
||||
`template`:
|
||||
tArticle(class="flex items-center justify-center flex-1 m-14 max-md:m-7 max-sm:m-0 rounded-3xl max-sm:rounded-none bg-white/20 backdrop-blur-xl drop-shadow-lg noise"):
|
||||
{self.arg}
|
||||
tH(class=newClass):
|
||||
{self.text}
|
||||
|
||||
component GlassHome:
|
||||
text: string
|
||||
`template`:
|
||||
tH(class=newHomeClass):
|
||||
{self.text}
|
||||
|
|
@ -1,14 +1,17 @@
|
|||
import happyx, navButton
|
||||
|
||||
# https://git.inamatrix.xyz/array-in-a-matrix/bloginamatrix.xyz/src/commit/218b85211755732344f3fd08ab4f4a3e01ab08ac/src/templates/index.nimja#L57
|
||||
|
||||
import os, happyx, navButton
|
||||
component Nav:
|
||||
`template`:
|
||||
tNav(class="text-center text-white w-64 max-md:w-32 max-sm:w-full bg-black"):
|
||||
tP(class="font-asix"):
|
||||
"Sidebar"
|
||||
|
||||
tUl(class="list-none"):
|
||||
component NavButton("Home", "/")
|
||||
component NavButton("Test Article", "/test")
|
||||
component NavButton("Page does not exist", "/404")
|
||||
# component NavButton("Test Article", "/read/test")
|
||||
# component NavButton("Example Article", "/read/Example 1")
|
||||
# component NavButton("Example 2 Article", "/read/Example 2")
|
||||
|
||||
# TODO: automatically create a button for each html file in /src/public/Blog
|
||||
#! this dont worky idk
|
||||
for kind, path in walkDir("/src/public/Blog"):
|
||||
if kind == pcFile:
|
||||
component NavButton(path, "/read/" & path)
|
||||
12
src/components/read.nim
Normal file
12
src/components/read.nim
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
import os, happyx
|
||||
|
||||
component Read:
|
||||
title: string
|
||||
|
||||
# TODO: fix
|
||||
# if !fileExists("/public/Blog/{self.title}.html"):
|
||||
# route "/404"
|
||||
# else:
|
||||
|
||||
`template`:
|
||||
tIframe(src="/public/Blog/{self.title}.html", class="flex items-center flex-1 m-14 max-md:m-7 max-sm:m-0 rounded-3xl max-sm:rounded-none")
|
||||
24
src/fonts.css
Normal file
24
src/fonts.css
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
.noise {
|
||||
background-image: url(data:image/png;base64,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);
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'FiraCode';
|
||||
src: url("/public/fonts/FiraCode-Regular.woff2") format("woff2");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'asix';
|
||||
src: url("/public/fonts/ASIX-FOUNDER.woff2") format("woff2");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'asix';
|
||||
src: url("/public/fonts/ASIX-FOUNDER-Italic.woff2") format("woff2");
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'giga';
|
||||
src: url("/public/fonts/Giga.woff2") format("woff2");
|
||||
}
|
||||
|
|
@ -3,7 +3,7 @@
|
|||
<meta charset="utf-8">
|
||||
<title>Blog in a Matrix</title>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<!-- <script>
|
||||
<script>
|
||||
tailwind.config = {
|
||||
theme: {
|
||||
extend: {
|
||||
|
|
@ -17,37 +17,11 @@
|
|||
},
|
||||
}
|
||||
};
|
||||
</script> -->
|
||||
<!-- end tailwindcss -->
|
||||
<!-- <style>
|
||||
.noise {
|
||||
background-image: url(data:image/png;base64,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);
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'FiraCode';
|
||||
src: url("/src/public/fonts/FiraCode-Regular.woff2") format("woff2");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'asix';
|
||||
src: url("/src/public/fonts/ASIX-FOUNDER.woff2") format("woff2");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'asix';
|
||||
src: url("/src/public/fonts/ASIX-FOUNDER-Italic.woff2") format("woff2");
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'giga';
|
||||
src: url("/src/public/fonts/Giga.woff2") format("woff2");
|
||||
}
|
||||
</style> -->
|
||||
</script>
|
||||
<link rel="stylesheet" type="text/css" href="fonts.css" />
|
||||
</head>
|
||||
<body class="flex flex-col min-h-screen m-0 bg-gradient-to-br from-yellow-400 to-green-900">
|
||||
<main id="app" class="flex flex-1 w-full max-sm:flex-col noise"></main>
|
||||
<main id="app" class="flex flex-1 w-full max-sm:flex-col"></main>
|
||||
<script src="main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
18
src/main.nim
18
src/main.nim
|
|
@ -1,22 +1,18 @@
|
|||
import
|
||||
os,
|
||||
happyx,
|
||||
path_params,
|
||||
components/[nav, glass]
|
||||
components/[nav, glass, read]
|
||||
|
||||
appRoutes("app"):
|
||||
"/":
|
||||
component Nav
|
||||
component Glass("Blog in a Matrix")
|
||||
component GlassHome("Blog in a Matrix")
|
||||
|
||||
"/<article>":
|
||||
"/read/<article>":
|
||||
component Nav
|
||||
component Glass($article)
|
||||
# TODO: pass article title to component which renders the article; modify Glass or a new component is needed
|
||||
# TODO: check if article name exists otherwise route to /404
|
||||
|
||||
"/<errorCode>":
|
||||
component Nav
|
||||
component Glass("HTTP Error: " & $errorCode)
|
||||
component Read($article)
|
||||
|
||||
notfound:
|
||||
route "/404"
|
||||
component Nav
|
||||
component Glass("404 page diverges.")
|
||||
|
|
@ -1,5 +1,4 @@
|
|||
import happyx
|
||||
|
||||
pathParams:
|
||||
article string
|
||||
errorCode int
|
||||
article string
|
||||
Loading…
Reference in a new issue