assets/styles.scss in alembic-jekyll-theme-2.0.2 vs assets/styles.scss in alembic-jekyll-theme-2.0.3

@@ -32,16 +32,18 @@
 .header,
 .footer {
   .nav {
     text-align: right;
   }
+  .logo {
+    @include flex(0 0 auto);
+  }
   .container {
     @include flexbox;
     @include flex-direction(row);
     @include justify-content(space-between);
     padding: 1rem 0;
-    text-align: inherit;
     @include breakpoint(break-1) {
       @include align-items(center);
     }
   }
 }
@@ -51,11 +53,10 @@
   margin-bottom: 1.6rem;
   text-align: center;
   background: $featureBackgroundColour;
   background-size: cover;
   background-position: center;
-  @include flexbox;
   .container {
     min-height: 35vh;
     max-width: 60%;
     @include flex-direction(column);
     @include justify-content(center);
@@ -63,16 +64,28 @@
 }
 
 .logo {
   display: inline-block;
   line-height: 0;
+  max-height: 4rem;
+  @include flexbox;
+  @include align-items(center);
   img {
-    width: 4rem;
-    height: 4rem;
+    max-height: 4rem;
   }
 }
 
+.nav {
+  a {
+    padding: .2rem;
+  }
+  &--social a {
+    display: inline-block;
+    line-height: 1;
+  }
+}
+
 .small {
   padding-top: .8rem;
   color: $captionColour;
   display: inline-block;
 }
@@ -93,21 +106,16 @@
     padding-top: 0;
   }
 }
 
 
-// Nav and copyright
-.nav {
-  &--paginator {
-    @include flexbox;
-    @include justify-content(space-between);
-    color: $captionColour;
-    text-align: center;
-  }
-  &--social {
-    text-align: left;
-  }
+// Pagination nav
+.nav--paginator {
+  @include flexbox;
+  @include justify-content(space-between);
+  color: $captionColour;
+  text-align: center;
 }
 
 .pagination {
   min-width: 20%;
 }
@@ -131,28 +139,20 @@
 .footer {
   @include flex(0, 0, auto);
 }
 
 .content {
-  width: 100%;
   @include breakpoint(break-1) {
     width: 62%;
-    &--full {
-      width: 100%;
-      margin-right: 0%;
-    }
   }
 }
 
-.share {
-  .button {
-    margin-right: .3rem;
-  }
+.share .button {
+  margin-right: .3rem;
 }
 
 .aside {
-  max-width: 100%;
   @include breakpoint(break-1) {
     max-width: 34%;
     margin-left: 4%;
     @include flex(1, 0, auto);
     opacity: 0.5;
@@ -177,40 +177,27 @@
 }
 
 
 // Lists
 .list {
-  &--posts,
-  &--results {
-    list-style: none;
-  }
-  &--nav,
-  &--categories {
-    list-style: none;
-  }
+  list-style: none;
   &--nav {
     overflow: hidden;
     transition: .2s;
   }
   .item--post,
-  .item--result {
+  .item--result,
+  .item--category {
     margin-left: 0;
   }
-  &--categories {
-    .item {
-      margin-left: 0;
-    }
-  }
 }
 
 .item {
   &--nav {
-    display: inline-block;
-    width: 100%;
     @include breakpoint(break-1) {
-      width: auto;
-      margin-left: 1rem;
+      margin-left: .4rem;
+      display: inline-block;
     }
     &:first-of-type {
       margin-left: 0;
     }
   }
@@ -221,56 +208,42 @@
   }
 }
 
 
 // Links, icons and images
-.link {
-  display: inline-block;
-  margin: .2rem;
-  line-height: 1;
-  .icon {
-    display: inline-block;
-    transition: fill .1s;
-    &:hover {
-      fill: $hoverColour;
-    }
+a .icon {
+  transition: fill .1s;
+  &:hover {
+    fill: currentColor;
   }
 }
 
 .icon {
   vertical-align: middle;
   width: 1.1em;
   height: 1.1em;
   fill: CurrentColor;
 }
 
-svg {
-  width: 100%;
-  height: 100%;
-}
-
+// Media content
 img {
   max-width: 100%;
   height: auto;
 }
 
 .figure {
   line-height: 0;
-  @include breakpoint(break-1) {
-    &--left {
-      float: left;
-      padding-right: .8rem;
-    }
-    &--right {
-      float: right;
-      padding-left: .8rem;
-    }
+  &--left {
+    float: left;
+    padding-right: .8rem;
   }
+  &--right {
+    float: right;
+    padding-left: .8rem;
+  }
 }
 
-
-// Video and map embeds
 .video,
 .map {
   position: relative;
   padding-bottom: 56.25%;
   height: 0;
@@ -320,41 +293,26 @@
   .icon {
     margin: 0 0 .35rem;
   }
 }
 
-input[type="color"] {
-  padding: 0;
-  height: 2.4rem;
-  &::-webkit-color-swatch-wrapper {
-  	padding: 0;
-    &:after {
-      content: "Color";
-    }
-  }
-  &::-webkit-color-swatch {
-  	border: none;
-  }
-}
-
 input[type="submit"],
 button,
 .button {
   cursor: pointer;
   display: inline-block;
   color: $backgroundColour;
   background: $accentColour;
-  position: relative;
   transition: box-shadow .1s;
   will-change: box-shadow;
   box-shadow: inset 0 0 0 2rem transparent;
   &:hover {
-    box-shadow: inset 0 0 0 2rem rgba(0,0,0,0.2);
+    box-shadow: inset 0 0 0 2rem rgba(0,0,0,0.25);
   }
   &:active,
   &:focus {
-    box-shadow: inset 0 0 0 2rem rgba(0,0,0,0.4);
+    box-shadow: inset 0 0 0 2rem rgba(0,0,0,0.25);
   }
 }
 
 .button--nav {
   @include breakpoint(break-1) {
@@ -379,9 +337,10 @@
 textarea,
 select {
   &:focus,
   &:hover:focus {
     outline: solid .12rem $focusColour;
+    outline-offset: -.12rem;
   }
 }
 
 a:hover:focus {
   outline: none;