Fix sticky footerwebpack

4 files changed, 36 insertions, 48 deletions

diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index 56f5a77..5c372fa 100755
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -1,49 +1,30 @@
-{{ partial "header.html" . }}
-{{ partial "navbar.html" . }}
+{{ partial "header.html" . }} {{ partial "navbar.html" . }}
 
 
-<div class="pure-g">
-    <div class="pure-u-1-24 pure-u-md-5-24"></div>
+<div class="pure-g content-box">
 	<div class="pure-u-11-12 pure-u-md-5-8">
-	  <p class="posts-name">{{ .Title }}:</p>
-
-	  <ul class="posts">
-		{{ $baseurl := .Site.BaseURL }}
-		{{ range $name, $page := .Data.Pages }}
-		{{ if eq .Type "post" }}
-		<li>
-		  <a href="{{ .Permalink }}">{{ $page.Title }}</a>
-
-		  <p class="footnote">
-			submitted <time datetime="{{ $page.Date.Format "2006-01-02T15:04:05Z07:00" }}" class="post-list timeago">{{ $page.Date.Format "2006-01-02T15:04:05Z07:00" }}</time>
-
-			{{ if or $page.Params.tags $page.Params.categories $page.Params.series }}
-			to
-			{{ end }}
-
-			{{ with $page.Params.tags }}
-			tags:[ {{ range $page.Params.tags}}<a href="{{ $baseurl }}tags/{{ . | urlize }}">{{ . }}</a> {{ end }}]
-			{{ end }}
-
-			{{ with $page.Params.categories }}
-			categories:[ {{ range $page.Params.categories }}<a href="{{ $baseurl }}categories/{{ . | urlize }}">{{ . }}</a> {{ end }}]
-			{{ end }}
-
-			{{ with $page.Params.series }}
-			series:[ {{ range $page.Params.series }}<a href="{{ $baseurl }}series/{{ . | urlize }}">{{ . }}</a> {{ end }}]
-			{{ end }}
-
-		  </p>
-		</li>
-		{{ end }}
-		{{ end }}
-	  </ul>
+		<p class="posts-name">{{ .Title }}:</p>
+
+		<ul class="posts">
+			{{ $baseurl := .Site.BaseURL }} {{ range $name, $page := .Data.Pages }} {{ if eq .Type "post" }}
+			<li>
+				<a href="{{ .Permalink }}">{{ $page.Title }}</a>
+
+				<p class="footnote">
+					submitted <time datetime="{{ $page.Date.Format " 2006-01-02T15:04:05Z07:00 " }}" class="post-list timeago">{{ $page.Date.Format "2006-01-02T15:04:05Z07:00" }}</time>					{{ if or $page.Params.tags $page.Params.categories $page.Params.series }} to {{ end }} {{ with $page.Params.tags }}
+					tags:[ {{ range $page.Params.tags}}<a href="{{ $baseurl }}tags/{{ . | urlize }}">{{ . }}</a> {{ end }}] {{ end }} {{
+					with $page.Params.categories }} categories:[ {{ range $page.Params.categories }}<a href="{{ $baseurl }}categories/{{ . | urlize }}">{{ . }}</a>					{{ end }}] {{ end }} {{ with $page.Params.series }} series:[ {{ range $page.Params.series }}<a href="{{ $baseurl }}series/{{ . | urlize }}">{{ . }}</a>					{{ end }}] {{ end }}
+
+				</p>
+			</li>
+			{{ end }} {{ end }}
+		</ul>
 	</div>
-    <div class="pure-u-1-24 pure-u-md-1-6"></div>
 </div>
 
 {{ partial "footer.html" . }}
 
 <script src="{{ .Site.BaseURL }}/js/single.bundle.js"></script>
 </body>
+
 </html>
