added toc post parameter and normal+sidebar layouts

This commit is contained in:
Gabriele Musco 2021-12-16 13:29:08 +01:00
parent b0d60e3bf5
commit d613c241be
No known key found for this signature in database
GPG Key ID: 0587A5D65B5DC99E
4 changed files with 47 additions and 9 deletions

View File

@ -117,6 +117,7 @@ summaryLength = 70 # number of words for article summaries
enableSidebarLayout = false
sidebarBackgroundColor = "#34363b"
sidebarForegroundColor = "white"
tocInSidebar = false # if the sidebar is enbabled, show the TOC in the sidebar
# redirect to baseURL if current URL host doesn't match
# useful if deploying in gitlab pages with custom domain and don't want
@ -249,8 +250,21 @@ Every post can have various parameters in the frontmatter, here are some that yo
- `comments`: boolean, if true it enables comments for the current post, if false it disables them (default is true)
- `showDate`: boolean, true by default, if false hides the date. Useful for non-article pages where the date isn't important
- `norss`: boolean, if set to true the page will be skipped in the rss feed
- `toc`: boolean, if set to true a table of contents will be shown for the article
## Generate icons
## Table of contents settings
You can tweak the TOC settings in your `config.toml`:
```toml
[markup]
[markup.tableOfContents]
endLevel = 5
ordered = false
startLevel = 1
```
# Generate icons
It's best to use the provided `generate_icons.sh` script to generate all necessary icons for your website. This script requires ImageMagick, that you will need to install separately.
@ -271,7 +285,7 @@ Finally, make sure to edit your config.toml to include the following:
# ...
```
## Inject custom content
# Inject custom content
Ficurinia supports injecting custom content into the theme. There are several files you can create in `layouts/partials/inject` that will be included inside the theme in different places.

View File

@ -137,7 +137,7 @@ table {
font-size: .9em;
}
#pageNavigation, .nerdlink, nav {
#pageNavigation, .nerdlink, nav:not(#TableOfContents) {
a {
border-bottom: none;
&:hover {
@ -482,7 +482,7 @@ ul.list {
}
}
nav, #links {
nav:not(#TableOfContents), #links {
ul {
list-style-type: none;
display: flex;
@ -507,7 +507,7 @@ header {
justify-content: space-between;
}
}
nav {
nav:not(#TableOfContents) {
font-size: .9em;
ul {
li {
@ -638,7 +638,7 @@ header {
padding: ($content_spacing / 4);
align-self: center;
}
nav {
nav:not(#TableOfContents) {
ul#main-nav {
&, li, li a {text-shadow: none !important;}
display: none;
@ -920,7 +920,7 @@ header.jumbotronContainer {
}};
header {
#sidebar_nav {
#sidebar_nav, .sidebarToc {
display: none;
}
#wide_nav {
@ -930,7 +930,7 @@ header.jumbotronContainer {
@media only screen and (min-width: 950px) {
html{{if .Site.Params.enableJumbotron}}:not(.home){{end}} {
overflow-y: hidden;
position: fixed; top: 0; bottom: 0; left: 0; right: 0;
#baseContainer {
display: flex;
flex-direction: row;
@ -957,7 +957,7 @@ header.jumbotronContainer {
display: block;
margin: 12px 0;
width: 100%;
nav {
nav:not(#TableOfContents) {
font-size: 1.1em;
ul#main-nav {
flex-direction: column;
@ -974,12 +974,26 @@ header.jumbotronContainer {
#wide_nav {
display: none;
}
.sidebarToc {
display: block;
nav#TableOfContents {
ul {
padding-left: 24px;
a:not(:hover) {
border-color: transparent;
}
}
}
}
}
#contentContainer {
flex-grow: 1;
overflow-y: auto;
}
}
.articleToc {
display: none;
}
}
}

View File

@ -11,6 +11,10 @@
{{ if .Params.Image }}
<img src="{{ .Params.Image }}" alt="" />
{{ end }}
<div class="articleToc">
{{ .TableOfContents }}
<hr />
</div>
<div>{{ .Content }}</div>
</article>
{{ if .Params.tags }}

View File

@ -42,6 +42,12 @@
<div id="sidebar_nav">
{{- partial "header_navigation.html" . -}}
</div>
{{ if and .IsPage .Params.toc }}
<div class="sidebarToc">
<hr />
{{ .TableOfContents }}
</div>
{{ end }}
{{ end }}
{{- partial "inject/header-after.html" . -}}
{{- partial "jumbotron.html" . -}}