jekyll-theme-hydejack 6.0.0.pre.alpha → 6.0.0.pre.beta2

data/_sass/hydejack/_me-inline.scss

@@ -3,19 +3,21 @@
   width: 6.5rem;
   height: 6.5rem;
   margin-left: 1rem;
+  margin-bottom: .5rem;
   border-radius: 100%;
   position: relative;
 
-  @media screen and (min-width: $break-point-font-1) {
+  @media screen and (min-width: $break-point-1) {
     width: 7rem;
     height: 7rem;
   }
-  @media screen and (min-width: $break-point-1) {
+
+  @media screen and (min-width: $break-point-2) {
     width: 6.5rem;
     height: 6.5rem;
-    margin-top: 0;
   }
-  @media screen and (min-width: $break-point-font-2) {
+
+  @media screen and (min-width: $break-point-3) {
     width: 7rem;
     height: 7rem;
   }

data/_sass/hydejack/_menu-inline.scss

@@ -1,14 +1,14 @@
 .menu {
   display: block;
   padding: 1.25rem 1.5rem;
-  color: #9a9a9a;
+  color: $gray;
   border-bottom: none;
   position: fixed;
   top: 0;
   left: 0;
   z-index: 1;
 
-  @media (min-width: $break-point-1) {
+  @media screen and (min-width: $break-point-2) {
     position: absolute;
     left: -9999px;
 
@@ -17,13 +17,13 @@
     }
   }
 
-  @media (min-width: $break-point-2) {
+  @media screen and (min-width: $break-point-3) {
     &:focus {
       left: 21.5rem;
     }
   }
 
-  @media (min-width: $break-point-dynamic) {
+  @media screen and (min-width: $break-point-dynamic) {
     &:focus {
       left: calc(50% - 24.5rem);
     }

data/_sass/hydejack/_menu.scss

@@ -1,14 +1,14 @@
 .menu {
   // display: block;
   // padding: 1.25rem 1.5rem;
-  // color: #9a9a9a;
+  // color: $gray;
   // border-bottom: none;
   // position: fixed;
   // top: 0;
   // left: 0;
   // z-index: 1;
   //
-  // @media (min-width: $break-point-1) {
+  // @media screen and (min-width: $break-point-2) {
   //   position: absolute;
   //   left: -9999px;
   //
@@ -17,13 +17,13 @@
   //   }
   // }
   //
-  // @media (min-width: $break-point-2) {
+  // @media screen and (min-width: $break-point-3) {
   //   &:focus {
   //     left: 21.5rem;
   //   }
   // }
   //
-  // @media (min-width: $break-point-dynamic) {
+  // @media screen and (min-width: $break-point-dynamic) {
   //   &:focus {
   //     left: calc(50% - 24.5rem);
   //   }

data/_sass/hydejack/_sidebar-inline.scss

@@ -28,6 +28,11 @@
   /* Sidebar links */
   a {
     color: #fff;
+    border-bottom-color: rgba(255, 255, 255, 0.2);
+
+    // &:hover, &:focus {
+    //   border-bottom-color: #fff;
+    // }
   }
 }
 
@@ -40,7 +45,7 @@
     min-height: 100vh;
   }
 
-  @media screen and (min-width: $break-point-1) {
+  @media screen and (min-width: $break-point-2) {
     position: fixed;
     top: 0;
     left: 0;
@@ -95,7 +100,7 @@
   }
 }
 
-.sidebar-nav-item {
+a.sidebar-nav-item {
   font-weight: bold;
   display: block;
   line-height: 1.75;
@@ -103,10 +108,12 @@
   padding: .25rem 2rem;
   border-top: 1px solid rgba(255, 255, 255, 0.2);
   border-bottom: none;
-
+  // transition: background-color 500ms ease;
+  //
   // &:hover, &:focus {
   //   border-bottom: none;
   //   background-color: rgba(255, 255, 255, 0.1);
+  //   transition: background-color 50ms ease;
   // }
 }
 

data/_sass/hydejack/_sidebar.scss

@@ -25,10 +25,15 @@
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00202020', endColorstr='#80202020',GradientType=0 ); /* IE6-9 */
   }
 
-  // /* Sidebar links */
-  // a {
-  //   color: #fff;
-  // }
+  /* Sidebar links */
+  a {
+    // color: #fff;
+    // border-bottom-color: rgba(255, 255, 255, 0.2);
+
+    &:hover, &:focus {
+      border-bottom-color: #fff;
+    }
+  }
 }
 
 // #_yDrawer {
@@ -40,7 +45,7 @@
 //     min-height: 100vh;
 //   }
 //
-//   @media screen and (min-width: $break-point-1) {
+//   @media screen and (min-width: $break-point-2) {
 //     position: fixed;
 //     top: 0;
 //     left: 0;
@@ -95,7 +100,7 @@
 //   }
 // }
 //
-.sidebar-nav-item {
+a.sidebar-nav-item {
   // font-weight: bold;
   // display: block;
   // line-height: 1.75;
@@ -103,10 +108,12 @@
   // padding: .25rem 2rem;
   // border-top: 1px solid rgba(255, 255, 255, 0.2);
   // border-bottom: none;
+  transition: background-color 500ms ease;
 
   &:hover, &:focus {
     border-bottom: none;
     background-color: rgba(255, 255, 255, 0.1);
+    transition: background-color 50ms ease-out;
   }
 }
 

data/_sass/hydejack/_social-inline.scss

@@ -1,27 +1,36 @@
-.sidebar-social > ul  {
-  list-style: none;
-  padding-left: 0;
-  // margin-left: -0.5rem;
-  // margin-right: -0.5rem;
+.sidebar-social {
+  margin-bottom: .5rem;
 
-  > li {
-    display: inline-block;
+  &::after {
+    @extend .clearfix
+  }
+
+  > ul {
+    list-style: none;
+    padding-left: 0;
+    margin: 0 -.25rem;
+
+    > li {
+      float: left;
+      margin: 0 .25rem;
 
-    > a {
-      display: inline-block;
-      text-align: center;
-      font-size: 1.6rem;
-      line-height: 3rem;
-      width: 3rem;
-      height: 3rem;
+      > a {
+        display: inline-block;
+        text-align: center;
+        font-size: 1.6rem;
+        line-height: 3rem;
+        width: 3.125rem;
+        height: 4rem;
+        padding: .5rem 0;
 
-      // &::after {
-      //   display: none;
-      // }
+        // &::after {
+        //   display: none;
+        // }
+      }
     }
-  }
 
-  li + li {
-    margin-top: 0;
+    li + li {
+      margin-top: 0;
+    }
   }
 }

data/_sass/hydejack/_social.scss

@@ -1,27 +1,36 @@
-.sidebar-social > ul  {
-  // list-style: none;
-  // padding-left: 0;
-  margin-left: -0.5rem;
-  margin-right: -0.5rem;
+.sidebar-social {
+  // margin-bottom: .5rem;
+  //
+  // &::after {
+  //   @extend .clearfix
+  // }
+
+  > ul {
+    // list-style: none;
+    // padding-left: 0;
+    // margin: 0 -.25rem;
 
-  > li {
-    // display: inline-block;
+    > li {
+      // float: left;
+      // margin: 0 .25rem;
 
-    > a {
-      // display: inline-block;
-      // text-align: center;
-      // font-size: 1.6rem;
-      // line-height: 3rem;
-      // width: 3rem;
-      // height: 3rem;
+      > a {
+        // display: inline-block;
+        // text-align: center;
+        // font-size: 1.6rem;
+        // line-height: 3rem;
+        // width: 3.125rem;
+        // height: 4rem;
+        // padding: .5rem 0;
 
-      &::after {
-        display: none;
+        &::after {
+          display: none;
+        }
       }
     }
-  }
 
-  // li + li {
-  //   margin-top: 0;
-  // }
+    // li + li {
+    //   margin-top: 0;
+    // }
+  }
 }

data/_sass/hydejack/_toc.scss

@@ -1,6 +1,2 @@
 #markdown-toc {
-  @extend .faded;
-  padding-bottom: 1rem;
-  margin-left: -1rem;
-  margin-right: -1rem;
 }

data/_sass/pooleparty/_base-inline.scss

@@ -20,13 +20,14 @@ body {
 }
 
 html {
-  // font-size: $root-font-size;
+  font-size: $root-font-size;
   line-height: $root-line-height;
 }
 
 body {
   color: $body-color;
   background-color: $body-bg;
+  overflow-y: scroll;
 }
 
 // No `:visited` state is required by default (browsers will use `a`)

data/_sass/pooleparty/_base.scss

@@ -20,13 +20,14 @@
 // }
 //
 // html {
-//   // font-size: $root-font-size;
+//   font-size: $root-font-size;
 //   line-height: $root-line-height;
 // }
 //
 // body {
 //   color: $body-color;
 //   background-color: $body-bg;
+//   overflow-y: scroll;
 // }
 //
 // // No `:visited` state is required by default (browsers will use `a`)

data/_sass/pooleparty/_code.scss

@@ -3,18 +3,14 @@
 // Inline and block-level code snippets. Includes tweaks to syntax highlighted
 // snippets from Pygments/Rouge and Gist embeds.
 
-code, pre, .code {
+code, pre {
   font-family: $code-font-family;
 }
 
-code, .code {
+code {
   padding: .25em .5em;
   font-size: .85em;
-  // Could be mistaken for a link if the user choses a similar link-color, so better no colored inline code.
-  // color: $code-color;
-  background-color: #f9f9f9;
-  // No border radius to prevent repaint on code scroll
-  // border-radius: 3px;
+  background-color: rgba(0, 0, 0, 0.03);
 }
 
 pre {
@@ -28,7 +24,7 @@ pre {
   -webkit-overflow-scrolling: touch;
 
   /* Make code same width as regular text, and scroll the full page width on mobile */
-  @include figure();
+  @include pre();
 
   backface-visibility: hidden; // wat?
 }
@@ -46,12 +42,12 @@ figure, .figure {
 
   > *:first-child {
     padding: 1rem;
-    background: #f9f9f9;
+    background-color: rgba(0, 0, 0, 0.05);
   }
 
   > figcaption, > .figcaption {
     font-size: smaller;
-    color: #9a9a9a;
+    color: $gray;
     text-align: center;
     font-style: italic;
     margin-top: 0.5rem;

data/_sass/pooleparty/_footnotes.scss

@@ -6,11 +6,14 @@
 a[href^="#fn:"],
 // Back to footnote link
 a[href^="#fnref:"] {
-  display: inline-block;
   margin-left: .1rem;
   font-weight: bold;
 }
 
+sup {
+  line-height: 1;
+}
+
 // List of footnotes
 .footnotes {
   > ol {
@@ -26,8 +29,3 @@ a[href^="#fnref:"] {
     border-bottom: 1px solid #fff;
   }
 }
-
-// Prevent supscripts from increasing the line height
-sup {
-  line-height: 1;
-}

data/_sass/pooleparty/_message-inline.scss

@@ -6,8 +6,8 @@
 .message {
   margin-bottom: 1rem;
   padding: 1rem;
-  color: #717171;
-  background-color: #f9f9f9;
+  color: $gray-text;
+  background-color: $gray-bg;
   margin-left: -1rem;
   margin-right: -1rem;
 }

data/_sass/pooleparty/_pagination.scss

@@ -20,11 +20,15 @@
 .pagination-item {
   > * {
     display: block;
-    padding: 1rem;
+    padding: .25rem 1rem;
     border: solid #eee;
     border-width: 1px 0;
   }
 
+  > a, > a:hover, > a:focus {
+    border-color: #eee!important;
+  }
+
   &:first-child > * {
     margin-bottom: -1px;
   }
@@ -36,7 +40,7 @@
   }
 }
 
-@media (min-width: 375px + 1px) {
+@media (min-width: 23.5em) {
   .pagination {
     margin: 3rem 0;
   }
@@ -50,13 +54,9 @@
 
     &:first-child > * {
       margin-bottom: 0;
-      border-top-left-radius:    4px;
-      border-bottom-left-radius: 4px;
     }
     &:last-child > * {
       margin-left: -1px;
-      border-top-right-radius:    4px;
-      border-bottom-right-radius: 4px;
     }
   }
 }