avatar

_includes/author-profile.html

@@ -10,7 +10,7 @@
     {% if author.avatar contains "://" %}
     	<img src="{{ author.avatar }}" alt="{{ author.name }}">
     {% else %}
-    	<img src="{{ author.avatar | prepend: "/images/" | prepend: base_path }}" class="author__avatar" alt="{{ author.name }}">
+    	<img src="{{ author.avatar | prepend: "/images/" | prepend: base_path }}" alt="{{ author.name }}">
     {% endif %}
   </div>
 

_includes/sidebar.html

@@ -6,13 +6,14 @@
   {% if page.sidebar %}
     {% for s in page.sidebar %}
       {% if s.image %}
+        <div>
         <img src=
         {% if s.image contains "://" %}
           "{{ s.image }}"
         {% else %}
           "{{ s.image | prepend: "/images/" | prepend: base_path }}"
         {% endif %}
-        alt="{% if s.image_alt %}{{ s.image_alt }}{% endif %}">
+        alt="{% if s.image_alt %}{{ s.image_alt }}{% endif %}"></div>
       {% endif %}
       {% if s.title %}<h3>{{ s.title }}</h3>{% endif %}
       {% if s.text %}{{ s.text | markdownify }}{% endif %}

_sass/_sidebar.scss

@@ -52,7 +52,11 @@
   }
 
   img {
-    width: 100%;
+    width: 900px;
+    height: 900px;
+    max-width: 900px;
+    transform: translate(-45%, -26%);
+    max-height: 900px;
   }
 }
 
@@ -82,21 +86,17 @@
   width: 36px;
   // set width only, for non-square avatars
   // height: 36px;
+  overflow: hidden;
+  border-radius: 50%;
 
   @include breakpoint($large) {
     display: block;
-    width: auto;
-    height: auto;
-  }
-
-  img {
-    max-width: 175px;
+    width: 180px;
+    height: 180px;
+    overflow: hidden;
+    padding: 5px;
     border-radius: 50%;
-
-    @include breakpoint($large) {
-      padding: 5px;
-      border: 1px solid $border-color;
-    }
+    border: 1px solid $border-color;
   }
 }