FunctionalHacker/hugo-toha
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add note layout

Browse source 
Signed-off-by: hossainemruz <hossainemruz@gmail.com>
This commit is contained in:
hossainemruz 2021-03-25 00:50:15 +06:00
parent 5c95132b1e
commit beea892a20
11 changed files with 237 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

52
content/notes/search.md Normal file
View file

@ -0,0 +1,52 @@
---
title: "Search Results"
sitemap:
priority : 0.1
layout: "search"
url: search
---
This file exists solely to respond to /search URL with the related `search` layout template.
No content shown here is rendered, all content is based in the template layouts/page/search.html
Setting a very low sitemap priority will tell search engines this is not important content.
This implementation uses Fusejs, jquery and mark.js
## Initial setup
Search depends on additional output content type of JSON in config.toml
\```
[outputs]
home = ["HTML", "JSON"]
\```
## Searching additional fileds
To search additional fields defined in front matter, you must add it in 2 places.
### Edit layouts/_default/index.JSON
This exposes the values in /index.json
i.e. add `category`
\```
...
"contents":{{ .Content | plainify | jsonify }}
{{ if .Params.tags }},
"tags":{{ .Params.tags | jsonify }}{{end}},
"categories" : {{ .Params.categories | jsonify }},
...
\```
### Edit fuse.js options to Search
`static/js/search.js`
\```
keys: [
"title",
"contents",
"tags",
"categories"
]
\```

4
i18n/en.toml
View file

@ -106,3 +106,7 @@ other = "More"
[view_certificate]
other = "View Certificate"
# ============== Translations for Notes ==============
[notes]
other = "Notes"

2
layouts/_default/list.html
View file

@ -23,7 +23,7 @@
<ul class="tree" id="tree">
<li id="list-heading"><a href="{{ .Type | relLangURL }}" data-filter="all">{{ i18n .Type }}</a></li>
<div class="subtree">
{{ partial "navigators/sidebar.html" (dict "menus" site.Menus.sidebar "ctx" .) }}
{{ partial "navigators/sidebar.html" (dict "menuName" "sidebar" "menuItems" site.Menus.sidebar "ctx" .) }}
</div>
</ul>
</div>

2
layouts/_default/search.html
View file

@ -23,7 +23,7 @@
<ul class="tree" id="tree">
<li id="list-heading"><a href="{{ .Type | relLangURL }}" data-filter="all">{{ i18n .Type }}</a></li>
<div class="subtree">
{{ partial "navigators/sidebar.html" (dict "menus" site.Menus.sidebar "ctx" .) }}
{{ partial "navigators/sidebar.html" (dict "menuName" "sidebar" "menuItems" site.Menus.sidebar "ctx" .) }}
</div>
</ul>
</div>

2
layouts/_default/single.html
View file

@ -23,7 +23,7 @@
<ul class="tree" id="tree">
<li id="list-heading"><a href="{{ "/posts" | relLangURL }}" data-filter="all">{{ i18n "posts" }}</a></li>
<div class="subtree">
{{ partial "navigators/sidebar.html" (dict "menus" site.Menus.sidebar "ctx" .) }}
{{ partial "navigators/sidebar.html" (dict "menuName" "sidebar" "menuItems" site.Menus.sidebar "ctx" .) }}
</div>
</ul>
</div>

62
layouts/notes/list.html Normal file
View file

@ -0,0 +1,62 @@
{{ define "header" }}
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.18.1/styles/atom-one-dark.min.css"
/>
<link rel="stylesheet" href="{{ "/css/layouts/note.css" | relURL}}">
<link rel="stylesheet" href="{{ "/css/navigators/sidebar.css" | relURL}}">
{{ end }}
{{ define "navbar" }}
{{ partial "navigators/navbar-2.html" . }}
{{ end }}
{{ define "sidebar" }}
{{ $blogHome:="#" }}
{{ if site.IsMultiLingual }}
{{ $blogHome = (path.Join (cond ( eq .Language.Lang "en") "" .Language.Lang) .Type) }}
{{ end }}
<section class="sidebar-section" id="sidebar-section">
<div class="sidebar-holder">
<div class="sidebar" id="sidebar">
<form class="mx-auto" method="get" action="{{ "search" | absURL }}">
<input type="text" name="keyword" value="" placeholder="Search" data-search="" id="search-box" />
</form>
<div class="sidebar-tree">
<ul class="tree" id="tree">
<li id="list-heading"><a href="{{ .Type | relLangURL }}" data-filter="all">{{ i18n .Type }}</a></li>
<div class="subtree">
{{ partial "navigators/sidebar.html" (dict "menuName" "notes" "menuItems" site.Menus.notes "ctx" . ) }}
</div>
</ul>
</div>
</div>
</div>
</section>
{{ end }}
{{ define "content" }}
<section class="content-section" id="content-section">
<div class="content container-fluid" id="content">
<div class="container-fluid note-card-holder" id="note-card-holder">
{{ range .RegularPagesRecursive }}
{{ if .Layout }}
{{ else }}
{{ .Content }}
{{ end }}
{{ end }}
</div>
</div>
</section>
{{ end }}
{{ define "scripts" }}
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.18.1/highlight.min.js"></script>
<script>
hljs.initHighlightingOnLoad();
</script>
{{ if .Params.math }}
{{ partial "math.html" . }}
{{ end }}
{{ end }}

62
layouts/notes/single.html Normal file
View file

@ -0,0 +1,62 @@
{{ define "header" }}
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.18.1/styles/atom-one-dark.min.css"
/>
<link rel="stylesheet" href="{{ "/css/layouts/note.css" | relURL}}">
<link rel="stylesheet" href="{{ "/css/navigators/sidebar.css" | relURL}}">
{{ end }}
{{ define "navbar" }}
{{ partial "navigators/navbar-2.html" . }}
{{ end }}
{{ define "sidebar" }}
{{ $blogHome:="#" }}
{{ if site.IsMultiLingual }}
{{ $blogHome = (path.Join (cond ( eq .Language.Lang "en") "" .Language.Lang) .Type) }}
{{ end }}
<section class="sidebar-section" id="sidebar-section">
<div class="sidebar-holder">
<div class="sidebar" id="sidebar">
<form class="mx-auto" method="get" action="{{ "search" | absURL }}">
<input type="text" name="keyword" value="" placeholder="Search" data-search="" id="search-box" />
</form>
<div class="sidebar-tree">
<ul class="tree" id="tree">
<li id="list-heading"><a href="{{ .Type | relLangURL }}" data-filter="all">{{ i18n .Type }}</a></li>
<div class="subtree">
{{ partial "navigators/sidebar.html" (dict "menuName" "notes" "menuItems" site.Menus.notes "ctx" . ) }}
</div>
</ul>
</div>
</div>
</div>
</section>
{{ end }}
{{ define "content" }}
<section class="content-section" id="content-section">
<div class="content container-fluid" id="content">
<div class="container-fluid note-card-holder" id="note-card-holder">
{{ range .RegularPagesRecursive }}
{{ if .Layout }}
{{ else }}
{{ .Content }}
{{ end }}
{{ end }}
</div>
</div>
</section>
{{ end }}
{{ define "scripts" }}
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.18.1/highlight.min.js"></script>
<script>
hljs.initHighlightingOnLoad();
</script>
{{ if .Params.math }}
{{ partial "math.html" . }}
{{ end }}
{{ end }}

6
layouts/partials/navigators/sidebar.html
View file

@ -1,8 +1,8 @@
{{ range .menus }}
{{ range .menuItems }}
{{ $class:= "" }}
{{ $icon:= "fa-plus-circle" }}
<!-- If the current menu is the selected menu or it contain the selected menu, set expand icon and set "active" class -->
{{ if or ($.ctx.HasMenuCurrent "sidebar" .) ($.ctx.IsMenuCurrent "sidebar" .)}}
{{ if or ($.ctx.HasMenuCurrent $.menuName .) ($.ctx.IsMenuCurrent $.menuName .)}}
{{ $icon = "fa-minus-circle"}}
{{ $class = "active" }}
{{end}}
@ -12,7 +12,7 @@
<i class="fas {{ $icon }}"></i><a class="{{$class}}" href="{{ .URL }}">{{.Name}}</a>
<!-- Add sub-tree -->
<ul class="{{ $class }}">
{{ partial "navigators/sidebar.html" (dict "menus" .Children "ctx" $.ctx) }}
{{ partial "navigators/sidebar.html" (dict "menuName" $.menuName "menuItems" .Children "ctx" $.ctx) }}
</ul>
</li>
{{ else }}

7
layouts/shortcodes/note.html Normal file
View file

@ -0,0 +1,7 @@
<div class="card note-card">
<div class="card-header">{{.Get "title"}}</div>
<div class="card-body">{{ .Inner | markdownify }}</div>
{{ if .Get "footer" }}
<div class="card-footer">{{ .Get "footer" }}</div>
{{end}}
</div>

10
static/css/layouts/main.css
View file

@ -168,6 +168,16 @@ img.right {
font-size: 10pt;
}
/* ====== codeblocks ====== */
pre {
margin: 5px;
}
pre > code {
padding: 10px !important;
}
/* --- FOOTER START --- */
.footer {

34
static/css/layouts/note.css Normal file
View file

@ -0,0 +1,34 @@
.wrapper {
display: flex;
padding: 0;
margin: 0;
width: 100%;
}
.content-section {
flex: 80%;
order: 2;
/* background-color: lightseagreen; */
padding: 0;
position: relative;
padding-left: 0.5rem;
padding-right: 0.5rem;
}
.content {
padding: 0;
position: relative;
padding-top: 2rem;
min-height: 130vh;
}
.note-card-holder {
display: flex;
flex-wrap: wrap;
padding-top: 2rem;
}
.note-card {
margin: 1rem;
align-self: flex-start;
}