lwd/hugo-theme-relearn
1
0
Fork 0
mirror of https://github.com/McShelby/hugo-theme-relearn synced 2025-04-30 11:29:05 +08:00
Code Issues Packages Projects Releases Wiki Activity

tree: make more robust, change separator

Browse Source
This commit is contained in:
Sören Weber 2025-03-24 15:04:52 +01:00
parent c062fd1ed2
commit c5d591c514
No known key found for this signature in database
GPG Key ID: BEC6D55545451B6D
9 changed files with 191 additions and 179 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
docs/content/authoring/markdown.en.md
View File

@ -442,37 +442,37 @@ Markdown will automatically number each of your items consecutively. This means,
{{% badge color="#7dc903" icon="fa-fw fas fa-puzzle-piece" %}}Relearn{{% /badge %}} You can add lists as a tree with configurable icons and colors. {{% badge color="#7dc903" icon="fa-fw fas fa-puzzle-piece" %}}Relearn{{% /badge %}} You can add lists as a tree with configurable icons and colors.
Text can be followed by optional double colons (`::`) to define the icon and another optional double colons to define the icon's color. The name can be followed by an optional pipe (`|`) to define an icon and further optional pipe to define the icon's color.
More details can be found in the [`tree` shortcode docs](shortcodes/tree). More details can be found in the [`tree` shortcode docs](shortcodes/tree).
````md ````md
```tree ```tree
- home::folder - home | folder
- .config::folder - .config | folder
- My Documents::folder::gold - My Documents | folder | gold
- index.html - index.html
- resume.odt::file-word::#df6f40 - resume.odt | file-word | #df6f40
- Images::folder - Images | folder
- pic1.jpg - pic1.jpg
- pic2.jpg::file-image::secondary - pic2.jpg | file-image | secondary
- Code::folder - Code | folder
- home.php::fa-fw fab fa-php::#888cc4 - home.php | fa-fw fab fa-php | #888cc4
``` ```
```` ````
{{% notice style="code" icon="eye" title="Result" %}} {{% notice style="code" icon="eye" title="Result" %}}
```tree ```tree
- home::folder - home | folder
- .config::folder - .config | folder
- My Documents::folder::gold - My Documents | folder | gold
- index.html - index.html
- resume.odt::file-word::#df6f40 - resume.odt | file-word | #df6f40
- Images::folder - Images | folder
- pic1.jpg - pic1.jpg
- pic2.jpg::file-image::secondary - pic2.jpg | file-image | secondary
- Code::folder - Code | folder
- home.php::fa-fw fab fa-php::#888cc4 - home.php | fa-fw fab fa-php | #888cc4
``` ```
{{% /notice %}} {{% /notice %}}

30
docs/content/authoring/structure/index.en.md
View File

