diff --git a/Makefile b/Makefile index 06f9d41..78d62e5 100644 --- a/Makefile +++ b/Makefile @@ -4,7 +4,8 @@ themeDir=../.. .PHONY: dev, build, clean dev: - hugo server -D -s $(source) --themesDir $(themeDir) + rm -r exampleSite/resources + hugo server -D -s $(source) --themesDir $(themeDir) --disableFastRender build: hugo -D --gc --minify -s $(source) --themesDir $(themeDir) diff --git a/README.md b/README.md index 55e6a57..ef3f179 100644 --- a/README.md +++ b/README.md @@ -9,6 +9,7 @@ A Clean and minimal Hugo theme porting from Minima on Hexo. [Click me](https://h - [x] light/dark mode - [x] Code Hightlight - [x] KaTeX +- [x] Mermaid - [x] Google analytics - [x] Disqus/OvO comments - [x] Optional ToC @@ -46,13 +47,15 @@ Follow [exampleSite/config.toml](https://github.com/Mivinci/hugo-theme-minima/bl | title | string | Title of the post, will be rendered in a `h1` tag | | description | string | Description of the post, will be rendered in a `p` tag | | date | string | Datetime that the post is written | -| math | bool | True if the post needs to render math formulas | -| comment | bool | True if the post allows people to make comments | -| draft | bool | True if the post isn't already to production | -| toc | bool | True if the post needs a ToC | | categories | array | Array of categories the posts belongs to | | series | array | Array of series the post belongs to | | tags | array | Array of tags the posts is related to | +| math | bool | True if the post needs to render math formulas | +| mermaid | bool | True if the post needs to render mermaid graphs | +| comment | bool | True if the post allows people to make comments | +| draft | bool | True if the post isn't already to production | +| toc | bool | True if the post needs a ToC | + ### Feedback diff --git a/exampleSite/config.toml b/exampleSite/config.toml index 74ca37b..fab58d9 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -25,6 +25,8 @@ subtitle = "" # Comment decides the comment plugin used on your blog site, # available plugins: disqus, ovo. comment = "disqus" +# timeformat +timeformat = "Jan 2, 2006" # OvO is a comment plugin written by the author of Minima. diff --git a/exampleSite/content/about.md b/exampleSite/content/about.md index 29cbfc6..7e1b642 100644 --- a/exampleSite/content/about.md +++ b/exampleSite/content/about.md @@ -1,7 +1,7 @@ --- title: "About" -date: 2021-07-18T11:24:06+08:00 -draft: true +date: 2021-07-16T11:24:06+08:00 +draft: false type: about --- diff --git a/exampleSite/content/an_empty_file.md b/exampleSite/content/an_empty_file.md deleted file mode 100644 index a09dd86..0000000 --- a/exampleSite/content/an_empty_file.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -author: Hugo Authors -title: An Empty File -date: 2021-06-18T10:52:59+08:00 -description: This is an empty file. -math: true ---- \ No newline at end of file diff --git a/exampleSite/content/emoji-support.md b/exampleSite/content/emoji-support.md deleted file mode 100644 index 0958fe3..0000000 --- a/exampleSite/content/emoji-support.md +++ /dev/null @@ -1,46 +0,0 @@ -+++ -author = "Hugo Authors" -title = "Emoji Support" -date = "2021-07-18T10:52:59+08:00" -description = "Guide to emoji usage in Hugo" -comment = true -+++ - -`THERE ARE SOMETHING` - -Emoji can be enabled in a Hugo project in a number of ways. - -The [`emojify`](https://gohugo.io/functions/emojify/) function can be called directly in templates or [Inline Shortcodes](https://gohugo.io/templates/shortcode-templates/#inline-shortcodes). - -To enable emoji globally, set `enableEmoji` to `true` in your site's [configuration](https://gohugo.io/getting-started/configuration/) and then you can type emoji shorthand codes directly in content files; e.g. - -

🙈 :see_no_evil: 🙉 :hear_no_evil: 🙊 :speak_no_evil:

-
- -The [Emoji cheat sheet](http://www.emoji-cheat-sheet.com/) is a useful reference for emoji shorthand codes. - -*** - -**N.B.** The above steps enable Unicode Standard emoji characters and sequences in Hugo, however the rendering of these glyphs depends on the browser and the platform. To style the emoji you can either use a third party emoji font or a font stack; e.g. - -{{< highlight html >}} -.emoji { - font-family: Apple Color Emoji, Segoe UI Emoji, NotoColorEmoji, Segoe UI Symbol, Android Emoji, EmojiSymbols; -} -{{< /highlight >}} - -{{< css.inline >}} - -{{< /css.inline >}} diff --git a/exampleSite/content/instruction.md b/exampleSite/content/instruction.md new file mode 100644 index 0000000..1b17888 --- /dev/null +++ b/exampleSite/content/instruction.md @@ -0,0 +1,67 @@ +--- +author: Hugo Authors +title: Instruction +date: 2021-07-19T10:52:59+08:00 +description: A Clean and minimal Hugo theme porting from Minima on Hexo. [Click me](https://h.xjj.pub/) to take a look at the demo site. +math: true +--- + + + +## Features + +- [x] Light/dark mode +- [x] Code Hightlight +- [x] KaTeX +- [x] Mermaid +- [x] Google analytics +- [x] Disqus/OvO comments +- [x] Optional ToC + +## Usage + +Before using Minima, make sure you've got Hugo(v0.41.0 or higher) installed on your device. + +### Installation + +Suppose `blog` is where you place your sources. + +```bash +cd blog +git init +git submodule add --depth 1 https://github.com/mivinci/hugo-theme-minima.git themes/minima +``` + +Or `clone` directly if you don't wanna use the Git submodule. + +```bash +git clone https://github.com/mivinci/hugo-theme-minima.git themes/minima +``` + +Anyways, you just need to put Minima under the `blog/themes` directory. + +### Configuration + +Follow [exampleSite/config.toml](https://github.com/Mivinci/hugo-theme-minima/blob/main/exampleSite/config.toml) and edit your own `blog/config.toml` file. + +### Supported Front Matters + +| Field | Type | Explanation | +| :---------- | :----- | :----------------------------------------------------- | +| title | string | Title of the post, will be rendered in a `h1` tag | +| description | string | Description of the post, will be rendered in a `p` tag | +| date | string | Datetime that the post is written | +| categories | array | Array of categories the posts belongs to | +| series | array | Array of series the post belongs to | +| tags | array | Array of tags the posts is related to | +| math | bool | True if the post needs to render math formulas | +| mermaid | bool | True if the post needs to render mermaid graphs | +| comment | bool | True if the post allows people to make comments | +| draft | bool | True if the post isn't already to production | +| toc | bool | True if the post needs a ToC | + + + +### Feedback + +Feedbacks are welcome [here](https://github.com/Mivinci/hugo-theme-minima/issues). diff --git a/exampleSite/content/markdown-syntax.md b/exampleSite/content/markdown-syntax.md index b525499..d05fd49 100644 --- a/exampleSite/content/markdown-syntax.md +++ b/exampleSite/content/markdown-syntax.md @@ -1,21 +1,11 @@ -+++ -author = "Hugo Authors" -title = "Markdown Syntax Guide" -date = "2021-07-18T10:52:59+08:00" -description = "Sample article showcasing basic Markdown syntax and formatting for HTML elements." -tags = [ - "markdown", - "css", - "html", -] -categories = [ - "themes", - "syntax", -] -series = ["Themes Guide"] -aliases = ["migrate-from-jekyl"] -toc = true -+++ +--- +author: "Hugo Authors" +title: "Markdown Syntax Guide" +date: "2021-07-18T10:52:59+08:00" +description: "Sample article showcasing basic Markdown syntax and formatting for HTML elements." +toc: true +categories: ["Markdown"] +--- This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme. @@ -120,7 +110,8 @@ Tables aren't part of the core Markdown spec, but Hugo supports supports them ou 2. Second item 3. Third item -- [x] xxx +- [x] checked +- [ ] not checked #### Unordered List @@ -138,14 +129,3 @@ Tables aren't part of the core Markdown spec, but Hugo supports supports them ou * Milk * Cheese -## Other Elements — abbr, sub, sup, kbd, mark - -GIF is a bitmap image format. - -H2O - -Xn + Yn = Zn - -Press CTRL+ALT+Delete to end the session. - -Most salamanders are nocturnal, and hunt for insects, worms, and other small creatures. diff --git a/exampleSite/content/math-typesetting.md b/exampleSite/content/math-typesetting.md index f3d7e1d..542f647 100644 --- a/exampleSite/content/math-typesetting.md +++ b/exampleSite/content/math-typesetting.md @@ -4,6 +4,7 @@ title: Math Typesetting date: 2021-07-18T10:52:59+08:00 description: A brief guide to setup KaTeX math: true +categories: ["Markdown", "KaTeX"] --- Mathematical notation in a Hugo project can be enabled by using third party JavaScript libraries. diff --git a/exampleSite/content/mermaid-graphs.md b/exampleSite/content/mermaid-graphs.md new file mode 100644 index 0000000..a56f499 --- /dev/null +++ b/exampleSite/content/mermaid-graphs.md @@ -0,0 +1,18 @@ +--- +author: Hugo Authors +title: Mermaid Graphs +date: 2021-07-18T10:52:59+08:00 +description: A brief guide to setup Mermaid +mermaid: true +draft: false +categories: ["Markdown", "Mermaid"] +--- + +Here's a simple mermaid flowchart. + +{{}} +graph LR + Start --> Stop +{{}} + +For more documentations on Mermaid, view [mermaid](https://mermaid-js.github.io/mermaid). diff --git a/exampleSite/content/placeholder-text.md b/exampleSite/content/placeholder-text.md index 9222b4e..bf54229 100644 --- a/exampleSite/content/placeholder-text.md +++ b/exampleSite/content/placeholder-text.md @@ -3,11 +3,8 @@ author = "Hugo Authors" title = "Placeholder Text" date = "2021-07-18T10:52:59+08:00" description = "Lorem Ipsum Dolor Si Amet" -tags = [ - "markdown", - "text", -] toc = true +categories = ["Markdown"] +++ Lorem est tota propiore conpellat pectoribus de pectora summo. Redit teque digerit hominumque toris verebor lumina non cervice subde tollit usus habet Arctonque, furores quas nec ferunt. Quoque montibus nunc caluere tempus inhospita parcite confusaque translucet patri vestro qui optatis lumine cognoscere flos nubis! Fronde ipsamque patulos Dryopen deorum. diff --git a/exampleSite/resources/_gen/assets/scss/sass/main.scss_39bf35e71bb037755f66ddebdcd2b350.content b/exampleSite/resources/_gen/assets/scss/sass/main.scss_39bf35e71bb037755f66ddebdcd2b350.content deleted file mode 100644 index f45637c..0000000 --- a/exampleSite/resources/_gen/assets/scss/sass/main.scss_39bf35e71bb037755f66ddebdcd2b350.content +++ /dev/null @@ -1,3 +0,0 @@ -:root{--pm: #0fa0ce;--bd: #e1e1e1;--bg: #fff;--ft: #222;--tag: #333;--w-mobile: 640px}html.dark{--bg: #262d33;--ft: #c5c4c4;--bd: #555;--tag: #999;--ovo-ft: var(--ft);--ovo-bdr: var(--bd);--ovo-bg: var(--bg);--ovo-bg-hvr: #555;--ovo-tag: #30363d}body{font-family:Helvetica, sans-serif;max-width:var(--w-mobile);margin:50px auto 0;font-size:16px;font-weight:400;color:var(--ft);background-color:var(--bg);transition-property:background-color, border-color, color;transition-duration:.5s}h1,h2,h3,h4,h5{font-family:'Noto Serif SC', 'Times New Roman', sans-serif;font-weight:700;line-height:1.5}p{margin-top:0;line-height:1.5;text-align:left}hr{margin:30px 0;border-width:0;border-top:1px solid var(--bd)}pre,code{font-family:Menlo, Monaco, Consolas, "Courier New", monospace;font-size:13px}p code{background-color:var(--bd);padding:.2em .4em}a{text-decoration:none}a:not(.icon){color:inherit;text-decoration:underline;text-decoration-color:var(--pm);background-image:linear-gradient(to bottom, rgba(0,0,0,0) 50%, var(--pm) 50%);background-size:100% 200%;transition:background-position .2s ease-in-out}a:not(.icon):hover,a:not(.icon):focus{background-position:0 100%;color:#fff}a.icon:hover{transform:translateY(-5px);transition:transform .3s ease-in-out}main{animation:showup 0.7s}.row{display:flex;align-items:center}.col{display:flex;flex-direction:column}.jc-bt{justify-content:space-between}.as-s{align-self:start}.ai-c{align-items:center}.gap-0_5{gap:.8rem}.gap-1{gap:1rem;row-gap:1rem}.gap-2{gap:2rem;row-gap:2rem}.gap-3{gap:3rem;row-gap:3rem}.lg-1{font-size:1.2em}.sm-1{font-size:.8em}.mtb-1{margin:1em 0}.mtb-2{margin:2em 0}.mb-1{margin-bottom:1em}.mb-0{margin-bottom:0}.mt-2{margin-top:2em}.ml-1{margin-left:1em}.ml-2{margin-left:2em}.mr-2{margin-right:2em}.mw-6{min-width:6em}.c-tag{color:var(--tag)}.btn{cursor:pointer}.hidden{display:none}.tag-pm{font-size:.7em;font-weight:bold;line-height:1;color:#fff;background-color:var(--pm);border-radius:20px;padding:2px 8px}details.toc ul{list-style-type:none;padding-inline-start:1em;margin:0}details.toc ul>li{margin:1em 0}.nowrap{white-space:nowrap;overflow:auto}@keyframes showup{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}@media (max-width: 640px){body{margin:1em 2em}.row-mob{flex-direction:column;align-items:flex-start;gap:0;row-gap:0}.al-c-mob{align-items:center}.col-rev-mob{flex-direction:column-reverse}.sm-2-mob{font-size:.9em}.mb-0_5-mob{margin-bottom:.5em}.mb-1_5-mob{margin-bottom:1.5em}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:rgba(128,128,128,0.7)}::-webkit-scrollbar-thumb:window-inactive{background:rgba(128,128,128,0.2)}::-webkit-scrollbar-thumb:active{background-color:gray}.nowrap::-webkit-scrollbar{display:none;width:0}.md blockquote{font-family:'Inter';background-color:rgba(148,148,149,0.08);margin:1.5em 0px;padding:1.1em 20px 1px 20px;border-left:8px solid var(--pm);font-style:italic}.md table{border-collapse:collapse;border-spacing:0;display:block;max-width:100%;width:100%;margin:1em 0;overflow:auto}.md table th{background-color:var(--bg)}.md table th,table td{padding:10px 20px;border:1px solid var(--bd)}.md img{width:100%;max-width:100%}.md li{margin-top:.5em}.md .katex{overflow:auto hidden}pre[class*="language-"],code[class*="language-"]{color:#d4d4d4;font-size:13px;text-shadow:none;font-family:Menlo, Monaco, Consolas, "Courier New", monospace;line-height:1.5;color:#d4d4d4}.chroma{background-color:#292929;margin:.5em 0}.chroma .lntd{vertical-align:top;padding:0;margin:0;border:0}.chroma .lntable{border-spacing:0;padding:0;margin:0;border:0;width:auto;overflow:auto;display:block}.chroma .lnt{color:#999;display:block;padding-left:.5em;padding-right:1em;text-align:right;line-height:1.5;font-size:13px}.chroma .kc,.chroma .kd,.chroma .kn,.chroma .kp,.chroma .kr,.chroma .kt,.chroma .k,.chroma .si{color:#569cd6}.chroma .na{color:#9cdcfe}.chroma .n,.chroma .nb,.chroma .bp,.chroma .nc,.chroma .no,.chroma .nd,.chroma .ni,.chroma .ne,.chroma .nf,.chroma .fm,.chroma .nl,.chroma .nn{color:#3f4c50}.chroma .py,.chroma .nt,.chroma .nv,.chroma .vc,.chroma .vg,.chroma .vi,.chroma .vm{color:#569cd6}.chroma .s,.chroma .sa,.chroma .sb,.chroma .sc,.chroma .dl,.chroma .sd,.chroma .s2,.chroma .se,.chroma .sh,.chroma .sx,.chroma .sr,.chroma .s1,.chroma .ss{color:#ce9178}.chroma .m,.chroma .mb,.chroma .mf,.chroma .mh,.chroma .mi,.chroma .il,.chroma .mo{color:#b5cea8}.chroma .c,.chroma .ch,.chroma .cm,.chroma .c1,.chroma .cs{color:#517043} - -/*# sourceMappingURL=minima.1629301135.css.map */ \ No newline at end of file diff --git a/exampleSite/resources/_gen/assets/scss/sass/main.scss_39bf35e71bb037755f66ddebdcd2b350.json b/exampleSite/resources/_gen/assets/scss/sass/main.scss_39bf35e71bb037755f66ddebdcd2b350.json deleted file mode 100644 index 48f6467..0000000 --- a/exampleSite/resources/_gen/assets/scss/sass/main.scss_39bf35e71bb037755f66ddebdcd2b350.json +++ /dev/null @@ -1 +0,0 @@ -{"Target":"minima.1629301135.css","MediaType":"text/css","Data":{}} \ No newline at end of file diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 9371de8..88c52a5 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -5,14 +5,14 @@

{{ .Title }}

- Posted at — {{ dateFormat "Jan 2, 2006" .Date }} + Posted at — {{ dateFormat .Site.Params.timeformat .Date }} {{ if .Draft }} DRAFT {{ end }}
-

{{ .Description }}

+

{{ .Description | markdownify | safeHTML }}

{{ .Content }}
@@ -21,6 +21,10 @@ {{ partial "math.html" . }} {{ end }} +{{ if or .Params.mermaid .Site.Params.mermaid }} +{{ partial "mermaid.html" . }} +{{ end }} + {{ if and .Params.comment (eq .Site.Params.comment "disqus")}} {{ partial "disqus.html" . }} {{ end }} diff --git a/layouts/index.html b/layouts/index.html index 04295c2..5466315 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -12,7 +12,7 @@ {{ $paginator := .Paginate (where .Site.RegularPages "Kind" "page") }} {{ range $paginator.Pages }}
-
{{ dateFormat "Jan 2, 2006" .Date }}
+
{{ dateFormat .Site.Params.timeformat .Date }}
{{ .Title }}
{{ end }} diff --git a/layouts/partials/head.html b/layouts/partials/head.html index d417d56..f339a7e 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -19,13 +19,14 @@ - {{ $hash := now.Unix }} {{ $options := (dict "targetPath" (printf `minima.%d.css` $hash) "outputStyle" "compressed" "enableSourceMap" true) }} {{ $style := resources.Get "sass/main.scss" | resources.ToCSS $options }} - + {{ $options := (dict "targetPath" (printf `minima.%d.js` $hash) "minify" true) }} + {{ $js := resources.Get "js/main.js" | js.Build $options }} + + \ No newline at end of file diff --git a/layouts/shortcodes/mermaid.html b/layouts/shortcodes/mermaid.html new file mode 100644 index 0000000..13638ee --- /dev/null +++ b/layouts/shortcodes/mermaid.html @@ -0,0 +1 @@ +

{{ safeHTML .Inner }}

\ No newline at end of file diff --git a/static/js/main.js b/static/js/main.js deleted file mode 100644 index 5ca79f9..0000000 --- a/static/js/main.js +++ /dev/null @@ -1,21 +0,0 @@ -window.addEventListener('DOMContentLoaded', function () { - const light = '🌝', dark = '🌚'; - const LIGHT = 'light', DARK = 'dark'; - const themeSwitcher = document.getElementById('theme-switcher'); - - themeSwitcher.innerHTML = localStorage.theme === LIGHT ? light : dark; - - themeSwitcher.addEventListener('click', function () { - const currentTheme = localStorage.theme, - newTheme = currentTheme === LIGHT ? DARK : LIGHT, - { classList } = document.querySelector('html'), - text = newTheme === LIGHT ? light : dark; - classList.remove(currentTheme); - classList.add(newTheme); - localStorage.theme = newTheme; - themeSwitcher.innerHTML = text; - }); - - - -}); \ No newline at end of file