Layout improvements

- Tagline
- Share buttons
- JSON LD
- Tags
- Style Fixes

static/css/hyde.css

@@ -69,7 +69,7 @@ html {
   }
 
   footer {
-    padding-left: 18rem;
+    margin-left: 19rem !important;
   }
 }
 
@@ -125,12 +125,15 @@ footer {
   font-size: .7rem;
   text-align: center;
   height: 40px;
+  margin: 2rem 1rem 0 1rem;
+  padding: 1rem 0;
+  border-top: 1px solid #e0e0e0;
 }
 
 
 @media (min-width: 48em) {
   .content {
-    max-width: 38rem;
+    max-width: 40rem;
     margin-left: 20rem;
     margin-right: 2rem;
     margin-bottom: -40px;
@@ -138,13 +141,6 @@ footer {
   }
 }
 
-@media (min-width: 64em) {
-  .content {
-    margin-left: 22rem;
-    margin-right: 4rem;
-  }
-}
-
 .img-circle {
   border-radius: 50%;
 }
@@ -274,3 +270,62 @@ ul.posts {
   border-top-right-radius: 4px;
   border-bottom-right-radius: 4px;
 }
+
+.share-buttons {
+  text-align: center;
+  font-size: 1.5rem;
+  margin-top: 2rem;
+}
+
+.share-buttons a {
+  padding: 0 0.6rem;
+}
+
+.share-buttons a:hover {
+  opacity: 0.75;
+}
+
+ul.tags {
+  list-style: none;
+  padding: 0;
+  margin: 2rem 0 1rem 0;
+}
+
+ul.tags li {
+  display: inline-block;
+  margin: 0.25rem 0;
+}
+
+a.tag-link {
+  background-color: #f2f2f2;
+  padding: 5px 10px;
+  border-radius: 3px;
+  font-size: 0.75rem;
+  text-decoration: none;
+  color: #757575;
+}
+
+a.tag-link:hover {
+  text-decoration: none;
+}
+
+figure {
+  padding: 0;
+  margin: 0;
+}
+
+figure > img {
+  margin: 0 auto;
+}
+
+figcaption {
+  text-align: center;
+  font-size: 80%;
+}
+
+.tagline {
+  display: block;
+  font-size: 1.2rem;
+  margin-bottom: .5rem;
+  font-weight: 400;
+}

static/css/poole.css

@@ -321,7 +321,6 @@ tbody tr:nth-child(odd) th {
 /* Meta data line below post title */
 .post-date {
   display: block;
-  margin-top: -.5rem;
   margin-bottom: 1rem;
   color: #757575;
 }

static/js/soho.js

@@ -0,0 +1,48 @@
+$(document).ready(function(){
+
+  $(".twitter-share-button").click(function (e) {
+    e.preventDefault();
+    var self = $(this);
+    var url = encodeURIComponent(self.data("url"));
+    var text = encodeURIComponent(self.data("text"));
+
+    window.open(`https://twitter.com/intent/tweet?text=${text}&url=${url}`, "_blank").focus();
+  });
+
+  $(".linkedin-share-button").click(function (e) {
+    e.preventDefault();
+    var self = $(this);
+    var url = encodeURIComponent(self.data("url"));
+    // var text = encodeURIComponent(self.data("text"));
+
+    window.open(`https://www.linkedin.com/sharing/share-offsite/?url=${url}`, "_blank").focus();
+  });
+
+  $(".facebook-share-button").click(function (e) {
+    e.preventDefault();
+    var self = $(this);
+    var url = encodeURIComponent(self.data("url"));
+    // var text = encodeURIComponent(self.data("text"));
+
+    window.open(`https://www.facebook.com/sharer/sharer.php?u=${url}`, "_blank").focus();
+  });
+
+  $(".telegram-share-button").click(function (e) {
+    e.preventDefault();
+    var self = $(this);
+    var url = encodeURIComponent(self.data("url"));
+    var text = encodeURIComponent(self.data("text"));
+
+    window.open(`https://t.me/share/url?url=${url}&text=${text}`, "_blank").focus();
+  });
+
+  $(".pinterest-share-button").click(function (e) {
+    e.preventDefault();
+    var self = $(this);
+    var url = encodeURIComponent(self.data("url"));
+    var text = encodeURIComponent(self.data("text"));
+
+    window.open(`https://pinterest.com/pin/create/button/?url=${url}&media=&description=${text}`, "_blank").focus();
+  });
+
+});