\ No newline at end of file
diff --git a/src/common.scss b/src/common.scss
index 444b698..4908920 100755
--- a/src/common.scss
+++ b/src/common.scss
@@ -1,9 +1,12 @@
-html {
+body {
     font-family: "source-sans-pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
     color: #484c55;
     line-height: 1.5;
     font-size: 16px;
     text-rendering: optimizelegibility;
+    display: flex;
+    min-height: 100vh;
+    flex-direction: column;
     
     a {
         color: rgb(38, 87, 120);
@@ -20,6 +23,7 @@ html {
 
 div.center-box {
     display: flex;
+    flex: 1;
     height: auto;
     justify-content: center;        
 }
@@ -42,10 +46,12 @@ footer{
             text-decoration: none; 
         }
     
-        border-top-style: solid;
-        border-top-color: rgb(238,238,238);
-        border-top-width: 1px;
-       
+        border: 1px solid rgb(238,238,238);
+        border-bottom: none;
+        border-radius: .5em;
+        border-top-left-radius: .2em;
+        border-top-right-radius: .2em;
+          
         a.pure-menu-heading {
             display: inline-block;
         }
@@ -67,9 +73,10 @@ header.navbar {
     
     nav {
         height: 2.5em;
-        border-bottom-style: solid;
-        border-bottom-color: rgb(238,238,238);
-        border-bottom-width: 1px;
+        border: 1px solid rgb(238,238,238);
+        border-top: none;
+        border-bottom-left-radius: .2em;
+        border-bottom-right-radius: .2em;
         
         #toggle-btn {
             display: none;
diff --git a/static/js/list.bundle.js b/static/js/list.bundle.js
index 877d2af..17d47e3 100755
--- a/static/js/list.bundle.js
+++ b/static/js/list.bundle.js
@@ -503,7 +503,7 @@
 
 
 	// module
-	exports.push([module.id, "html {\n  font-family: \"source-sans-pro\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n  color: #484c55;\n  line-height: 1.5;\n  font-size: 16px;\n  text-rendering: optimizelegibility; }\n  html a {\n    color: #265778;\n    text-decoration: none; }\n    html a:hover {\n      text-decoration: underline; }\n  html ul {\n    list-style-type: none; }\n\ndiv.center-box {\n  display: flex;\n  height: auto;\n  justify-content: center; }\n\narticle.post .post-content {\n  font-family: \"source-sans-pro\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n  color: #484c55;\n  line-height: 1.5;\n  font-size: 16px;\n  text-rendering: optimizelegibility; }\n\nfooter {\n  display: flex;\n  height: auto;\n  justify-content: center; }\n  footer nav {\n    border-top-style: solid;\n    border-top-color: #eeeeee;\n    border-top-width: 1px; }\n    footer nav a:hover {\n      text-decoration: none; }\n    footer nav a.pure-menu-heading {\n      display: inline-block; }\n    footer nav a.pure-menu-link {\n      color: #484c55; }\n\nheader.navbar {\n  display: flex;\n  height: auto;\n  justify-content: center;\n  margin-bottom: 3em; }\n  header.navbar a:hover {\n    text-decoration: none; }\n  header.navbar nav {\n    height: 2.5em;\n    border-bottom-style: solid;\n    border-bottom-color: #eeeeee;\n    border-bottom-width: 1px; }\n    header.navbar nav #toggle-btn {\n      display: none; }\n    header.navbar nav label[for=\"toggle-btn\"] {\n      display: none;\n      float: right; }\n    header.navbar nav a.pure-menu-heading {\n      display: inline-block; }\n    header.navbar nav a.pure-menu-link {\n      color: #484c55; }\n    @media screen and (min-width: 48em) {\n      header.navbar nav ul {\n        float: right;\n        display: initial; } }\n    @media screen and (max-width: 48em) {\n      header.navbar nav label[for=\"toggle-btn\"] {\n        display: inline-block; }\n      header.navbar nav ul.pure-menu-list {\n        background-color: white;\n        display: none; } }\n\n.footnote {\n  font-size: small;\n  margin-top: 0; }\n\nul.posts {\n  padding-left: 0;\n  margin-bottom: 1em; }\n  ul.posts p.footnote {\n    opacity: 0.8; }\n    ul.posts p.footnote span.taxonomy a {\n      color: #484c55; }\n    ul.posts p.footnote span.taxonomy a:hover {\n      opacity: 1;\n      color: #265778; }\n    ul.posts p.footnote span.taxonomy a:not(:last-child)::after {\n      content: ', '; }\n    ul.posts p.footnote span.taxonomy a:not(:last-child):hover::after {\n      text-decoration: none; }\n\npre, :not(pre) > code {\n  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;\n  background-color: #f5f2f0;\n  font-size: 14px;\n  line-height: 21px;\n  font-weight: normal;\n  padding-left: .2em;\n  padding-right: .2em;\n  padding-top: .2em;\n  border-radius: .2em; }\n\npre {\n  padding-left: 1em; }\n\n#gototop-btn {\n  float: right; }\n", ""]);
+	exports.push([module.id, "body {\n  font-family: \"source-sans-pro\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n  color: #484c55;\n  line-height: 1.5;\n  font-size: 16px;\n  text-rendering: optimizelegibility;\n  display: flex;\n  min-height: 100vh;\n  flex-direction: column; }\n  body a {\n    color: #265778;\n    text-decoration: none; }\n    body a:hover {\n      text-decoration: underline; }\n  body ul {\n    list-style-type: none; }\n\ndiv.center-box {\n  display: flex;\n  flex: 1;\n  height: auto;\n  justify-content: center; }\n\narticle.post .post-content {\n  font-family: \"source-sans-pro\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n  color: #484c55;\n  line-height: 1.5;\n  font-size: 16px;\n  text-rendering: optimizelegibility; }\n\nfooter {\n  display: flex;\n  height: auto;\n  justify-content: center; }\n  footer nav {\n    border: 1px solid #eeeeee;\n    border-bottom: none;\n    border-radius: .5em;\n    border-top-left-radius: .2em;\n    border-top-right-radius: .2em; }\n    footer nav a:hover {\n      text-decoration: none; }\n    footer nav a.pure-menu-heading {\n      display: inline-block; }\n    footer nav a.pure-menu-link {\n      color: #484c55; }\n\nheader.navbar {\n  display: flex;\n  height: auto;\n  justify-content: center;\n  margin-bottom: 3em; }\n  header.navbar a:hover {\n    text-decoration: none; }\n  header.navbar nav {\n    height: 2.5em;\n    border: 1px solid #eeeeee;\n    border-top: none;\n    border-bottom-left-radius: .2em;\n    border-bottom-right-radius: .2em; }\n    header.navbar nav #toggle-btn {\n      display: none; }\n    header.navbar nav label[for=\"toggle-btn\"] {\n      display: none;\n      float: right; }\n    header.navbar nav a.pure-menu-heading {\n      display: inline-block; }\n    header.navbar nav a.pure-menu-link {\n      color: #484c55; }\n    @media screen and (min-width: 48em) {\n      header.navbar nav ul {\n        float: right;\n        display: initial; } }\n    @media screen and (max-width: 48em) {\n      header.navbar nav label[for=\"toggle-btn\"] {\n        display: inline-block; }\n      header.navbar nav ul.pure-menu-list {\n        background-color: white;\n        display: none; } }\n\n.footnote {\n  font-size: small;\n  margin-top: 0; }\n\nul.posts {\n  padding-left: 0;\n  margin-bottom: 1em; }\n  ul.posts p.footnote {\n    opacity: 0.8; }\n    ul.posts p.footnote span.taxonomy a {\n      color: #484c55; }\n    ul.posts p.footnote span.taxonomy a:hover {\n      opacity: 1;\n      color: #265778; }\n    ul.posts p.footnote span.taxonomy a:not(:last-child)::after {\n      content: ', '; }\n    ul.posts p.footnote span.taxonomy a:not(:last-child):hover::after {\n      text-decoration: none; }\n\npre, :not(pre) > code {\n  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;\n  background-color: #f5f2f0;\n  font-size: 14px;\n  line-height: 21px;\n  font-weight: normal;\n  padding-left: .2em;\n  padding-right: .2em;\n  padding-top: .2em;\n  border-radius: .2em; }\n\npre {\n  padding-left: 1em; }\n\n#gototop-btn {\n  float: right; }\n", ""]);
 
 	// exports
 
diff --git a/static/js/single.bundle.js b/static/js/single.bundle.js
index 59efe05..14e52e8 100755
--- a/static/js/single.bundle.js
+++ b/static/js/single.bundle.js
@@ -505,7 +505,7 @@
 
 
 	// module
-	exports.push([module.id, "html {\n  font-family: \"source-sans-pro\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n  color: #484c55;\n  line-height: 1.5;\n  font-size: 16px;\n  text-rendering: optimizelegibility; }\n  html a {\n    color: #265778;\n    text-decoration: none; }\n    html a:hover {\n      text-decoration: underline; }\n  html ul {\n    list-style-type: none; }\n\ndiv.center-box {\n  display: flex;\n  height: auto;\n  justify-content: center; }\n\narticle.post .post-content {\n  font-family: \"source-sans-pro\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n  color: #484c55;\n  line-height: 1.5;\n  font-size: 16px;\n  text-rendering: optimizelegibility; }\n\nfooter {\n  display: flex;\n  height: auto;\n  justify-content: center; }\n  footer nav {\n    border-top-style: solid;\n    border-top-color: #eeeeee;\n    border-top-width: 1px; }\n    footer nav a:hover {\n      text-decoration: none; }\n    footer nav a.pure-menu-heading {\n      display: inline-block; }\n    footer nav a.pure-menu-link {\n      color: #484c55; }\n\nheader.navbar {\n  display: flex;\n  height: auto;\n  justify-content: center;\n  margin-bottom: 3em; }\n  header.navbar a:hover {\n    text-decoration: none; }\n  header.navbar nav {\n    height: 2.5em;\n    border-bottom-style: solid;\n    border-bottom-color: #eeeeee;\n    border-bottom-width: 1px; }\n    header.navbar nav #toggle-btn {\n      display: none; }\n    header.navbar nav label[for=\"toggle-btn\"] {\n      display: none;\n      float: right; }\n    header.navbar nav a.pure-menu-heading {\n      display: inline-block; }\n    header.navbar nav a.pure-menu-link {\n      color: #484c55; }\n    @media screen and (min-width: 48em) {\n      header.navbar nav ul {\n        float: right;\n        display: initial; } }\n    @media screen and (max-width: 48em) {\n      header.navbar nav label[for=\"toggle-btn\"] {\n        display: inline-block; }\n      header.navbar nav ul.pure-menu-list {\n        background-color: white;\n        display: none; } }\n\n.footnote {\n  font-size: small;\n  margin-top: 0; }\n\nul.posts {\n  padding-left: 0;\n  margin-bottom: 1em; }\n  ul.posts p.footnote {\n    opacity: 0.8; }\n    ul.posts p.footnote span.taxonomy a {\n      color: #484c55; }\n    ul.posts p.footnote span.taxonomy a:hover {\n      opacity: 1;\n      color: #265778; }\n    ul.posts p.footnote span.taxonomy a:not(:last-child)::after {\n      content: ', '; }\n    ul.posts p.footnote span.taxonomy a:not(:last-child):hover::after {\n      text-decoration: none; }\n\npre, :not(pre) > code {\n  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;\n  background-color: #f5f2f0;\n  font-size: 14px;\n  line-height: 21px;\n  font-weight: normal;\n  padding-left: .2em;\n  padding-right: .2em;\n  padding-top: .2em;\n  border-radius: .2em; }\n\npre {\n  padding-left: 1em; }\n\n#gototop-btn {\n  float: right; }\n", ""]);
+	exports.push([module.id, "body {\n  font-family: \"source-sans-pro\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n  color: #484c55;\n  line-height: 1.5;\n  font-size: 16px;\n  text-rendering: optimizelegibility;\n  display: flex;\n  min-height: 100vh;\n  flex-direction: column; }\n  body a {\n    color: #265778;\n    text-decoration: none; }\n    body a:hover {\n      text-decoration: underline; }\n  body ul {\n    list-style-type: none; }\n\ndiv.center-box {\n  display: flex;\n  flex: 1;\n  height: auto;\n  justify-content: center; }\n\narticle.post .post-content {\n  font-family: \"source-sans-pro\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n  color: #484c55;\n  line-height: 1.5;\n  font-size: 16px;\n  text-rendering: optimizelegibility; }\n\nfooter {\n  display: flex;\n  height: auto;\n  justify-content: center; }\n  footer nav {\n    border: 1px solid #eeeeee;\n    border-bottom: none;\n    border-radius: .5em;\n    border-top-left-radius: .2em;\n    border-top-right-radius: .2em; }\n    footer nav a:hover {\n      text-decoration: none; }\n    footer nav a.pure-menu-heading {\n      display: inline-block; }\n    footer nav a.pure-menu-link {\n      color: #484c55; }\n\nheader.navbar {\n  display: flex;\n  height: auto;\n  justify-content: center;\n  margin-bottom: 3em; }\n  header.navbar a:hover {\n    text-decoration: none; }\n  header.navbar nav {\n    height: 2.5em;\n    border: 1px solid #eeeeee;\n    border-top: none;\n    border-bottom-left-radius: .2em;\n    border-bottom-right-radius: .2em; }\n    header.navbar nav #toggle-btn {\n      display: none; }\n    header.navbar nav label[for=\"toggle-btn\"] {\n      display: none;\n      float: right; }\n    header.navbar nav a.pure-menu-heading {\n      display: inline-block; }\n    header.navbar nav a.pure-menu-link {\n      color: #484c55; }\n    @media screen and (min-width: 48em) {\n      header.navbar nav ul {\n        float: right;\n        display: initial; } }\n    @media screen and (max-width: 48em) {\n      header.navbar nav label[for=\"toggle-btn\"] {\n        display: inline-block; }\n      header.navbar nav ul.pure-menu-list {\n        background-color: white;\n        display: none; } }\n\n.footnote {\n  font-size: small;\n  margin-top: 0; }\n\nul.posts {\n  padding-left: 0;\n  margin-bottom: 1em; }\n  ul.posts p.footnote {\n    opacity: 0.8; }\n    ul.posts p.footnote span.taxonomy a {\n      color: #484c55; }\n    ul.posts p.footnote span.taxonomy a:hover {\n      opacity: 1;\n      color: #265778; }\n    ul.posts p.footnote span.taxonomy a:not(:last-child)::after {\n      content: ', '; }\n    ul.posts p.footnote span.taxonomy a:not(:last-child):hover::after {\n      text-decoration: none; }\n\npre, :not(pre) > code {\n  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;\n  background-color: #f5f2f0;\n  font-size: 14px;\n  line-height: 21px;\n  font-weight: normal;\n  padding-left: .2em;\n  padding-right: .2em;\n  padding-top: .2em;\n  border-radius: .2em; }\n\npre {\n  padding-left: 1em; }\n\n#gototop-btn {\n  float: right; }\n", ""]);
 
 	// exports