vbatts/hugo-theme-hyde-hyde
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Restructures the templates

Browse source
This commit is contained in:
Huy Tran 2018-07-10 11:41:30 +10:00
parent 6b929ff8e0
commit f4aa888a5c
14 changed files with 108 additions and 128 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
README.md
View file

@ -3,14 +3,14 @@
__`hyde-hyde`__ is a [Hugo](https://gohugo.io)'s theme derived from @spf13's [Hyde](https://github.com/spf13/hyde.git) which is in turn ported from @mdo Jekyll's [Hyde](https://github.com/poole/hyde).
## Notable Changes
* Color tones and layouts are inspired by [Nate Finch's blog](https://npf.io)
* Restructuring/modularising the layouts (see [`layouts/_default/baseof.html`](https://github.com/htr3n/hyde-hyde/blob/master/layouts/_default/baseof.html), [`layouts/_default/single.html`](https://github.com/htr3n/hyde-hyde/blob/master/layouts/_default/single.html), [`layouts/_default/list.html`](https://github.com/htr3n/hyde-hyde/blob/master/layouts/_default/list.html) and [`layouts/partials`](https://github.com/htr3n/hyde-hyde/blob/master/layouts/partials/))
* Using [highlight.js](https://highlightjs.org) for highlighting code
* Using [Font-Awesome 5](https://fontawesome.com) for icons
* Using color tones inspired by [Nate Finch's blog](https://npf.io)
* Using [highlight.js](https://highlightjs.org) for code highlighting
* Using [Font-Awesome 5](https://fontawesome.com)'s icons
* Using main font [Fira-Sans](https://fonts.google.com/specimen/Fira+Sans) + fixed width font [Roboto Mono](https://fonts.google.com/specimen/Roboto+Mono)
* Adding [GraphComment](https://graphcomment.com) for replacing the built-in [Disqus](https://disqus.com)
A real site in action can be found [here](https://htr3n.github.io).
A real site in action can be found [here](https://htr3n.github.io) with its [WIP source](https://github.com/htr3n/htr3n-blog) for reference.
Some screenshots:

14
layouts/_default/baseof.html
View file

@ -1,16 +1,14 @@
<!DOCTYPE html>
<html lang="{{ .Site.LanguageCode }}">
{{ block "header" . -}}{{- end }}
<body class="{{- if .Site.Params.themeColor }}{{ .Site.Params.themeColor }}{{ end }} {{if .Site.Params.layoutReverse}}layout-reverse{{end}}">
{{ partial "sidebar.html" . }}
<body {{- if .Site.Params.themeColor }}class="{{ .Site.Params.themeColor }} {{if .Site.Params.layoutReverse}}layout-reverse{{ end }}"{{end}}>
{{ partial "sidebar.html" . -}}
<div class="content container">
{{ block "content" . }}{{ end }}
<div class="footer">
{{ block "footer" . }}{{ end }}
</div>
{{ block "content" . -}}{{- end }}
</div>
<!-- Google Analytics -->
{{ if .Site.GoogleAnalytics -}}
{{ block "footer" . -}}{{- end }}
{{ if and (not .Site.BuildDrafts) (.Site.GoogleAnalytics) -}}
{{ "<!-- Google Analytics -->" | safeHTML }}
{{ template "_internal/google_analytics_async.html" . }}
{{- end }}
</body>

6
layouts/_default/single.html
View file

@ -7,6 +7,8 @@
{{- end -}}
{{ define "footer" -}}
{{ partial "highlight.html" . }}
{{ partial "commenting.html" . }}
<div class="footer content">
{{- partial "highlight.html" . -}}
{{- partial "commenting.html" . -}}
</div>
{{- end -}}

14
layouts/index.html
View file

@ -4,22 +4,22 @@
{{ define "content" -}}
<div class="posts">
{{ range (where .Data.Pages "Type" "!=" "about").GroupBy "Section" }}
{{ range (where .Data.Pages "Type" "not in" (slice "about" "portfolio")).GroupBy "Section" -}}
{{ range .Pages }}
<div class="post">
<h1 class="post-title"><a href="{{ .Permalink }}">{{ .Title }}</a>{{ if .Draft }}<sup><i class="fas fa-pen-square fa-xs"></i></sup>{{ end }}</h1>
<h1 class="post-title"><a href="{{ .RelPermalink }}">{{ .Title }}</a>{{ if .Draft }}<sup> <i class="fas fa-pen-square fa-xs"></i></sup>{{ end }}</h1>
<span class="post-date">
{{- .Date.Format (.Site.Params.dateformat | default "Jan 02, 2006") -}}
</span>
{{ .Summary }}
{{ if .Truncated }}
{{ .Summary }}
{{- if .Truncated }}
<div class="read-more-link">
<a href="{{ .RelPermalink }}">Read More…</a>
</div>
{{ end }}
{{- end }}
</div>
{{- end -}}
{{- end }}
{{- end -}}
{{- end }}
</div>
{{- end }}

17
layouts/partials/commenting.html
View file

@ -1,14 +1,11 @@
<!-- Disqus-->
{{ if .Site.DisqusShortname -}}
{{ if ne .Params.showcomments false }}
{{- if and (not .Site.BuildDrafts) (ne .Params.showcomments false) -}}
{{ if .Site.DisqusShortname -}}
<hr>
<h2>Comments</h2>
{{ partial "commenting_disqus.html" . }}
{{ end }}
{{ else if .Site.Params.GraphCommentId -}}
{{ if ne .Params.showcomments false }}
{{- partial "commenting/disqus.html" . -}}
{{- else if .Site.Params.GraphCommentId -}}
<hr>
<h2>Comments</h2>
{{ partial "commenting_graph.html" . }}
{{ end }}
{{- end }}
{{- partial "commenting/graphcomment.html" . -}}
{{- end -}}
{{- end }}

0
layouts/partials/commenting_disqus.html → layouts/partials/commenting/disqus.html
View file

0
layouts/partials/commenting_graph.html → layouts/partials/commenting/graphcomment.html
View file

4
layouts/partials/content_list.html
View file

@ -1,9 +1,9 @@
<h1 class="title">{{ .Title }}</h1>
<ul class="posts">
{{ range .Data.Pages -}}
{{- range .Data.Pages -}}
<li>
<span>
<a href="{{ .Permalink }}">{{ .Title }}</a>
<a href="{{ .RelPermalink }}">{{ .Title }}</a>
{{ if not .Date.IsZero }}
<time class="pull-right post-list">
{{- .Date.Format (.Site.Params.dateformat | default "Jan 02, 2006") -}}

4
layouts/partials/highlight.html
View file

@ -1,7 +1,7 @@
{{ if .Site.Params.highlightjs -}}
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
{{ range .Site.Params.highlightjslanguages }}
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/languages/{{.}}.min.js"></script>
{{ with .Site.Params.highlightjslanguages }}
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/languages/{{.}}.min.js"></script>
{{ end }}
<script type="text/javascript">
hljs.configure({languages: []});

7
layouts/partials/sidebar.html
View file

@ -1,15 +1,16 @@
{{ "<!-- Sidebar -->" | safeHTML }}
<div class="sidebar">
<div class="container text-center {{ if .Site.Params.sidebarSticky }}sidebar-sticky{{ end }}">
<div class="sidebar-about text-center">
<a href="{{ .Site.BaseURL }}"><h1 class="brand">{{ .Site.Title }}</h1></a>
{{ with .Site.Params.authorimage }} <img src="{{.}}" alt="Author Image" class="img-circle headshot center"> {{ end }}
{{ with .Site.Params.authorimage }} <img src="/{{.}}" alt="Author Image" class="img-circle headshot center"> {{ end }}
<p class="lead">
{{ with .Site.Params.description }} {{.}} {{ else }} Your site's description {{end}}
</p>
</div>
{{ partial "sidebar_menu.html" . }}
{{ partial "sidebar/menu.html" . }}
<p>
{{ partial "sidebar_social.html" . }}
{{ partial "sidebar/social.html" . }}
</p>
<p class="copyright">{{ with .Site.Params.copyright }}{{.|safeHTML}}{{ else }}&copy; {{ now.Format "2006"}} {{.Site.Params.author}}.
<a href="https://creativecommons.org/licenses/by/4.0">Some Rights Reserved</a>.<br/>Built with <a href="https://gohugo.io/">Hugo</a> &amp; <a href="https://github.com/htr3n/hyde-hyde">hyde-hyde</a>.{{end}}

7
layouts/partials/sidebar_menu.html → layouts/partials/sidebar/menu.html
View file

@ -1,19 +1,18 @@
<!-- sidebar start -->
<div>
<ul class="sidebar-nav">
{{ $currentPage := . }}
{{ range .Site.Menus.main -}}
{{- range .Site.Menus.main -}}
{{ if .HasChildren -}}
<li class="{{ if $currentPage.HasMenuCurrent "main" . }}active{{ end }}">
<a href="#">{{ .Pre }}<span>{{ .Name }}</span></a>
<ul class="sidebar-nav">
{{ range .Children -}}
{{- range .Children -}}
<li class="{{ if $currentPage.IsMenuCurrent "main" . }}active{{ end }}">
<a href="{{ .URL }}">{{ .Name | title }}</a>
</li>
{{- end -}}
</ul>
{{- else -}} <!-- No Children-->
{{- else -}}
<li>
<a href="{{.URL}}">{{ .Pre }} <span>{{ .Name | title }}</span></a>
</li>

46
layouts/partials/sidebar_social.html → layouts/partials/sidebar/social.html
View file

@ -1,38 +1,38 @@
<section class="row text-center">
{{ with .Site.Params.social.twitter }}
{{ with .Site.Params.social.twitter -}}
<a href="https://twitter.com/{{.}}"><i class="fab fa-twitter fa-lg" aria-hidden="true"></i></a>
{{ end }}
{{ with .Site.Params.social.facebook }}
{{- end }}
{{ with .Site.Params.social.facebook -}}
&nbsp;<a href="https://facebook.com/{{.}}"><i class="fab fa-facebook-f"></i></a>
{{ end }}
{{ with .Site.Params.social.github }}
{{- end }}
{{ with .Site.Params.social.github -}}
&nbsp;<a href="https://github.com/{{.}}"><i class="fab fa-github fa-lg" aria-hidden="true"></i></a>
{{ end }}
{{ with .Site.Params.social.bitbucket }}
{{- end }}
{{ with .Site.Params.social.bitbucket -}}
&nbsp;<a href="https://bitbucket.org/{{.}}"><i class="fab fa-bitbucket fa-lg" aria-hidden="true"></i></a>
{{ end }}
{{ with .Site.Params.social.gitlab }}
{{- end }}
{{ with .Site.Params.social.gitlab -}}
&nbsp;<a href="https://gitlab.com/{{.}}"><i class="fab fa-gitlab fa-lg" aria-hidden="true"></i></a>
{{ end }}
{{ with .Site.Params.social.instagram }}
{{- end }}
{{ with .Site.Params.social.instagram -}}
&nbsp;<a href="https://instagram.com/{{.}}"><i class="fab fa-instagram fa-lg" aria-hidden="true"></i></a>
{{ end }}
{{ with .Site.Params.social.linkedin }}
{{- end }}
{{ with .Site.Params.social.linkedin -}}
&nbsp;<a href="https://linkedin.com/in/{{.}}"><i class="fab fa-linkedin fa-lg" aria-hidden="true"></i></a>
{{ end }}
{{ with .Site.Params.social.stackoverflow }}
{{- end }}
{{ with .Site.Params.social.stackoverflow -}}
&nbsp;<a href="https://stackoverflow.com/users/{{.}}"><i class="fab fa-stack-overflow fa-lg" aria-hidden="true"></i></a>
{{ end }}
{{- end }}
{{ with .Site.Params.social.medium}}
&nbsp;<a href="https://medium.com/{{.}}"><i class="fab fa-medium fa-lg" aria-hidden="true"></i></a>
{{ end }}
{{ with .Site.Params.social.xing }}
{{- end }}
{{ with .Site.Params.social.xing -}}
&nbsp;<a href="https://www.xing.com/profile/{{.}}"><i class="fab fa-xing fa-lg" aria-hidden="true"></i></a>
{{ end }}
{{ with .Site.Params.social.keybase }}
{{- end }}
{{ with .Site.Params.social.keybase -}}
&nbsp;<a href="https://keybase.io/{{.}}"><i class="fab fa-keybase fa-lg" aria-hidden="true"></i></a>
{{ end }}
{{ with .Site.Params.social.email }}
{{- end }}
{{ with .Site.Params.social.email -}}
&nbsp;<a href="mailto:{{.}}"><i class="fas fa-at fa-lg" aria-hidden="true"></i></a>
{{ end }}
{{- end }}
</section>

108
static/css/syntax.css
View file

@ -1,67 +1,49 @@
/* Background */ .chroma { background-color: #f0f0f0 }
/* Error */ .chroma .err { }
/* Background */ .chroma { color: #e5e5e5; background-color: #000000 }
/* Error */ .chroma .err { color: #ff0000 }
/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: 100%; overflow: auto; display: block; }
/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; }
/* LineHighlight */ .chroma .hl { display: block; width: 100%;background-color: #ffffcc }
/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em; display: block; }
/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em; }
/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em; }
/* Keyword */ .chroma .k { color: #007020; font-weight: bold }
/* KeywordConstant */ .chroma .kc { color: #007020; font-weight: bold }
/* KeywordDeclaration */ .chroma .kd { color: #007020; font-weight: bold }
/* KeywordNamespace */ .chroma .kn { color: #007020; font-weight: bold }
/* KeywordPseudo */ .chroma .kp { color: #007020 }
/* KeywordReserved */ .chroma .kr { color: #007020; font-weight: bold }
/* KeywordType */ .chroma .kt { color: #902000 }
/* NameAttribute */ .chroma .na { color: #4070a0 }
/* NameBuiltin */ .chroma .nb { color: #007020 }
/* NameClass */ .chroma .nc { color: #0e84b5; font-weight: bold }
/* NameConstant */ .chroma .no { color: #60add5 }
/* NameDecorator */ .chroma .nd { color: #555555; font-weight: bold }
/* NameEntity */ .chroma .ni { color: #d55537; font-weight: bold }
/* NameException */ .chroma .ne { color: #007020 }
/* NameFunction */ .chroma .nf { color: #06287e }
/* NameLabel */ .chroma .nl { color: #002070; font-weight: bold }
/* NameNamespace */ .chroma .nn { color: #0e84b5; font-weight: bold }
/* NameTag */ .chroma .nt { color: #062873; font-weight: bold }
/* NameVariable */ .chroma .nv { color: #bb60d5 }
/* LiteralString */ .chroma .s { color: #4070a0 }
/* LiteralStringAffix */ .chroma .sa { color: #4070a0 }
/* LiteralStringBacktick */ .chroma .sb { color: #4070a0 }
/* LiteralStringChar */ .chroma .sc { color: #4070a0 }
/* LiteralStringDelimiter */ .chroma .dl { color: #4070a0 }
/* LiteralStringDoc */ .chroma .sd { color: #4070a0; font-style: italic }
/* LiteralStringDouble */ .chroma .s2 { color: #4070a0 }
/* LiteralStringEscape */ .chroma .se { color: #4070a0; font-weight: bold }
/* LiteralStringHeredoc */ .chroma .sh { color: #4070a0 }
/* LiteralStringInterpol */ .chroma .si { color: #70a0d0; font-style: italic }
/* LiteralStringOther */ .chroma .sx { color: #c65d09 }
/* LiteralStringRegex */ .chroma .sr { color: #235388 }
/* LiteralStringSingle */ .chroma .s1 { color: #4070a0 }
/* LiteralStringSymbol */ .chroma .ss { color: #517918 }
/* LiteralNumber */ .chroma .m { color: #40a070 }
/* LiteralNumberBin */ .chroma .mb { color: #40a070 }
/* LiteralNumberFloat */ .chroma .mf { color: #40a070 }
/* LiteralNumberHex */ .chroma .mh { color: #40a070 }
/* LiteralNumberInteger */ .chroma .mi { color: #40a070 }
/* LiteralNumberIntegerLong */ .chroma .il { color: #40a070 }
/* LiteralNumberOct */ .chroma .mo { color: #40a070 }
/* Operator */ .chroma .o { color: #666666 }
/* OperatorWord */ .chroma .ow { color: #007020; font-weight: bold }
/* Comment */ .chroma .c { color: #60a0b0; font-style: italic }
/* CommentHashbang */ .chroma .ch { color: #60a0b0; font-style: italic }
/* CommentMultiline */ .chroma .cm { color: #60a0b0; font-style: italic }
/* CommentSingle */ .chroma .c1 { color: #60a0b0; font-style: italic }
/* CommentSpecial */ .chroma .cs { color: #60a0b0; background-color: #fff0f0 }
/* CommentPreproc */ .chroma .cp { color: #007020 }
/* CommentPreprocFile */ .chroma .cpf { color: #007020 }
/* GenericDeleted */ .chroma .gd { color: #a00000 }
/* GenericEmph */ .chroma .ge { font-style: italic }
/* GenericError */ .chroma .gr { color: #ff0000 }
/* GenericHeading */ .chroma .gh { color: #000080; font-weight: bold }
/* GenericInserted */ .chroma .gi { color: #00a000 }
/* GenericOutput */ .chroma .go { color: #888888 }
/* GenericPrompt */ .chroma .gp { color: #c65d09; font-weight: bold }
/* Keyword */ .chroma .k { color: #ffffff; font-weight: bold }
/* KeywordConstant */ .chroma .kc { color: #ffffff; font-weight: bold }
/* KeywordDeclaration */ .chroma .kd { color: #ffffff; font-weight: bold }
/* KeywordNamespace */ .chroma .kn { color: #ffffff; font-weight: bold }
/* KeywordPseudo */ .chroma .kp { color: #ffffff; font-weight: bold }
/* KeywordReserved */ .chroma .kr { color: #ffffff; font-weight: bold }
/* KeywordType */ .chroma .kt { color: #ffffff; font-weight: bold }
/* NameAttribute */ .chroma .na { color: #007f7f }
/* NameBuiltin */ .chroma .nb { color: #ffffff; font-weight: bold }
/* NameTag */ .chroma .nt { font-weight: bold }
/* LiteralDate */ .chroma .ld { color: #ffff00; font-weight: bold }
/* LiteralString */ .chroma .s { color: #00ffff; font-weight: bold }
/* LiteralStringAffix */ .chroma .sa { color: #00ffff; font-weight: bold }
/* LiteralStringBacktick */ .chroma .sb { color: #00ffff; font-weight: bold }
/* LiteralStringChar */ .chroma .sc { color: #00ffff; font-weight: bold }
/* LiteralStringDelimiter */ .chroma .dl { color: #00ffff; font-weight: bold }
/* LiteralStringDoc */ .chroma .sd { color: #00ffff; font-weight: bold }
/* LiteralStringDouble */ .chroma .s2 { color: #00ffff; font-weight: bold }
/* LiteralStringEscape */ .chroma .se { color: #00ffff; font-weight: bold }
/* LiteralStringHeredoc */ .chroma .sh { color: #00ffff; font-weight: bold }
/* LiteralStringInterpol */ .chroma .si { color: #00ffff; font-weight: bold }
/* LiteralStringOther */ .chroma .sx { color: #00ffff; font-weight: bold }
/* LiteralStringRegex */ .chroma .sr { color: #00ffff; font-weight: bold }
/* LiteralStringSingle */ .chroma .s1 { color: #00ffff; font-weight: bold }
/* LiteralStringSymbol */ .chroma .ss { color: #00ffff; font-weight: bold }
/* LiteralNumber */ .chroma .m { color: #ffff00; font-weight: bold }
/* LiteralNumberBin */ .chroma .mb { color: #ffff00; font-weight: bold }
/* LiteralNumberFloat */ .chroma .mf { color: #ffff00; font-weight: bold }
/* LiteralNumberHex */ .chroma .mh { color: #ffff00; font-weight: bold }
/* LiteralNumberInteger */ .chroma .mi { color: #ffff00; font-weight: bold }
/* LiteralNumberIntegerLong */ .chroma .il { color: #ffff00; font-weight: bold }
/* LiteralNumberOct */ .chroma .mo { color: #ffff00; font-weight: bold }
/* Comment */ .chroma .c { color: #007f7f }
/* CommentHashbang */ .chroma .ch { color: #007f7f }
/* CommentMultiline */ .chroma .cm { color: #007f7f }
/* CommentSingle */ .chroma .c1 { color: #007f7f }
/* CommentSpecial */ .chroma .cs { color: #007f7f }
/* CommentPreproc */ .chroma .cp { color: #00ff00; font-weight: bold }
/* CommentPreprocFile */ .chroma .cpf { color: #00ff00; font-weight: bold }
/* GenericHeading */ .chroma .gh { font-weight: bold }
/* GenericStrong */ .chroma .gs { font-weight: bold }
/* GenericSubheading */ .chroma .gu { color: #800080; font-weight: bold }
/* GenericTraceback */ .chroma .gt { color: #0044dd }
/* TextWhitespace */ .chroma .w { color: #bbbbbb }
/* GenericSubheading */ .chroma .gu { font-weight: bold }

1
static/css/syntax.min.css vendored Normal file
View file

@ -0,0 +1 @@
.chroma{background-color:#000;color:#e5e5e5}.chroma .err{color:red}.chroma .lntd{border:0;margin:0;padding:0;vertical-align:top}.chroma .lntable{border:0;border-spacing:0;display:block;margin:0;overflow:auto;padding:0;width:auto}.chroma .hl{background-color:#ffc;display:block;width:100%}.chroma .ln,.chroma .lnt{margin-right:.4em;padding:0 .4em}.chroma .k,.chroma .kc,.chroma .kd,.chroma .kn,.chroma .kp,.chroma .kr,.chroma .kt{color:#fff;font-weight:700}.chroma .na{color:#007f7f}.chroma .nb{color:#fff}.chroma .ld,.chroma .nb,.chroma .nt{font-weight:700}.chroma .ld{color:#ff0}.chroma .dl,.chroma .s,.chroma .s1,.chroma .s2,.chroma .sa,.chroma .sb,.chroma .sc,.chroma .sd,.chroma .se,.chroma .sh,.chroma .si,.chroma .sr,.chroma .ss,.chroma .sx{color:#0ff;font-weight:700}.chroma .il,.chroma .m,.chroma .mb,.chroma .mf,.chroma .mh,.chroma .mi,.chroma .mo{color:#ff0;font-weight:700}.chroma .c,.chroma .c1,.chroma .ch,.chroma .cm,.chroma .cs{color:#007f7f}.chroma .cp,.chroma .cpf{color:#0f0;font-weight:700}.chroma .gh,.chroma .gs,.chroma .gu{font-weight:700}