Add blog functionality (#1)

themes/hugo-sustain/static/css/custom.css

@@ -0,0 +1,122 @@
+/* COLOURS */
+html, body {
+  border-top: 3px solid #0D76EC;
+}
+div.footer {
+  border-bottom: 5px solid #0D76EC;
+}
+.container a {
+  color: #0D76EC;
+}
+.container a:hover {
+  color: #12437A;
+}
+.container .label-success {
+  background-color: rgba(92, 139, 184, 0.6);
+  color: #FFF;
+}
+.container a.label-success:hover {
+  background-color: rgba(92, 139, 184, 0.9);
+  color: #FFF;
+}
+.container h1 {
+  font-weight: bold;
+  color: #0D76EC;
+}
+.container h4 a {
+  color: #0D76EC;
+}
+.container h4 a:hover {
+  color: #0060CC;
+}
+
+/* Avoid scrollbar jumps in centering 
+ * see https://css-tricks.com/eliminate-jumps-in-horizontal-centering-by-forcing-a-scroll-bar/
+ */
+div#wrap { 
+  margin-left: calc(100vw - 100%);
+}
+
+div.avatar img {
+  max-height: 190px;
+}
+.panel {
+  box-shadow: none;
+  -webkit-box-shadow: none;
+}
+
+ul.nav li.active a {
+  font-weight: bold;
+}
+
+/* Site specific settings */
+section#about p {
+  font-size: 18px;
+  margin-bottom: 20px;
+}
+
+div.contact p {
+  line-height: 1.5em;
+  margin-bottom: 30px;
+}
+
+/* transparency of tags */
+
+
+/* Scale social icons with hovering */
+.social-links li a {
+  font-size: 26px;
+}
+.social-links li a i {
+  transform: scale(0.8);
+  transition: transform .3s;
+}
+.social-links li a:hover i {
+  transform: scale(1);
+}
+
+/* BLOG */
+.categories {
+  font-size: 18px;
+  margin: 1em 0 3em 0;
+}
+.blog-summary {
+  padding-bottom: 1em;
+}
+.metadata {
+  font-size: 0.8em;
+  opacity: 0.7;
+}
+.blogpost .header-image img {
+  width: 100%;
+  height: auto;
+  padding-bottom: 2px;
+}
+.blogpost .header-image p {
+  opacity: 0.7;
+  font-size: 0.8em;
+  text-align: center;
+  line-height: 1em;
+  margin-bottom: 1.5em;
+}
+
+a.learn-more {
+  font-size: 1.8em;
+  line-height: 0.8em;
+  font-weight: 700;
+  font-variant: small-caps;
+  text-transform: lowercase;
+  padding: 0 1em 0 .3em;
+  position: absolute;
+}
+a.learn-more::after {
+  position: absolute;
+  right: 0.3em;
+  content: " » ";
+  opacity: .8;
+  transition: all 150ms linear;
+}
+a.learn-more:hover::after {
+  right: 0;
+  opacity: 1;
+}