Bootstrap all the things

This commit is contained in:
Wilfried OLLIVIER 2018-03-19 00:02:48 +01:00
commit f4b4108ffc
19 changed files with 487 additions and 0 deletions

1
.gitignore vendored Normal file
View file

@ -0,0 +1 @@
/.vscode

20
LICENSE.md Normal file
View file

@ -0,0 +1,20 @@
The MIT License (MIT)
Copyright (c) 2018 Calin Tataru and Wilfried Ollivier
Permission is hereby granted, free of charge, to any person obtaining a copy of
this software and associated documentation files (the "Software"), to deal in
the Software without restriction, including without limitation the rights to
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
the Software, and to permit persons to whom the Software is furnished to do so,
subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

76
README.md Normal file
View file

@ -0,0 +1,76 @@
# KC
Personal blog theme powered by [Hugo](https://gohugo.io).
## Inspired by Minimal
This theme is a fork of the theme "Minimal", created by Calin Tataru.
A live demo is available [here](https://themes.gohugo.io/theme/minimal/).
Full source code is [here](https://github.com/calintat/minimal)
## Installation
You can install the theme either as a clone or submodule.
I recommend the latter. From the root of your Hugo site, type the following:
```
$ git submodule add https://git.stdcall.me/kancer.club/theme.git themes/kc
$ git submodule init
$ git submodule update
```
Now you can get updates to KC in the future by updating the submodule:
```
$ git submodule update --remote themes/kc
```
## Features
You can tweak the look of the theme to suit your needs in a number of ways:
- The accent colour can be changed by using the `accent` field in `config.toml`.
- You can also change the background colour by using `backgroundColor`.
- Add colored 5px borders at the top and bottom of pages by setting `showBorder` to `true`.
For best results, I recommend you use a dark accent colour with a light background, for example:
```toml
[params]
accent = "red"
showBorder = true
backgroundColor = "white"
```
### Fonts
The theme uses [Google Fonts](https://fonts.google.com) to load its font. To change the font:
```toml
[params]
font = "Raleway" # should match the name on Google Fonts!
```
### Syntax highlighting
The theme supports syntax highlighting thanks to [highlight.js](https://highlightjs.org).
It's disabled by default, so you have to enable it by setting `highlight` to `true` in your config.
You can change the style used for the highlighting by using the `highlightStyle` field.
Only the "common" languages will be loaded by default. To load more, use `highlightLanguages`.
A list of all the available styles and languages can be found [here](https://highlightjs.org/static/demo/).
Please note the style and languages should be written in hyphen-separated lowercase, for example:
```toml
[params]
highlight = true
highlightStyle = "solarized-dark"
highlightLanguages = ["go", "haskell", "kotlin", "scala", "swift"]
```

7
archetypes/default.md Normal file
View file

@ -0,0 +1,7 @@
---
title: "{{ replace .TranslationBaseName "-" " " | title }}"
date: {{ dateFormat "2006-01-02" .Date }}
draft: true
description: ""
tags: []
---

15
layouts/404.html Normal file
View file

@ -0,0 +1,15 @@
{{ partial "header" . }}
<main>
<div class="intro">
<h1>¯\_(ツ)_/¯</h1>
<h2>Page not found</h2>
</div>
</main>
{{ partial "footer" . }}

View file

@ -0,0 +1,13 @@
{{ partial "header" . }}
<main>
<h2>{{ .Title }}</h2>
{{ range (.Paginator 5).Pages }} {{ partial "list-item" . }} {{ end }}
</main>
{{ partial "paginator" . }}
{{ partial "footer" . }}

View file

@ -0,0 +1,30 @@
{{ partial "header" . }}
<main>
{{ partial "list-item" . }}
<br> <div class="text-justify">{{ .Content }}</div>
<!-- related posts with the same tags -->
{{ $related := first 3 (where (where (where .Site.Pages.ByDate.Reverse ".Type" "==" "billets") ".Params.tags" "intersect" .Params.tags) "Permalink" "!=" .Permalink) }}
{{ if $related }}
<h4 class="page-header">Articles connexes</h4>
{{ range $related }} {{ partial "list-item" . }} {{ end }}
{{ end }}
{{ if and .Site.DisqusShortname (not .Params.disableComments) }}
<h4 class="page-header">Commentaires</h4>
{{ template "_internal/disqus.html" . }}
{{ end }}
</main>
{{ partial "footer.html" . }}

View file

@ -0,0 +1,13 @@
{{ partial "header" . }}
<main>
<h2>{{ .Title }}</h2>
{{ range (.Paginator 5).Pages }} {{ partial "list-item" . }} {{ end }}
</main>
{{ partial "paginator" . }}
{{ partial "footer" . }}

15
layouts/index.html Normal file
View file

@ -0,0 +1,15 @@
{{ partial "header" . }}
<main>
<div class="intro">
{{ with .Site.Params.profilePic }} <img src="{{ . }}"> {{ end }}
<h2>{{ markdownify .Site.Params.Description }}</h2>
</div>
</main>
{{ partial "footer" . }}

View file

@ -0,0 +1,2 @@
<!-- Intentionally left empty. Override this partial in your website to insert code just after the
opening <body> tag. For example, to install Google Analytics. -->

31
layouts/partials/css.html Normal file
View file

@ -0,0 +1,31 @@
<style>
html body {
font-family: '{{ .Site.Params.font }}', sans-serif;
background-color: {{ .Site.Params.backgroundColor | default "white" }};
}
:root {
--accent: {{ .Site.Params.accent | default "#2196F3" }};
--border-width: {{ if .Site.Params.showBorder | default false }} 5px {{ else }} 0 {{ end }};
}
</style>
<!-- main -->
<link rel="stylesheet" href="{{ "css/main.css" | absURL }}">
<!-- custom -->
{{ range .Site.Params.css }} <link rel="stylesheet" href="{{ . | absURL }}"> {{ end }}
<!-- google fonts -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family={{ .Site.Params.font }}">
<!-- highlight.js -->
{{ if .Site.Params.highlight | default false }} <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/{{ .Site.Params.highlightStyle | default "default" }}.min.css"> {{ end }}
<!-- bootstrap -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- font awesome -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">

View file

@ -0,0 +1,9 @@
<footer>
<p class="copyright text-muted">{{ .Site.Params.copyright | default "&copy; All rights reserved. Powered by [Hugo](https://gohugo.io) and [Minimal](https://github.com/calintat/minimal)" | markdownify }}</p>
</footer>
</body>
</html>

View file

@ -0,0 +1,2 @@
<!-- Intentionally left empty. Override this partial in your website to insert code just after the
opening <head> tag. For example, to install Google Tag Manager. -->

View file

@ -0,0 +1,77 @@
<!DOCTYPE html>
<html lang="{{ .Site.LanguageCode }}">
<head>
{{ partial "head-open" . }}
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ .Title }}</title>
{{ if .Site.Params.favicon }}
<link rel="icon" href="{{ .Site.Params.favicon | absURL }}">
{{ end }}
{{ partial "css" . }} {{ partial "js" . }} {{ .Hugo.Generator }}
{{ if .RSSLink }}
<link href="{{ .RSSLink }}" rel="alternate" type="application/rss+xml" title="{{ .Site.Title }}" />
<link href="{{ .RSSLink }}" rel="feed" type="application/rss+xml" title="{{ .Site.Title }}" />
{{ end }}
{{ if .Site.GoogleAnalytics }}
<!-- Global Site Tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id={{ .Site.GoogleAnalytics }}"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments)};
gtag('js', new Date());
gtag('config', '{{ .Site.GoogleAnalytics }}');
</script>
{{ end }}
</head>
{{ if .Site.Params.MathJax | default true }}
<!-- adds MathJax support -->
<script type="text/javascript" async
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
{{ end }}
<body>
{{ partial "body-open" . }}
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand visible-xs" href="#">{{ .Title }}</a>
<button class="navbar-toggle" data-target=".navbar-collapse" data-toggle="collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse">
{{ if .Site.Menus.main }}
<ul class="nav navbar-nav">
{{ range sort .Site.Menus.main }}
<li><a href="{{ .URL }}">{{ .Name }}</a></li>
{{ end }}
</ul>
{{ end }}
{{ if .Site.Menus.icon }}
<ul class="nav navbar-nav navbar-right">
{{ range sort .Site.Menus.icon }}
<li class="navbar-icon"><a href="{{ .URL }}"><i class="fa fa-{{ .Name }}"></i></a></li>
{{ end }}
</ul>
{{ end }}
</div>
</div>
</nav>

22
layouts/partials/js.html Normal file
View file

@ -0,0 +1,22 @@
<!-- highlight.js -->
{{ if .Site.Params.highlight | default false }}
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
{{ range .Site.Params.highlightLanguages }} <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/languages/{{ . }}.min.js"></script> {{ end }}
<script>hljs.initHighlightingOnLoad();</script>
{{ end }}
<!-- custom -->
{{ range .Site.Params.js }} <script src="{{ . | absURL }}"></script> {{ end }}
<!-- jquery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!-- bootstrap -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<!-- dismiss expanded navigation bar with click -->
<script>$(document).on('click', function() { $('.collapse').collapse('hide'); })</script>

View file

@ -0,0 +1,25 @@
<div class="item">
{{ $.Scratch.Set "link" .RelPermalink }}
{{ with .Params.repo }}
{{ $repoHost := default "github" $.Params.repoHost }}
{{ if eq "github" $repoHost }}
{{ printf "https://github.com/%s/%s/" $.Site.Params.githubUsername . | $.Scratch.Set "link" }}
{{ else if eq "gitlab" $repoHost }}
{{ printf "https://gitlab.com/%s/%s/" $.Site.Params.gitlabUsername . | $.Scratch.Set "link" }}
{{ else if eq "bitbucket" $repoHost }}
{{ printf "https://bitbucket.org/%s/%s/" $.Site.Params.bitbucketUsername . | $.Scratch.Set "link" }}
{{ end }}
{{ end }}
{{ with .Params.link }} {{ $.Scratch.Set "link" . }} {{ end }}
{{ with .Description }} {{ $.Scratch.Set "subtitle" . }} {{ end }}
{{ .Date.Day }} {{ index $.Site.Data.mois (printf "%d" .Date.Month) }} {{ .Date.Year }}
<h4><a href="{{ .Scratch.Get "link" }}">{{ .Title }}</a></h4>
<h5>{{ $.Scratch.Get "subtitle" }}</h5>
{{ range .Params.tags }}
<a href="{{ $.Site.BaseURL }}tags/{{ . | urlize }}"><kbd class="item-tag">{{ . }}</kbd></a>
{{ end }}
</div>

View file

@ -0,0 +1,17 @@
{{ if or .Paginator.HasPrev .Paginator.HasNext }}
<div class="pages">
{{ if .Paginator.HasPrev }}
<a class="icon pages-icon" href="{{ .Paginator.Prev.URL }}" rel="prev">
<i class="fa fa-arrow-left"></i>
</a>
{{ end }} {{ if .Paginator.HasNext }}
<a class="icon pages-icon" href="{{ .Paginator.Next.URL }}" rel="next">
<i class="fa fa-arrow-right"></i>
</a>
{{ end }}
</div>
{{ end }}

100
static/css/main.css Normal file
View file

@ -0,0 +1,100 @@
html, body {
height: 100%;
}
body {
padding-top: 55px;
display: flex;
text-align: center;
flex-direction: column;
}
main {
margin: auto;
padding: 25px;
flex: 1 0 auto;
max-width: 750px;
}
/*footer*/
.copyright {
margin: 15px 0;
}
/*home page*/
.intro {
transform: translateY(22vh);
}
.intro > h1 {
color: #212121;
font-size: 12vh;
}
.intro > h2 {
color: #757575;
font-size: 3vmin;
}
.intro > .profile {
width: 10vh;
height: 10vh;
border-radius: 50%;
}
/*apply accent colour to links*/
a:link, a:visited {
color: var(--accent);
}
a.icon:hover {
text-decoration: none;
}
a:hover {
color: var(--accent) !important;
}
/*paginator at bottom of list view*/
.pages {
padding: 15px 0;
}
.pages-icon {
padding: 0 15px;
}
/*list item for posts and projects*/
.item {
padding: 10px 0;
}
.item-tag {
background-color: var(--accent);
}
/*navigation bar icons*/
.navbar-icon {
font-size: 125%;
display: inline-block !important;
}
/*coloured borders at top and bottom of the page*/
.navbar.navbar-default {
border-top: var(--border-width) solid var(--accent);
}
footer {
border-bottom: var(--border-width) solid var(--accent);
}
img {
max-width: 100%;
}

12
theme.toml Normal file
View file

@ -0,0 +1,12 @@
name = "KC"
license = "MIT"
licenselink = "https://git.stdcall.me/kancer.club/theme/src/branch/master/LICENSE.md"
description = "Personal blog theme powered by Hugo"
homepage = "https://git.stdcall.me/kancer.club/theme"
tags = ["blog", "minimal", "personal", "responsive"]
features = ["responsive"]
min_version = "0.24.1"
[author]
name = "Wilfried OLLIVIER"
homepage = "https://papey.fr"