@ -12,21 +12,21 @@ The theme generates the navigation menu out of the given directory structure.
Organize your site like [any other Hugo project](https://gohugo.io/content/structure/). Typically, you will have a _content_ directory with all your pages. Organize your site like [any other Hugo project](https://gohugo.io/content/structure/). Typically, you will have a _content_ directory with all your pages.
````tree ````tree
- content::folder - content | folder
- log::folder - log | folder
- first-day::folder - first-day | folder
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- first-sub-page::folder - first-sub-page | folder
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- picture1.png::file-alt::accent - picture1.png | file-alt | accent
- plain.txt::file-alt::accent - plain.txt | file-alt | accent
- second-day::folder - second-day | folder
- index.md::fa-fw fab fa-markdown::secondary - index.md | fa-fw fab fa-markdown | secondary
- picture1.png::file-alt::accent - picture1.png | file-alt | accent
- picture2.png::file-alt::accent - picture2.png | file-alt | accent
- third-day.md::fa-fw fab fa-markdown::secondary - third-day.md | fa-fw fab fa-markdown | secondary
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
```` ````
> [!note] > [!note]

42
docs/content/configuration/sidebar/menus/_index.en.md
View File

@ -327,18 +327,18 @@ For both sections, the default `shortcuts` Hugo menu should be displayed as if [
Directory structure: Directory structure:
````tree ````tree
- content::folder - content | folder
- log::folder - log | folder
- first-day.md::fa-fw fab fa-markdown::secondary - first-day.md | fa-fw fab fa-markdown | secondary
- second-day.md::fa-fw fab fa-markdown::secondary - second-day.md | fa-fw fab fa-markdown | secondary
- third-day.md::fa-fw fab fa-markdown::secondary - third-day.md | fa-fw fab fa-markdown | secondary
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- ship::folder - ship | folder
- cargo.md::fa-fw fab fa-markdown::secondary - cargo.md | fa-fw fab fa-markdown | secondary
- midst.md::fa-fw fab fa-markdown::secondary - midst.md | fa-fw fab fa-markdown | secondary
- upper.md::fa-fw fab fa-markdown::secondary - upper.md | fa-fw fab fa-markdown | secondary
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
```` ````
{{% badge style="cyan" icon="gears" title=" " %}}Option{{% /badge %}} {{% badge style="green" icon="fa-fw fab fa-markdown" title=" " %}}Front Matter{{% /badge %}} Using [Hugo's cascade feature](https://gohugo.io/content-management/front-matter/#cascade), we can redefine the menus once in `log/_index.md` and `ship/_index.md` setting `sidebarmenus` so they will be used in all children pages. {{% badge style="cyan" icon="gears" title=" " %}}Option{{% /badge %}} {{% badge style="green" icon="fa-fw fab fa-markdown" title=" " %}}Front Matter{{% /badge %}} Using [Hugo's cascade feature](https://gohugo.io/content-management/front-matter/#cascade), we can redefine the menus once in `log/_index.md` and `ship/_index.md` setting `sidebarmenus` so they will be used in all children pages.
@ -372,15 +372,15 @@ You may have the need to add arbitrary links at some point in your menu that sho
Assume the following structure Assume the following structure
````tree ````tree
- content::folder - content | folder
- log::folder - log | folder
- first-day.md::fa-fw fab fa-markdown::secondary - first-day.md | fa-fw fab fa-markdown | secondary
- second-day.md::fa-fw fab fa-markdown::secondary - second-day.md | fa-fw fab fa-markdown | secondary
- third-day.md::fa-fw fab fa-markdown::secondary - third-day.md | fa-fw fab fa-markdown | secondary
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- burning-sail-incident.md::fa-fw fab fa-markdown::secondary - burning-sail-incident.md | fa-fw fab fa-markdown | secondary
- kraken-incident.md::fa-fw fab fa-markdown::secondary - kraken-incident.md | fa-fw fab fa-markdown | secondary
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
```` ````
You now want to add a top level menu entry that points to `third-day` as separate `crows-nest-incident`. You now want to add a top level menu entry that points to `third-day` as separate `crows-nest-incident`.

82
docs/content/configuration/sitemanagement/multilingual/_index.en.md
View File

@ -65,24 +65,24 @@ Here's how to make your site multilingual using [translations by file name](http
2. Duplicate your content files and add language codes to their file names: 2. Duplicate your content files and add language codes to their file names:
````tree ````tree
- content::folder - content | folder
- log::folder - log | folder
- first-day::folder - first-day | folder
- _index.en.md::fa-fw fab fa-markdown::secondary - _index.en.md | fa-fw fab fa-markdown | secondary
- _index.pir.md::fa-fw fab fa-markdown::secondary - _index.pir.md | fa-fw fab fa-markdown | secondary
- second-day::folder - second-day | folder
- index.en.md::fa-fw fab fa-markdown::secondary - index.en.md | fa-fw fab fa-markdown | secondary
- index.pir.md::fa-fw fab fa-markdown::secondary - index.pir.md | fa-fw fab fa-markdown | secondary
- third-day.en.md::fa-fw fab fa-markdown::secondary - third-day.en.md | fa-fw fab fa-markdown | secondary
- third-day.pir.md::fa-fw fab fa-markdown::secondary - third-day.pir.md | fa-fw fab fa-markdown | secondary
- _index.en.md::fa-fw fab fa-markdown::secondary - _index.en.md | fa-fw fab fa-markdown | secondary
- _index.pir.md::fa-fw fab fa-markdown::secondary - _index.pir.md | fa-fw fab fa-markdown | secondary
- _index.en.md::fa-fw fab fa-markdown::secondary - _index.en.md | fa-fw fab fa-markdown | secondary
- _index.pir.md::fa-fw fab fa-markdown::secondary - _index.pir.md | fa-fw fab fa-markdown | secondary
- themes::folder - themes | folder
- hugo-theme-relearn::folder - hugo-theme-relearn | folder
- ...::folder - ... | folder
- hugo.toml::file-alt::accent - hugo.toml | file-alt | accent
```` ````
## Translation by Content Directory ## Translation by Content Directory
@ -114,29 +114,29 @@ The theme also support [translations by content directory](https://gohugo.io/con
2. Duplicate your content files into separate directories named by their language code: 2. Duplicate your content files into separate directories named by their language code:
````tree ````tree
- content::folder - content | folder
- en::folder - en | folder
- log::folder - log | folder
- first-day::folder - first-day | folder
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- second-day::folder - second-day | folder
- index.md::fa-fw fab fa-markdown::secondary - index.md | fa-fw fab fa-markdown | secondary
- third-day.md::fa-fw fab fa-markdown::secondary - third-day.md | fa-fw fab fa-markdown | secondary
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- pir::folder - pir | folder
- log::folder - log | folder
- first-day::folder - first-day | folder
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- second-day::folder - second-day | folder
- index.md::fa-fw fab fa-markdown::secondary - index.md | fa-fw fab fa-markdown | secondary
- third-day.md::fa-fw fab fa-markdown::secondary - third-day.md | fa-fw fab fa-markdown | secondary
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- themes::folder - themes | folder
- hugo-theme-relearn::folder - hugo-theme-relearn | folder
- ...::folder - ... | folder
- hugo.toml::file-alt::accent - hugo.toml | file-alt | accent
```` ````

26
docs/content/configuration/sitemanagement/structure/_index.en.md
View File

@ -8,19 +8,19 @@ weight = 1
If you've followed the [Getting Started](introduction/quickstart) guide, your directory layout will look similar to this: If you've followed the [Getting Started](introduction/quickstart) guide, your directory layout will look similar to this:
````tree ````tree
- content::folder - content | folder
- log::folder - log | folder
- first-day::folder - first-day | folder
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- second-day::folder - second-day | folder
- index.md::fa-fw fab fa-markdown::secondary - index.md | fa-fw fab fa-markdown | secondary
- third-day.md::fa-fw fab fa-markdown::secondary - third-day.md | fa-fw fab fa-markdown | secondary
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- _index.md::fa-fw fab fa-markdown::secondary - _index.md | fa-fw fab fa-markdown | secondary
- themes::folder - themes | folder
- hugo-theme-relearn::folder - hugo-theme-relearn | folder
- ...::folder - ... | folder
- hugo.toml::file-alt::accent - hugo.toml | file-alt | accent
```` ````
Hugo uses a [union file system](https://gohugo.io/getting-started/directory-structure/#union-file-system), which lets you combine multiple directories. Hugo uses a [union file system](https://gohugo.io/getting-started/directory-structure/#union-file-system), which lets you combine multiple directories.

92
docs/content/shortcodes/tree.en.md
View File

@ -7,10 +7,10 @@ title = 'Tree'
The `tree` shortcode displays a list as a tree with configurable icons and colors. The `tree` shortcode displays a list as a tree with configurable icons and colors.
````tree ````tree
- home::folder - home | folder
- .config::folder - .config | folder
- My Documents::folder::magic - My Documents | folder | magic
- home.php::fa-fw fab fa-php::#888cc4 - home.php | fa-fw fab fa-php | #888cc4
```` ````
## Usage ## Usage
@ -20,10 +20,10 @@ The `tree` shortcode displays a list as a tree with configurable icons and color
````md ````md
```tree ```tree
- home::folder - home | folder
- .config::folder - .config | folder
- My Documents::folder::magic - My Documents | folder | magic
- home.php::fa-fw fab fa-php::#888cc4 - home.php | fa-fw fab fa-php | #888cc4
``` ```
```` ````
@ -32,10 +32,10 @@ The `tree` shortcode displays a list as a tree with configurable icons and color
````go ````go
{{%/* tree */%}} {{%/* tree */%}}
- home::folder - home | folder
- .config::folder - .config | folder
- My Documents::folder::magic - My Documents | folder | magic
- home.php::fa-fw fab fa-php::#888cc4 - home.php | fa-fw fab fa-php | #888cc4
{{%/* /tree */%}} {{%/* /tree */%}}
```` ````
@ -45,10 +45,10 @@ The `tree` shortcode displays a list as a tree with configurable icons and color
````go ````go
{{ partial "shortcodes/tree.html" (dict {{ partial "shortcodes/tree.html" (dict
"page" . "page" .
"content" `- home::folder "content" `- home | folder
- .config::folder - .config | folder
- My Documents::folder::magic - My Documents | folder | magic
- home.php::fa-fw fab fa-php::#888cc4` - home.php | fa-fw fab fa-php | #888cc4`
)}} )}}
```` ````
@ -65,9 +65,9 @@ Codefence syntax is widely available in other Markdown parsers like GitHub and t
### Item Syntax ### Item Syntax
`<NAME> [ :: <ICON> [ :: <COLOR> ] ]` `<NAME> [ | <ICON> [ | <COLOR> ] ]`
The **NAME** can be followed by optional double colons (`::`) to define an **ICON** and further optional double colons to define the icon's **COLOR**. The **NAME** can be followed by an optional pipe (`|`) to define an **ICON** and further optional pipe to define the icon's **COLOR**.
- **ICON**: [Font Awesome icon name](shortcodes/icon#finding-an-icon) set to the left of the **NAME**. If you give a single string, it is selected from Font Awesome's [solid](https://fontawesome.com/icons?d=gallery&s=solid&m=free) icons. If you want to use a different set, you have to give the complete styles after the double colons. See above example for the `home.php`. - **ICON**: [Font Awesome icon name](shortcodes/icon#finding-an-icon) set to the left of the **NAME**. If you give a single string, it is selected from Font Awesome's [solid](https://fontawesome.com/icons?d=gallery&s=solid&m=free) icons. If you want to use a different set, you have to give the complete styles after the double colons. See above example for the `home.php`.
@ -91,40 +91,40 @@ Every possible combination
````md ````md
```tree ```tree
- just name - [just name](http://example.com) | folder
- Documents - Documents
- My Documents - My Documents
- simple icons::folder - simple icons | folder
- Documents::folder - Documents | folder
- My Documents::folder - My Documents | folder
- not so simple icons::file-alt::secondary - not so simple icons | file-alt | secondary
- a.png::file-alt - a.png | file-alt
- a with border.png::file-alt - a with border.png | file-alt
- mindblowing icons::fa-fw fab fa-markdown::accent - mindblowing icons | fa-fw fab fa-markdown | accent
- text.md::fa-fw fab fa-markdown - text.md | fa-fw fab fa-markdown
- alternative text.md::fa-fw fab fa-markdown - alternative text.md | fa-fw fab fa-markdown
- and now with color::fa-fw fab fa-php - and now with color | fa-fw fab fa-php
- script.php::fa-fw fab fa-markdown::purple - script.php | fa-fw fab fa-markdown | purple
- alt script.php::fa-fw fab fa-markdown::#888cc4 - alt script.php | fa-fw fab fa-markdown | #888cc4
- magic.php::fa-fw fab fa-markdown::orange - magic.php | fa-fw fab fa-markdown | orange
``` ```
```` ````
````tree ````tree
- name-only - [just name](http://example.com) | folder
- Documents - Documents
- My Documents - My Documents
- simple icons::folder - simple icons | folder
- Documents::folder - Documents | folder
- My Documents::folder - My Documents | folder
- not so simple icons::file-alt::secondary - not so simple icons | file-alt | secondary
- a.png::file-alt - a.png | file-alt
- a with border.png::file-alt - a with border.png | file-alt
- mindblowing icons::fa-fw fab fa-markdown::accent - mindblowing icons | fa-fw fab fa-markdown | accent
- text.md::fa-fw fab fa-markdown - text.md | fa-fw fab fa-markdown
- alternative text.md::fa-fw fab fa-markdown - alternative text.md | fa-fw fab fa-markdown
- and now with color::fa-fw fab fa-php - and now with color | fa-fw fab fa-php
- script.php::fa-fw fab fa-php::purple - script.php | fa-fw fab fa-php | purple
- alt script.php::fa-fw fab fa-php::#888cc4 - alt script.php | fa-fw fab fa-php | #888cc4
- magic.php::fa-fw fab fa-php::orange - magic.php | fa-fw fab fa-php | orange
```` ````

4
layouts/partials/_relearn/boxStyle.gotmpl
View File

@ -3,7 +3,7 @@
{{- range site.Params.boxStyle }} {{- range site.Params.boxStyle }}
{{- if eq (lower .identifier) $style }} {{- if eq (lower .identifier) $style }}
{{- $title := or .title (.i18n | T) }} {{- $title := or .title (.i18n | T) }}
{{- $set = dict "style" $style "title" $title "icon" .icon }} {{- $set = dict "identifier" .identifier "style" $style "title" $title "icon" .icon }}
{{- break }} {{- break }}
{{- end }} {{- end }}
{{- end }} {{- end }}
@ -18,7 +18,7 @@
) }} ) }}
{{- if eq .identifier $style }} {{- if eq .identifier $style }}
{{- $title := .identifier | T }} {{- $title := .identifier | T }}
{{- $set = dict "style" $style "title" $title "icon" .icon }} {{- $set = dict "identifier" .identifier "style" $style "title" $title "icon" .icon }}
{{- break }} {{- break }}
{{- end }} {{- end }}
{{- end }} {{- end }}

52
layouts/partials/shortcodes/tree.html
View File

@ -1,32 +1,44 @@
{{ $content := .content | .page.RenderString }} {{ $content := .content | .page.RenderString }}
<div class="list-tree"> <div class="list-tree">
{{- $matches := findRESubmatch `<li>([^<>:]+)::([\w-]+)::([^<>\n\r\t ]+)` $content }} {{- $matches := findRESubmatch `<li>([\s\S]*?)(</li|<ul)` $content }}
{{- range $matches }} {{- range $matches }}
{{- $name := index . 1 }}
{{- $icon := index . 2 }}
{{- $color := index . 3 }}
{{- $replacement := "" }} {{- $replacement := "" }}
{{- if (where site.Params.boxStyle "identifier" $color | first 1) }} {{- $text := index . 1 }}
{{- $replacement = printf `<li><i class="fa-fw fas fa-%s cstyle %s"></i><span>%s</span>` $icon $color $name }} {{- $rest := index . 2 }}
{{- $parts := split $text "|" }}
{{- if eq (len $parts) 3 }}
{{- $name := trim (index $parts 0) "\n\r\t " }}
{{- $icon := trim (index $parts 1) "\n\r\t " }}
{{- $color := trim (index $parts 2) "\n\r\t " }}
{{- $classes := split $icon " " }}
{{- if eq (len $classes) 1 }}
{{- $boxStyle := partial "_relearn/boxStyle.gotmpl" (dict "style" $color) }}
{{- if $boxStyle.identifier }}
{{- $replacement = printf `<li><i class="fa-fw fas fa-%s cstyle %s"></i><span>%s</span>%s` $icon $color $name $rest }}
{{- else }} {{- else }}
{{- $replacement = printf `<li><i class="fa-fw fas fa-%s" style="color: %s;"></i><span>%s</span>` $icon $color $name }} {{- $replacement = printf `<li><i class="fa-fw fas fa-%s" style="color: %s;"></i><span>%s</span>%s` $icon $color $name $rest }}
{{- end }} {{- end }}
{{- $content = replace $content (index . 0) $replacement }}
{{- end }}
{{- $matches := findRESubmatch `<li>([^<>:]+)::([^<>:]+)::([^<>\n\r\t ]+)` $content }}
{{- range $matches }}
{{- $name := index . 1 }}
{{- $icon := index . 2 }}
{{- $color := index . 3 }}
{{- $replacement := "" }}
{{- if (where site.Params.boxStyle "identifier" $color | first 1) }}
{{- $replacement = printf `<li><i class="%s cstyle %s"></i><span>%s</span>` $icon $color $name }}
{{- else }} {{- else }}
{{- $replacement = printf `<li><i class="%s" style="color: %s;"></i><span>%s</span>` $icon $color $name }} {{- $boxStyle := partial "_relearn/boxStyle.gotmpl" (dict "style" $color) }}
{{- if $boxStyle.identifier }}
{{- $replacement = printf `<li><i class="%s cstyle %s"></i><span>%s</span>%s` $icon $color $name $rest }}
{{- else }}
{{- $replacement = printf `<li><i class="%s" style="color: %s;"></i><span>%s</span>%s` $icon $color $name $rest }}
{{- end }} {{- end }}
{{- end }}
{{- else if eq (len $parts) 2 }}
{{- $name := trim (index $parts 0) "\n\r\t " }}
{{- $icon := trim (index $parts 1) "\n\r\t " }}
{{- $classes := split $icon " " }}
{{- if eq (len $classes) 1 }}
{{- $replacement = printf `<li><i class="fa-fw fas fa-%s"></i><span>%s</span>%s` $icon $name $rest }}
{{- else }}
{{- $replacement = printf `<li><i class="%s"></i><span>%s</span>%s` $icon $name $rest }}
{{- end }}
{{- end }}
{{- if $replacement }}
{{- $content = replace $content (index . 0) $replacement }} {{- $content = replace $content (index . 0) $replacement }}
{{- end }}
{{- end }} {{- end }}
{{- $content = (replaceRE `<li>([^<>:]+)::([\w-]+)([\n\r\t ]*<)` `<li><i class="fa-fw fas fa-$2"></i><span>$1</span>$3` $content) }}
{{- $content = (replaceRE `<li>([^<>:]+)::([^<>\n\r\t]+)` `<li><i class="$2"></i><span>$1</span>` $content) }}
{{- $content | safeHTML -}} {{- $content | safeHTML -}}
</div> </div>

2
layouts/partials/version.txt
View File

@ -1 +1 @@
7.5.0+964ca24fd04abba3d8c22dd7bdc9de5a707e08fe 7.5.0+c062fd1ed2a28faac56d4693a8f6e236345f9706