216 lines
8.7 KiB
HTML
216 lines
8.7 KiB
HTML
{{ define "head" }}
|
|
<meta name="description" content="{{ .Params.description }}">
|
|
<!-- <link rel="stylesheet" href="{{.Site.Params.staticPath}}/css/single.css"> -->
|
|
<meta property="og:image" content="{{ .Params.image }}"/>
|
|
<!-- fontawesome -->
|
|
<!-- <script defer src="{{.Site.Params.staticPath}}/fontawesome-6/all-6.4.2.js"></script> -->
|
|
{{ end }}
|
|
|
|
{{ define "title" }}
|
|
{{.Title }}
|
|
{{ end }}
|
|
|
|
{{ define "main" }}
|
|
<section id="single">
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-sm-12 col-md-12 col-lg-9">
|
|
<div class="pr-lg-4">
|
|
<div class="title mb-5">
|
|
<h1 class="text-center mb-4">{{ .Title }}</h1>
|
|
<div class="text-center">
|
|
{{ .Params.author }}
|
|
<small>|</small>
|
|
{{ .Date.Format (.Site.Params.datesFormat.article | default "Jan 2, 2006") }}
|
|
|
|
{{ if or (.Site.Params.singlePages.readTime.enable | default true) (.Params.enableReadingTime) }}
|
|
<span id="readingTime">
|
|
{{ .Site.Params.singlePages.readTime.content | default " min read" }}
|
|
</span>
|
|
{{ end }}
|
|
</div>
|
|
<div class="text-center">
|
|
{{ if .Params.explicitLastMod }}
|
|
<p>{{ .Site.Params.editedOnText }}: {{ .Params.explicitLastMod | time.Format "January 2, 2006" }}</p>
|
|
{{ end }}
|
|
</div>
|
|
</div>
|
|
{{ if .Params.image }}
|
|
<div class="featured-image">
|
|
{{ $img := .Resources.GetMatch .Params.image }}
|
|
<!-- <img src="{{ $img }}" class="card-img-top" alt="{{ .Title }}" fetchpriority="high"> -->
|
|
{{ partial "lazyimg" (dict "img" $img "class" "img-fluid mx-auto d-block" "alt" .Title) }}
|
|
</div>
|
|
{{ end }}
|
|
<article class="page-content p-2">
|
|
{{ .Content | emojify }}
|
|
<hr>
|
|
<div id="load_comments" style="text-align:center; display:block;">
|
|
<button onclick="toggleComments()">
|
|
{{ partial "icon" (dict "icon" "comments" "class" "fa-solid fa-comments") }}
|
|
View Comments</button>
|
|
</div>
|
|
<h2 id="comments_header" style="display:none;">Comments</h2>
|
|
<div id="cusdis_thread"
|
|
data-host="https://cusdis.com"
|
|
data-app-id="fdd898fc-afd5-4280-9cb3-6dd7a1a05e17"
|
|
data-page-id="{{ .Permalink }}"
|
|
data-page-url="{{ .Permalink }}"
|
|
data-page-title="{{ .Params.Title }}"
|
|
data-theme="dark"
|
|
style="min-height:50vh;
|
|
display: none;
|
|
resize: vertical;
|
|
overflow: auto;"
|
|
></div>
|
|
<div id="hide_comments" style="text-align:center; display:none;">
|
|
<br>
|
|
<button onclick="toggleComments()">
|
|
{{ partial "icon" (dict "icon" "comments" "class" "fa-solid fa-comments") }}
|
|
Hide Comments
|
|
</button>
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-12 col-md-12 col-lg-3">
|
|
<div id="stickySideBar" class="sticky-sidebar">
|
|
{{ if .Params.toc | default true}}
|
|
<aside class="toc">
|
|
<h5>
|
|
{{ .Site.Params.terms.toc | default "Table Of Contents" }}
|
|
</h5>
|
|
<div class="toc-content">
|
|
{{.TableOfContents}}
|
|
</div>
|
|
</aside>
|
|
{{ end }}
|
|
|
|
{{ if .Params.tags }}
|
|
<aside class="tags">
|
|
<h5>{{ .Site.Params.terms.tags | default "Tags" }}</h5>
|
|
<ul class="tags-ul list-unstyled list-inline">
|
|
{{range .Params.tags}}
|
|
<li class="list-inline-item">
|
|
<a href="{{ (printf "tags/%s" . | urlize | relLangURL) }}" target="_blank">{{ . }}</a>
|
|
</li>
|
|
{{end}}
|
|
</ul>
|
|
</aside>
|
|
{{end}}
|
|
|
|
{{ if .Params.socialShare | default true }}
|
|
<aside class="social">
|
|
<h5>{{ .Site.Params.terms.social | default "Social" }}</h5>
|
|
<div class="social-content">
|
|
<ul class="list-inline">
|
|
<li class="list-inline-item text-center">
|
|
<a target="_blank" href="https://twitter.com/share?text={{ .Title }}&url={{ .Site.Params.hostName }}{{ .Permalink | absURL }}">
|
|
{{ partial "icon" (dict "icon" "twitter" "class" "fab fa-twitter") }}
|
|
</a>
|
|
</li>
|
|
<li class="list-inline-item text-center">
|
|
<a target="_blank" href="https://api.whatsapp.com/send?text={{ .Title }}: {{ .Site.Params.hostName }}{{ .Permalink | absURL }}">
|
|
{{ partial "icon" (dict "icon" "whatsapp" "class" "fab fa-whatsapp") }}
|
|
</a>
|
|
</li>
|
|
<li class="list-inline-item text-center">
|
|
<a target="_blank" href='mailto:?subject={{ .Title }}&body={{ .Site.Params.terms.emailText | default "Check out this site" }} {{ .Site.Params.hostName }}{{ .Permalink | absURL }}'>
|
|
{{ partial "icon" (dict "icon" "envelope" "class" "fa fa-envelope") }}
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</aside>
|
|
{{ end }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<button class="p-2 px-3" onclick="topFunction()" id="topScroll">
|
|
{{ partial "icon" (dict "icon" "angle-up" "class" "fas fa-angle-up") }}
|
|
</button>
|
|
</section>
|
|
|
|
{{ if or (.Site.Params.singlePages.scrollprogress.enable | default true) (.Params.enableScrollProgress) }}
|
|
<div class="progress">
|
|
<div id="scroll-progress-bar" class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
|
|
<!-- <Script src="{{.Site.Params.staticPath}}/js/scrollProgressBar.js"></script> -->
|
|
{{ end }}
|
|
|
|
<script>
|
|
var topScroll = document.getElementById("topScroll");
|
|
window.onscroll = function() {scrollFunction()};
|
|
|
|
function scrollFunction() {
|
|
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
|
|
topScroll.style.display = "block";
|
|
} else {
|
|
topScroll.style.display = "none";
|
|
}
|
|
}
|
|
|
|
function topFunction() {
|
|
document.body.scrollTop = 0;
|
|
document.documentElement.scrollTop = 0;
|
|
}
|
|
|
|
// To set height of sticky sidebar dynamically
|
|
let stickySideBarElem = document.getElementById("stickySideBar");
|
|
let stickyNavBar = "{{ .Site.Params.navbar.stickyNavBar.enable | default false }}";
|
|
if(stickyNavBar) {
|
|
let headerElem = document.getElementById("profileHeader");
|
|
let headerHeight = headerElem.offsetHeight + 15;
|
|
stickySideBarElem.style.top = headerHeight + "px";
|
|
} else {
|
|
stickySideBarElem.style.top = "50px";
|
|
}
|
|
</script>
|
|
|
|
<script>
|
|
function toggleComments() {
|
|
var cusdisThread = document.getElementById('cusdis_thread');
|
|
cusdisThread.style.display = cusdisThread.style.display === 'flex'? 'none' : 'flex';
|
|
|
|
var loadComments = document.getElementById('load_comments');
|
|
loadComments.style.display = loadComments.style.display === 'block' ? 'none' : 'block';
|
|
|
|
var commentsHeader = document.getElementById('comments_header');
|
|
commentsHeader.style.display = commentsHeader.style.display === 'block' ? 'none' : 'block';
|
|
|
|
var hideComments = document.getElementById('hide_comments');
|
|
hideComments.style.display = hideComments.style.display === 'block' ? 'none' : 'block';
|
|
|
|
var script = document.getElementById('cusdis_script');
|
|
if(script === null)
|
|
{
|
|
var script = document.createElement('script');
|
|
script.src = 'https://cusdis.com/js/cusdis.es.js';
|
|
script.async = false;
|
|
script.defer = false;
|
|
script.id = 'cusdis_script';
|
|
document.body.appendChild(script);
|
|
}
|
|
}
|
|
</script>
|
|
|
|
{{ if .Site.Params.kofi.enable | default true }}
|
|
<script src='https://storage.ko-fi.com/cdn/scripts/overlay-widget.js'></script>
|
|
<script>
|
|
kofiWidgetOverlay.draw('{{ .Site.Params.kofi.handle | default "kovasky" }}', {
|
|
'type': 'floating-chat',
|
|
'floating-chat.donateButton.text': '{{ .Site.Params.kofi.buttonText | default "Support me" }}',
|
|
'floating-chat.donateButton.background-color': '#f45d22',
|
|
'floating-chat.donateButton.text-color': '#fff'
|
|
});
|
|
</script>
|
|
{{ end }}
|
|
|
|
<!-- {{ if or (.Site.Params.singlePages.readTime.enable | default true) (.Params.enableReadingTime) }}
|
|
<script src="{{.Site.Params.staticPath}}/js/readingTime.js"></script>
|
|
{{end}} -->
|
|
|
|
{{ end }}
|