Release v0.8.0

CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+> v0.8.0
+
+- Add a licensing page and a copyright in the footer if wanted (thx to [Hjdskes](https://github.com/Hjdskes))
+- Fix footnotes
+- Other small fixes
+
 > v0.7.0
 
 - Speed up a bit the theme

exampleSite/config.toml

@@ -18,14 +18,14 @@ blog = "blog/:slug/"
 dateform = "Jan 2, 2006"
 dateformfull = "Mon Jan 2 2006 15:04:05 MST"
 description = "Example blog"
+copyright = "Copyright © 2015 Nishanth Shanmugham"
 logofile = "img/logo.png"
 faviconfile = "img/logo.png"
 highlightjs = true
 progressively = true
 latestpostcount = 5
-lang = "en"
 github = "example"
 email = "you@example.com"
 linkedin = "john-example-aa80ue8è"
 twitter = "example"
-social_banner = "img/banner.png"
+social_banner = "img/banner.png"

exampleSite/content/blog/example-of-an-article.md

@@ -13,7 +13,7 @@ best: true
 
 **This theme includes a tranparent way to defer images. This can be enabled/disabled in the `config.toml`.**
 
-![image](./img/startup.jpg)
+![image](/img/startup.jpg)
 
 **You will just have to do two images : the normal, and a low resolution one.**
 

exampleSite/content/license.md

@@ -0,0 +1,28 @@
++++
+title= "License"
++++
+
+You can use this page to put a license on the contents of your blog, like so:
+
+> The MIT License (MIT)
+>
+> Copyright (c) 2015 Nishanth Shanmugham<nishanth.gerrard@gmail.com>
+>
+> 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.
+

layouts/index.html

@@ -27,7 +27,7 @@
             {{ end }}
             </div>
 
-            <div class="posts">
+            <div class="best-posts">
             {{ $nbPosts := len (where .Data.Pages "Params.best" true) }}
             {{ if gt $nbPosts 0 }}
                 <div class="page-heading">Best posts</div>

layouts/partials/footer.html

@@ -1,3 +1,48 @@
+<section class="footer">
+    <div class="container">
+        <div class="copyright">
+
+        {{ if .Site.Params.copyright }}
+            <a href="{{ .Site.BaseURL }}license">{{ .Site.Params.copyright}}</a>
+        {{ end }}
+
+        </div>
+        <div class="icons">
+
+        {{ if .Site.Params.github }}
+            <a href="https://github.com/{{ .Site.Params.github }}" target="_blank">
+                <i class="icon ion-social-github" title="github"></i>
+            </a>
+        {{ end }}
+
+        {{ if .Site.Params.twitter }}
+            <a href="https://twitter.com/{{ .Site.Params.twitter }}" target="_blank">
+                <i class="icon ion-social-twitter" title="twitter"></i>
+            </a>
+        {{ end }}
+
+        {{ if .Site.Params.linkedin }}
+            <a href="https://www.linkedin.com/in/{{ .Site.Params.linkedin }}" target="_blank">
+                <i class="icon ion-social-linkedin" title="linkedin"></i>
+            </a>
+        {{ end }}
+
+        {{ if .Site.Params.email }}
+            <a href="mailto:{{ .Site.Params.email }}">
+                <i class="icon ion-ios-email larger" title="email"></i>
+            </a>
+        {{ end }}
+
+        {{ if .Site.RSSLink }}
+            <a href="{{ .Site.RSSLink }}">
+                <i class="icon ion-social-rss larger" title="rss"></i>
+            </a>
+        {{ end }}
+
+        </div>
+    </div>
+</section>
+
 {{ partial "footer_scripts" . }}
 
 </body>

layouts/partials/head.html

@@ -1,6 +1,5 @@
 <head>
 {{ partial "meta.html" . }}
-<base href="{{ .Site.BaseURL }}">
 <title>
 {{ $url := replace .Permalink ( printf "%s" .Site.BaseURL) "" }}
 {{ if eq $url "" }}

layouts/partials/header.html

@@ -3,12 +3,12 @@
 
 {{ partial "head.html" . }}
 
-<body lang="{{ .Site.Params.lang }}">
+<body>
 
 {{ if .IsPage }}
-<section class="header"> 
+<section class="header">
 {{ else }}
-<section class="header header-home"> 
+<section class="header header-home">
 {{ end }}
     <div class="container">
         <a href="{{ .Site.BaseURL }}"><img class="logo" src="{{ .Site.Params.logofile | absURL }}" alt="logo" /></a>
@@ -22,12 +22,12 @@
                     {{ range .Site.Sections }}
                         {{ range first 1 (where .Pages "Section" "ne" "")}}
                             {{ if ne .Section "blog"}}
-                            <a href="{{ .Section | urlize }}"><li>{{ .Section }}</li></a>
+                            <a href="{{ .Section | urlize | absURL }}"><li>{{ .Section }}</li></a>
                             {{ end }}
                         {{ end }}
                     {{ end }}
                     {{ range where .Site.RegularPages "Section" ""}}
-                        {{ if ne .Title "Home"}}
+                        {{ if and (ne .Title "License") (ne .Title "Home")}}
                             <a href="{{ .Permalink }}"><li>{{ .Title }}</li></a>
                         {{ end }}
                     {{ end }}
@@ -36,40 +36,3 @@
         </div>
     </div>
 </section>
-
-<section class="icons">
-    <div class="container">
-        <div class="content">
-
-        {{ if .Site.Params.github }}
-            <a href="https://github.com/{{ .Site.Params.github }}" target="_blank">
-                <i class="icon ion-social-github" title="github"></i>
-            </a>
-        {{ end }}
-        
-        {{ if .Site.Params.twitter }}
-            <a href="https://twitter.com/{{ .Site.Params.twitter }}" target="_blank">
-                <i class="icon ion-social-twitter" title="twitter"></i>
-            </a>
-        {{ end }}
-
-        {{ if .Site.Params.linkedin }}
-            <a href="https://www.linkedin.com/in/{{ .Site.Params.linkedin }}" target="_blank">
-                <i class="icon ion-social-linkedin" title="linkedin"></i>
-            </a>
-        {{ end }}
-
-        {{ if .Site.Params.email }}
-            <a href="mailto:{{ .Site.Params.email }}">
-                <i class="icon ion-ios-email larger" title="email"></i>
-            </a>
-        {{ end }}
-
-        {{ if .Site.RSSLink }}
-            <a href="{{ .Site.RSSLink }}">
-                <i class="icon ion-social-rss larger" title="rss"></i>
-            </a>
-        {{ end }}
-        </div>
-    </div>
-</section>

static/css/main.css

@@ -119,13 +119,13 @@ html, body, div, span, applet, object, iframe,
 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
 a, abbr, acronym, address, big, cite, code,
 del, dfn, em, img, ins, kbd, q, s, samp,
-small, strike, strong, sub, sup, tt, var,
+small, strike, strong, sub, tt, var,
 b, u, i, center,
 dl, dt, dd, ol, ul, li,
 fieldset, form, label, legend,
 table, caption, tbody, tfoot, thead, tr, th, td,
-article, aside, canvas, details, embed, 
+article, aside, canvas, details, embed,
-figure, figcaption, footer, header, hgroup, 
+figure, figcaption, footer, header, hgroup,
 menu, nav, output, ruby, section, summary,
 time, mark, audio, video {
   margin: 0;
@@ -136,7 +136,7 @@ time, mark, audio, video {
   vertical-align: baseline;
 }
 /* HTML5 display-role reset for older browsers */
-article, aside, details, figcaption, figure, 
+article, aside, details, figcaption, figure,
 footer, header, hgroup, menu, nav, section {
   display: block;
 }
@@ -246,44 +246,6 @@ section {
     max-width: 750px;
   }
 }
-section.header {
-  -webkit-order: 0;
-  -moz-order: 0;
-  -ms-order: 0;
-  order: 0;
-}
-section.icons {
-  -webkit-order: 1;
-  -moz-order: 1;
-  -ms-order: 1;
-  order: 1;
-}
-section.main {
-  -webkit-order: 2;
-  -moz-order: 2;
-  -ms-order: 2;
-  order: 2;
-}
-@media (min-width: 600px) {
-  section.header {
-    -webkit-order: 0;
-    -moz-order: 0;
-    -ms-order: 0;
-    order: 0;
-  }
-  section.icons {
-    -webkit-order: 2;
-    -moz-order: 2;
-    -ms-order: 2;
-    order: 2;
-  }
-  section.main {
-    -webkit-order: 1;
-    -moz-order: 1;
-    -ms-order: 1;
-    order: 1;
-  }
-}
 section.header .container {
   -webkit-align-items: center;
   -moz-align-items: center;
@@ -408,7 +370,7 @@ section.header nav ul li:hover {
     color: #333333;
   }
 }
-section.icons .container {
+section.footer .container {
   -webkit-align-items: center;
   -moz-align-items: center;
   -ms-align-items: center;
@@ -417,11 +379,12 @@ section.icons .container {
   -moz-justify-content: center;
   -ms-justify-content: center;
   justify-content: center;
+  flex-direction: column-reverse;
+  width: 100%;
+  text-align: center;
 }
-section.icons .content {
+section.footer .container a {
-  width: auto;
+  font-size: 14px;
-}
-section.icons .content a {
   margin-left: 6px;
   margin-right: 6px;
   color: #555555;
@@ -430,43 +393,48 @@ section.icons .content a {
   -ms-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
   -o-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
 }
-section.icons .content a:first-child {
+section.footer .container a:first-child {
   margin-left: 0;
 }
-section.icons .content a:last-child {
+section.footer .container a:last-child {
   margin-right: 0;
 }
-section.icons .content a:hover {
+section.footer .container a:hover {
   color: #111111;
 }
-section.icons .content a .icon {
+section.footer .container a .icon {
   font-size: 20px;
 }
-section.icons .content a .icon.larger {
+section.footer .container a .icon.larger {
   font-size: 22px;
 }
+section.footer .container .copyright {
+  flex-grow: 0.5;
+  text-align: start;
+}
+section.footer .container .icons {
+  flex-grow: 0.5;
+  text-align: end;
+}
 @media (min-width: 600px) {
-  section.icons {
+  section.footer {
     background-color: transparent;
   }
-  section.icons .container {
+  section.footer .container {
-    -webkit-justify-content: flex-start;
+    flex-direction: row;
-    -moz-justify-content: flex-start;
-    -ms-justify-content: flex-start;
-    justify-content: flex-start;
   }
-  section.icons .content a {
+  section.footer .container a {
     margin-left: 3px;
     margin-right: 3px;
     color: #666666;
   }
-  section.icons .content a:hover {
+  section.footer .container a:hover {
     color: #333333;
   }
-  section.icons .content a .icon {
+  section.footer .container a .icon {
     font-size: 18px;
   }
-  section.icons .content a .icon.larger {
+  section.footer .container a .icon.larger {
     font-size: 20px;
   }
 }
@@ -642,7 +610,6 @@ section.header-home {
 }
 section.main {
   padding-top: 32px;
-  padding-bottom: 32px;
 }
 section.main .container .content .post-item .meta {
     display: block;
@@ -653,18 +620,18 @@ section.main .container .content .post-item {
 }
 @media (min-width: 600px) {
   .container {
-    margin: 0 30px;
+    padding: 0 30px;
   }
   section.header {
     padding-top: 60px;
     padding-bottom: 60px;
   }
-  section.icons {
+  section.footer {
+    padding-top: 30px;
     padding-bottom: 60px;
   }
   section.main {
     padding-top: 0;
-    padding-bottom: 0;
   }
   section.main .container .content .post-item {
     display: flex;
@@ -692,6 +659,17 @@ a:hover {
 img {
   max-width: 100%;
 }
+section.main .content {
+    width: 100%;
+}
+section.main .content .markdown {
+  font-size: 1em;
+  line-height: 1.75em;
+  color: #313537;
+  letter-spacing: 0.01rem;
+  font-family: 'Source Sans Pro', sans-serif;
+  font-weight: 100;
+}
 section.main .content .markdown h1,
 section.main .content .markdown h2,
 section.main .content .markdown h3,
@@ -699,6 +677,7 @@ section.main .content .markdown h4,
 section.main .content .markdown h5,
 section.main .content .markdown h6 {
   font-size: 22px;
+  font-family: 'Open Sans', 'Helvetica Neue', 'Arial', sans-serif;
   letter-spacing: -0.005rem;
   font-weight: 700;
   -moz-osx-font-smoothing: grayscale;
@@ -746,7 +725,6 @@ section.main .content .markdown pre {
   padding: 1rem;
   line-height: 1.5em;
   white-space: pre;
-  white-space: pre-wrap;
   word-break: break-all;
   word-wrap: break-word;
 }
@@ -762,13 +740,7 @@ section.main .content .markdown a code:hover {
   text-decoration: underline;
 }
 section.main .content .markdown p {
-  font-size: 1em;
   text-align: justify;
-  line-height: 1.75em;
-  color: #313537;
-  letter-spacing: 0.01rem;
-  font-family: 'Source Sans Pro', sans-serif;
-  font-weight: 100;
   margin-top: 0;
   margin-bottom: 1em;
 }
@@ -789,7 +761,8 @@ section.main .content .markdown ul {
 }
 section.main .content .markdown li {
   list-style-type: disc;
-  list-style-position: inside;
+  list-style-position: outside;
+  margin-left: 2em;
 }
 section.main .content .markdown em {
   font-style: italic;
@@ -824,13 +797,13 @@ section.main .content .markdown blockquote p:last-child {
   margin-bottom: 0;
 }
 @media (min-width: 550px) {
+  section.main .content .markdown {
+    font-size: 1.2em;
+  }
   section.main .content .markdown blockquote {
     padding-right: 5rem;
     padding-left: 1.25rem;
   }
-  section.main .content .markdown p {
-  font-size: 1.2em;
-  }
 }
 section.main .content .markdown figure {
   width: 100%;
@@ -871,3 +844,13 @@ section.main .content .markdown tbody tr:nth-child(odd) td,
 section.main .content .markdown tbody tr:nth-child(odd) th {
   background-color: #f7f7f7;
 }
+section.main .content .markdown .footnotes ol {
+  list-style-type: decimal;
+  margin-left: 16px;
+}
+section.main .content .markdown .footnotes li {
+  list-style-type: unset;
+}
+section.main .content .markdown .footnote-ref {
+  font-size: 0.7em;
+}