Added footer

CHANGELOG.md

@@ -1,3 +1,7 @@
+# 0.1.7
+
+- Added footer to pages.
+
 # 0.1.6
 
 - Support for `/rss?short` URL for short articles description on the RSS feed.

madblog/static/css/common.css

@@ -1,5 +1,6 @@
 html {
-  height: 100%;
+  height: -webkit-fill-available;
+  height: -moz-available;
   font-size: 20px;
   font-family: BlinkMacSystemFont, -apple-system, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, Helvetica, Arial, sans-serif;
   font-weight: 400;
@@ -8,8 +9,10 @@ html {
 
 body {
   margin: 0;
-  width: 100%;
+  height: 100vh;
-  height: 100%;
+  /* mobile viewport bug fix */
+  min-height: -webkit-fill-available;
+  min-height: -moz-available;
 }
 
 a, a:visited {
@@ -105,3 +108,13 @@ h2 {
   line-height: 1.1em;
 }
 
+footer {
+  width: 100%;
+  font-size: .65em;
+  color: rgba(0, 0, 0, .4);
+  letter-spacing: .02em;
+  margin-top: .5em;
+  padding-top: .25em;
+  text-align: center;
+  box-shadow: 1px -2px 2px 0 #bbb;
+}

madblog/static/css/home.css

@@ -2,6 +2,15 @@ main {
   padding: 0;
 }
 
+.index {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  overflow: hidden;
+}
+
 .articles {
   width: 100%;
   height: 100%;

madblog/templates/article.html

@@ -38,6 +38,8 @@
             {{ content | safe }}
         </div>
     </div>
+
+    {% include 'footer.html' %}
 </main>
 
 {% include 'common-tail.html' %}

madblog/templates/footer.html

@@ -0,0 +1,3 @@
+<footer>
+    Powered by <a href="https://github.com/BlackLight/madblog" target="_blank">madblog</a>
+</footer>

madblog/templates/index.html

@@ -3,6 +3,7 @@
 {% endwith %}
 
 <main>
+    <div class="index">
         <div class="articles">
             {% for page in pages %}
                 <a class="article" href="{{ page['uri'] }}">
@@ -32,6 +33,9 @@
                 </a>
             {% endfor %}
         </div>
+    </div>
+
+    {% include 'footer.html' %}
 </main>
 
 {% include 'common-tail.html' %}