alembic-jekyll-theme 2.0.2 → 2.0.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 8d15229ed503c602eb02d030a471df0614ad9c0c
-  data.tar.gz: 9f5135283f74917bdd690977d27ea4fc95076c43
+  metadata.gz: c993d2ae7f40d0adfdbf57c4d75bb28f5ed84c01
+  data.tar.gz: 074dc4a66dd1d70ffa27420bb321d77e7b83dade
 SHA512:
-  metadata.gz: 84f1f68866d0250febd7a0beb37e7cfa6b9aa4b14570722098ea007afc31b6de008e936e26dd9f14d8790b96fb93e8b24009c405ae5b7c57bc74ed7ff681fb73
-  data.tar.gz: cba5a0151614c046ad4f604054fb9948de40679c3b57830cd1e18053914351df80ad71e0d7af35f026d0d2d3554899ed530bb5bc111d46f458e1fa3d0a3bc5db
+  metadata.gz: bbdddc61fd81818e135d44763916d6bb27c22fce0d7b305780a57ed3e65415a68ad11102f830c8666a53299e56218886082a76657389aa3f0fedee92742b6d58
+  data.tar.gz: 3b24bb67b9a348b01699ce8754447883bf312e32d3d40059c350ee5713af27f53dfd0c268d8473e68d1cbfbf5bf5c9968564899efb4ceb6ca070e5a71db1abae

data/README.md

