Auto-resize large images to fit screen; Improve sharing style

layouts/_default/list.html

@@ -6,7 +6,7 @@
     {{ range $paginator.Pages }}
     <div>
         <h2><a href="{{ .Permalink }}">{{ .Title }}</a></h2>
-        <p>{{ .Summary }}</p>
+        <div class="article-style"><p>{{ .Summary }}</p></div>
     </div>
     {{ end }}
 

layouts/_default/single.html

@@ -7,7 +7,7 @@
 
         {{ partial "article_metadata" (dict "content" . "is_list" 0) }}
 
-        <div class="post" itemprop="articleBody">
+        <div class="article-style" itemprop="articleBody">
             {{ .Content }}
         </div>
     </article>

layouts/index.html

@@ -58,7 +58,7 @@
                 <div class="article-list-item" itemscope="" itemprop="blogPost">
                     <h3 class="post-title" itemprop="name"><a href="{{ .Permalink }}" itemprop="url">{{ .Title }}</a></h3>
                     {{ partial "article_metadata" (dict "content" . "is_list" 1) }}
-                    <p itemprop="articleBody">
+                    <p class="article-style" itemprop="articleBody">
                         {{ if .Truncated }}
                             {{ .Summary }}
                         {{ else }}

layouts/project/single.html

@@ -7,7 +7,7 @@
 
         {{ with .Params.external_link }}<a class="btn btn-primary btn-outline" href="{{ . }}">Go to Project Site</a>{{ end }}
 
-        <div class="post" itemprop="articleBody">
+        <div class="article-style" itemprop="articleBody">
             {{ .Content }}
         </div>
     </article>

layouts/publication/single.html

@@ -60,7 +60,7 @@
 
         <div class="space-below"></div>
 
-        {{ .Content }}
+        <div class="article-style">{{ .Content }}</div>
 
     </div>
 

layouts/section/post.html

@@ -9,7 +9,7 @@
     <div>
         <h2><a href="{{ .Permalink }}">{{ .Title }}</a></h2>
         {{ partial "article_metadata" (dict "content" . "is_list" 1) }}
-        <p>{{ .Summary }}</p>
+        <div class="article-style"><p>{{ .Summary }}</p></div>
     </div>
     {{ end }}
 

static/css/hugo-academic.css

@@ -7,9 +7,7 @@
  *  Fonts
  **************************************************/
 
-@import url(//fonts.googleapis.com/css?family=Lato:400,700);
+@import url(//fonts.googleapis.com/css?family=Lato:400,700|Merriweather|Roboto+Mono);
-@import url(//fonts.googleapis.com/css?family=Roboto+Mono);
-@import url(//fonts.googleapis.com/css?family=Merriweather);
 
 /*************************************************
  *  Core
@@ -82,10 +80,21 @@ h3.post-title a {
     -webkit-transition: color 0.6s ease;
 }
 
+img, video {
+    height: auto;
+    max-width: 100%;
+    display: block;
+}
+
 pre, code {
     font-family: 'Roboto Mono', 'Courier New', 'Courier', monospace;
 }
 
+pre {
+    margin: 0 0 1.5rem;
+    overflow: auto;
+}
+
 .space-below {
     margin-bottom: 50px;
 }
@@ -136,12 +145,57 @@ footer p {
     background-color: rgb(247, 247, 247);
 }
 
+/*************************************************
+ *  Sharing
+ **************************************************/
+
+.share-box {
+    float: right;
+}
+
+ul.share {
+    list-style: none;
+    text-align: right;
+    margin: 0;
+    padding: 0;
+}
+
+ul.share li {
+    display: inline-block;
+}
+
+ul.share li .fa {
+    display: inline-block;
+    width: 35px;
+    height: 35px;
+    line-height: 37px;
+    font-size: 18px;
+    text-align: center;
+    transition: all 150ms ease-in-out;
+    color: #fff;
+}
+
+ul.share li a {
+    background-color: #b5c6ce;
+    display: inline-block;
+    border-radius: 50%;
+    text-decoration: none !important;
+}
+
+ul.share li:hover .fa {
+    -moz-transform: scale(1.4);
+    -webkit-transform: scale(1.4);
+    transform: scale(1.4)
+}
+
 /*************************************************
  *  Blog Articles
  **************************************************/
 
 .article-metadata {
     margin-bottom: 20px;
+    line-height: 37px; /* Match share bar line height. */
+    font-size: 14px;
 }
 
 .article-list-item {
@@ -161,23 +215,29 @@ footer p {
     color: #888;
 }
 
-ul.share {
+.article-style img, .article-style video {
-    list-style: none;
+    box-shadow: 0 0 1px #edefed;
-    float: right;
+    -moz-box-shadow: 0 0 1px #edefed;
+    -webkit-box-shadow: 0 0 1px #edefed;
+    box-shadow: 1px 1px 0px #edefed,-1px -1px 0px #edefed,1px -1px 0px #edefed,-1px 1px 0px #edefed; */
+    -moz-box-shadow: 1px 1px 0px #edefed,-1px -1px 0px #edefed,1px -1px 0px #edefed,-1px 1px 0px #edefed;
+    -webkit-box-shadow: 1px 1px 0px #edefed,-1px -1px 0px #edefed,1px -1px 0px #edefed,-1px 1px 0px #edefed;
+    margin-left: auto;
+    margin-right: auto;
+    margin-top: 60px;
+    margin-bottom: 60px;
+    padding-left: 0;
+    padding-right: 0;
 }
 
-ul.share li {
+.article-style figure {
-    margin-right: 3px;
+    margin-top: 60px;
-    margin-left: 3px;
+    margin-bottom: 60px;
-    display: inline-block;
 }
 
-ul.share li:last-child {
+.article-style figure img {
-    margin-right: 0px;
+    margin-top: 0;
-}
+    margin-bottom: 0;
-
-ul.share li i {
-    font-size: 1.75rem;
 }
 
 #comments {