@@ -61,8 +61,8 @@ Here are a few examples of Alembic out in the wild being used in a variety of wa
 
 1. [Fork the repo](https://github.com/daviddarnes/alembic#fork-destination-box)
 2. Clone down the repo with `$ git clone git@github.com:username/reponame.git`
-3. Delete the following unnecessary files/folders: `demo/`, `CODE_OF_CONDUCT.md`, `CONTRIBUTING.md`, `LICENSE`, `screenshot.png`
-4. Change the `placeholder-logo.svg` and `placeholder-social.png` in the `assets/` folder to your own branding
+3. Delete the following unnecessary files/folders: `demo/`, `CODE_OF_CONDUCT.md`, `CONTRIBUTING.md`, `LICENSE`, `screenshot.png` and `alembic-jekyll-theme.gemspec`
+4. Change the `logo.svg` and `default-social-image.png` in the `assets/` folder to your own branding
 5. Configure your site settings using the `_config.yml`, more info can be found in [Configuration](#configuration)
 5. Change the `CNAME` record to your projects' record
 6. Install bundler with `$ gem install bundler`
@@ -74,7 +74,7 @@ Here are a few examples of Alembic out in the wild being used in a variety of wa
 
 1. Download the starter `/demo` content, [quick download link](https://minhaskamal.github.io/DownGit/#/home?url=https://github.com/daviddarnes/alembic/tree/master/demo)
 2. Configure your site settings using the `_config.yml`, more info can be found in [Configuration](#configuration)
-3. Create a `placeholder-logo.svg` and `placeholder-social.png` in a new `assets/` folder
+3. Create a `logo.svg` and `default-social-image.png` in a new `assets/` folder
 4. Install bundler with `$ gem install bundler`
 5. Install gems with `$ bundle install`
 6. Run Jekyll with `$ bundle exec jekyll serve --watch`
@@ -94,7 +94,7 @@ There's a number of settings you'll need to change before you can start hacking
 `twitter`, `author` and `social` values will need to be changed to the projects' social information or removed. Look for the `Gem settings` comment within the `/_config.yml` file. These values are for the [jekyll-seo-tag](https://github.com/jekyll/jekyll-seo-tag) - follow the link to find out more.
 
 ### Site settings
-You'll need to change the `description`, `title` and `url` to match with the project. You'll also need to replace the `/assets/placeholder-logo.svg` `/assets/placeholder-social.png` with project logo and default social image. The `email` needs to be changed to the email you want to receive contact form enquires with. The `disqus` value should be changed to your project username on [Disqus](https://disqus.com). Look for the `Site settings` comment within the `/_config.yml` file. The `repo` setting is optional, for now, and can be removed entirely, if you wish.
+You'll need to change the `description`, `title` and `url` to match with the project. You'll also need to replace the `/assets/logo.svg` `/assets/default-social-image.png` with the project logo and default social image. The `email` needs to be changed to the email you want to receive contact form enquires with. The `disqus` value should be changed to your project username on [Disqus](https://disqus.com). Look for the `Site settings` comment within the `/_config.yml` file. The `repo` setting is optional, for now, and can be removed entirely, if you wish.
 
 ### Site navigation
 There are a total of 4 different navigation types:

data/_includes/nav-categories.html

@@ -1,7 +1,7 @@
 <nav class="nav  nav--categories">
   <ul class="list  list--categories">
     {% for item in site.categories %}
-      <li class="item">
+      <li class="item  item--category">
           <a href="#{{ item | first | slugify }}" title="Category - {{ item | first }}">{{ item | first }}</a>
       </li>
     {% endfor %}

data/_includes/nav-header.html

@@ -1,6 +1,6 @@
 {% if site.navigation_header %}
 <nav class="nav  nav--header">
-  <button class="button  button--nav">
+  <button class="button  button--nav" aria-label="Nav toggle">
     {% include icon.html id="nav" %}
   </button>
   <ul class="list  list--nav">
@@ -15,9 +15,9 @@
   {% include nav-default.html %}
 {% endif %}
 <script type="text/javascript">
-const applyToggle = (list, button, breakpoint, itemCount) => {
+const applyToggle = (list, button, breakpoint) => {
   const navList = document.querySelector(list)
-  if (document.body.clientWidth < breakpoint && navList.childElementCount >= itemCount) {
+  if (document.body.clientWidth < breakpoint) {
     const navHeight = navList.clientHeight
     const navButton = document.querySelector(button)
     navList.style.maxHeight = '0px'
@@ -32,5 +32,5 @@ const applyToggle = (list, button, breakpoint, itemCount) => {
   }
 }
 
-applyToggle('.list--nav', '.button', 640, 6)
+applyToggle('.list--nav', '.button', 640)
 </script>

data/_includes/nav-social.html

@@ -1,7 +1,7 @@
 <nav class="nav  nav--social">
   {% for link in site.social_links %}
     {% assign id = link[0] | downcase %}
-    <a class="link" href="{{ link[1] }}" title="{{ link[0] }}">
+    <a href="{{ link[1] }}" title="{{ link[0] }}">
       {% include icon.html id=id title=id %}
     </a>
   {% endfor %}

data/assets/logo.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60" viewBox="0 0 160 160" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><radialGradient id="c" cx="35.06%" r="49.91%" fx="35.06%" fy="50%"><stop stop-color="#FFFFFF" stop-opacity="0" offset="0%"/><stop stop-color="#EAEAEA" stop-opacity=".3" offset="100%"/></radialGradient><path id="a" d="M67.5 22.17A34.95 34.95 0 1 1 47.52 2.32l.06.04c.56.21 1.12.44 1.66.69l49.82 20.83c.52.22.77.81.58 1.33l-2.21 5.9c-.2.51-.78.79-1.3.62L67.5 22.17z"/><filter id="d" width="200%" height="200%" x="-50%" y="-50%" filterUnits="objectBoundingBox"><feOffset dx="8" dy="6" in="SourceAlpha" result="shadowOffsetInner1"/><feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"/><feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.4 0" in="shadowInnerInner1"/></filter><mask id="e" width="99.71" height="69.9" x="0" y="0" fill="white"><use xlink:href="#a"/></mask><path id="b" d="M50.45 6H33v24a2 2 0 0 1-2 2h-2a2 2 0 0 1-2-2v-9H7.73l-1.66 9.04A2.49 2.49 0 0 1 3.7 32H1.9a1.6 1.6 0 0 1-1.65-1.96L4.66 6H1.99A2 2 0 0 1 0 4V2a2 2 0 0 1 2-2h57a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2h-2.73l4.42 24.04A1.6 1.6 0 0 1 59.04 32h-1.81a2.5 2.5 0 0 1-2.37-1.96L53.2 21H37a2 2 0 0 1-2-2v-2c0-1.1.9-2 2-2h15.1l-1.65-9zM10.48 6l-1.65 9H27V6H10.48z"/><mask id="f" width="61" height="32" x="0" y="0" fill="white"><use xlink:href="#b"/></mask></defs><g fill="none" fill-rule="evenodd" transform="translate(34 36)"><path fill="#05BF85" d="M34.95 69.9A34.95 34.95 0 0 0 69.9 34.95c0-3.33-69.9-3.33-69.9 0A34.95 34.95 0 0 0 34.95 69.9z"/><ellipse cx="34.95" cy="34.95" fill="#06E29D" rx="34.95" ry="3.88"/><circle cx="29" cy="44" r="2" fill="#FFFFFF" fill-opacity=".4"/><circle cx="41.5" cy="53.5" r=".5" fill="#FFFFFF" fill-opacity=".4"/><circle cx="39.5" cy="47.5" r="1.5" fill="#FFFFFF" fill-opacity=".4"/><circle cx="24.5" cy="52.5" r="1.5" fill="#FFFFFF" fill-opacity=".4"/><circle cx="32" cy="51" r="1" fill="#FFFFFF" fill-opacity=".4"/><circle cx="45" cy="42" r="1" fill="#FFFFFF" fill-opacity=".4"/><use fill="url(#c)" xlink:href="#a"/><use fill="black" filter="url(#d)" xlink:href="#a"/><use stroke="#9C9C9C" stroke-opacity=".3" stroke-width="2" mask="url(#e)" xlink:href="#a"/><g fill="#414141" stroke="#131111" stroke-width="2" transform="translate(4 57)"><use mask="url(#f)" xlink:href="#b"/></g></g></svg>

data/assets/styles.scss

@@ -34,12 +34,14 @@ body {
   .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);
     }
@@ -53,7 +55,6 @@ body {
   background: $featureBackgroundColour;
   background-size: cover;
   background-position: center;
-  @include flexbox;
   .container {
     min-height: 35vh;
     max-width: 60%;
@@ -65,9 +66,21 @@ body {
 .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;
   }
 }
 
@@ -95,17 +108,12 @@ body {
 }
 
 
-// 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 {
@@ -133,24 +141,16 @@ body {
 }
 
 .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%;
@@ -179,36 +179,23 @@ body {
 
 // 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;
@@ -223,16 +210,10 @@ body {
 
 
 // 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;
   }
 }
 
@@ -243,11 +224,7 @@ body {
   fill: CurrentColor;
 }
 
-svg {
-  width: 100%;
-  height: 100%;
-}
-
+// Media content
 img {
   max-width: 100%;
   height: auto;
@@ -255,20 +232,16 @@ img {
 
 .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;
@@ -322,20 +295,6 @@ select {
   }
 }
 
-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 {
@@ -343,16 +302,15 @@ button,
   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);
   }
 }
 
@@ -381,6 +339,7 @@ select {
   &:focus,
   &:hover:focus {
     outline: solid .12rem $focusColour;
+    outline-offset: -.12rem;
   }
 }
 

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: alembic-jekyll-theme
 version: !ruby/object:Gem::Version
-  version: 2.0.2
+  version: 2.0.3
 platform: ruby
 authors:
 - David Darnes
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2017-05-14 00:00:00.000000000 Z
+date: 2017-05-21 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -188,8 +188,8 @@ files:
 - _sass/sassline-base/_reset.scss
 - _sass/sassline-base/_typography.scss
 - _sass/sassline-base/_variables.scss
-- assets/placeholder-logo.svg
-- assets/placeholder-social.png
+- assets/default-social-image.png
+- assets/logo.svg
 - assets/scripts/fetch.js
 - assets/search.json
 - assets/styles.scss

data/assets/placeholder-logo.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 160" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><radialGradient id="c" cx="35.06%" r="49.91%" fx="35.06%" fy="50%"><stop stop-color="#FFFFFF" stop-opacity="0" offset="0%"/><stop stop-color="#EAEAEA" stop-opacity=".3" offset="100%"/></radialGradient><path id="a" d="M67.5 22.17A34.95 34.95 0 1 1 47.52 2.32l.06.04c.56.21 1.12.44 1.66.69l49.82 20.83c.52.22.77.81.58 1.33l-2.21 5.9c-.2.51-.78.79-1.3.62L67.5 22.17z"/><filter id="d" width="200%" height="200%" x="-50%" y="-50%" filterUnits="objectBoundingBox"><feOffset dx="8" dy="6" in="SourceAlpha" result="shadowOffsetInner1"/><feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"/><feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.4 0" in="shadowInnerInner1"/></filter><mask id="e" width="99.71" height="69.9" x="0" y="0" fill="white"><use xlink:href="#a"/></mask><path id="b" d="M50.45 6H33v24a2 2 0 0 1-2 2h-2a2 2 0 0 1-2-2v-9H7.73l-1.66 9.04A2.49 2.49 0 0 1 3.7 32H1.9a1.6 1.6 0 0 1-1.65-1.96L4.66 6H1.99A2 2 0 0 1 0 4V2a2 2 0 0 1 2-2h57a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2h-2.73l4.42 24.04A1.6 1.6 0 0 1 59.04 32h-1.81a2.5 2.5 0 0 1-2.37-1.96L53.2 21H37a2 2 0 0 1-2-2v-2c0-1.1.9-2 2-2h15.1l-1.65-9zM10.48 6l-1.65 9H27V6H10.48z"/><mask id="f" width="61" height="32" x="0" y="0" fill="white"><use xlink:href="#b"/></mask></defs><g fill="none" fill-rule="evenodd" transform="translate(34 36)"><path fill="#05BF85" d="M34.95 69.9A34.95 34.95 0 0 0 69.9 34.95c0-3.33-69.9-3.33-69.9 0A34.95 34.95 0 0 0 34.95 69.9z"/><ellipse cx="34.95" cy="34.95" fill="#06E29D" rx="34.95" ry="3.88"/><circle cx="29" cy="44" r="2" fill="#FFFFFF" fill-opacity=".4"/><circle cx="41.5" cy="53.5" r=".5" fill="#FFFFFF" fill-opacity=".4"/><circle cx="39.5" cy="47.5" r="1.5" fill="#FFFFFF" fill-opacity=".4"/><circle cx="24.5" cy="52.5" r="1.5" fill="#FFFFFF" fill-opacity=".4"/><circle cx="32" cy="51" r="1" fill="#FFFFFF" fill-opacity=".4"/><circle cx="45" cy="42" r="1" fill="#FFFFFF" fill-opacity=".4"/><use fill="url(#c)" xlink:href="#a"/><use fill="black" filter="url(#d)" xlink:href="#a"/><use stroke="#9C9C9C" stroke-opacity=".3" stroke-width="2" mask="url(#e)" xlink:href="#a"/><g fill="#414141" stroke="#131111" stroke-width="2" transform="translate(4 57)"><use mask="url(#f)" xlink:href="#b"/></g></g></svg>