jekyll-theme-basically-basic 1.3.1 → 1.4.0

data/_sass/basically-basic/_functions.scss

@@ -1,2 +1,2 @@
-@import "functions/color";
-@import "functions/fluid-type";
+@import "functions/color";
+@import "functions/fluid-type";

data/_sass/basically-basic/_global.scss

@@ -1,42 +1,116 @@
-/* ==========================================================================
-   Site-wide
-   ========================================================================== */
-
-.site-title {
-  @include fluid-type($min-vw, $max-vw, 20px, 24px);
-  margin: 0;
-  padding: 1.8125rem 1rem;
-  padding-right: calc(
-    10vw + (2 * #{$navicon-width})
-  ); /* make room for sidebar toggle */
-  font-family: $base-font-family;
-  font-weight: bold;
-  line-height: 1;
-
-  @include breakpoint($medium) {
-    padding-left: 2rem;
-  }
-
-  @include breakpoint($large) {
-    padding-left: 5vw;
-  }
-
-  a {
-    display: -ms-flexbox;
-    display: -webkit-box;
-    display: flex;
-    -ms-flex-align: center;
-    -webkit-box-align: center;
-    align-items: center;
-    min-height: $site-image-height;
-    color: $text-color;
-    text-decoration: none;
-  }
-}
-
-.site-logo {
-  width: $site-image-width;
-  height: $site-image-height;
-  margin-right: 0.5rem;
-  border-radius: 50%;
-}
+/* ==========================================================================
+   Site-wide
+   ========================================================================== */
+
+.site-title {
+  @include fluid-type($min-vw, $max-vw, 20px, 24px);
+  margin: 0;
+  padding: 1.8125rem 1rem;
+  padding-right: calc(
+    10vw + (2 * #{$navicon-width})
+  ); /* make room for sidebar toggle */
+  font-family: $base-font-family;
+  font-weight: bold;
+  line-height: 1;
+
+  @include breakpoint($medium) {
+    padding-left: 2rem;
+  }
+
+  @include breakpoint($large) {
+    padding-left: 5vw;
+  }
+
+  a {
+    display: -ms-flexbox;
+    display: -webkit-box;
+    display: flex;
+    -ms-flex-align: center;
+    -webkit-box-align: center;
+    align-items: center;
+    min-height: $site-image-height;
+    color: $text-color;
+    text-decoration: none;
+  }
+}
+
+.site-logo {
+  width: $site-image-width;
+  height: $site-image-height;
+  margin-right: 0.5rem;
+  border-radius: 50%;
+}
+
+.more-link {
+  font-weight: bold;
+  text-decoration: none;
+}
+
+.back-to-top {
+  display: block;
+  color: lighten($text-color, 50%);
+  font-size: 0.75em;
+  text-transform: uppercase;
+  text-align: right;
+  text-decoration: none;
+}
+
+.taxonomy-section {
+  margin-bottom: 2em;
+  padding-bottom: 1em;
+
+  &:not(:last-child) {
+    border-bottom: solid 1px $border-color;
+  }
+
+  + .taxonomy-section {
+    margin-top: 2em;
+  }
+}
+
+.taxonomy-title {
+  @include fluid-type($min-vw, $max-vw, 28px, 32px);
+  margin-bottom: 0.5em;
+  color: lighten($text-color, 60%);
+  font-family: $base-font-family;
+}
+
+.taxonomy-count {
+  color: lighten($text-color, 50%);
+}
+
+.taxonomy-index {
+  display: grid;
+  grid-column-gap: 2em;
+  grid-template-columns: repeat(2, 1fr);
+  margin: 0;
+  padding: 0;
+  font-family: $base-font-family;
+  font-size: 0.9em;
+  list-style: none;
+
+  @include breakpoint($large) {
+    grid-template-columns: repeat(3, 1fr);
+  }
+
+  a {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    padding: 0.25em 0;
+    -webkit-box-pack: justify;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+    color: inherit;
+    text-decoration: none;
+    border-bottom: 1px solid $border-color;
+
+    &:hover {
+      color: $accent-color;
+    }
+  }
+
+  + .taxonomy-section {
+    margin-top: 3em;
+  }
+}

data/_sass/basically-basic/_icons.scss

@@ -1,43 +1,43 @@
-/* ==========================================================================
-   Icons
-   ========================================================================== */
-
-.icon {
-  display: inline-block;
-  position: relative;
-  top: -0.05em; /* fine-tune alignment */
-  width: 1em;
-  height: 1em;
-  line-height: 1;
-  vertical-align: middle;
-  fill: currentColor;
-
-  $icons: (
-    (bitbucket, #205081),
-    (codepen, #000),
-    (dribbble, #ea4c89),
-    (email, #000),
-    (facebook, #3b5998),
-    (flickr, #0063dc),
-    (github, #181717),
-    (gitlab, #e24329),
-    (googleplus, #dc4e41),
-    (instagram, #e4405f),
-    (lastfm, #d51007),
-    (linkedin, #0077b5),
-    (pinterest, #bd081c),
-    (rss, #ffa500),
-    (soundcloud, #f30),
-    (stackoverflow, #fe7a16),
-    (tumblr, #36465d),
-    (twitter, #1da1f2),
-    (xing, #005a5f),
-    (youtube, #cd201f)
-  );
-
-  @each $icon, $color in $icons {
-    &--#{$icon} {
-      fill: $color;
-    }
-  }
-}
+/* ==========================================================================
+   Icons
+   ========================================================================== */
+
+.icon {
+  display: inline-block;
+  position: relative;
+  top: -0.05em; /* fine-tune alignment */
+  width: 1em;
+  height: 1em;
+  line-height: 1;
+  vertical-align: middle;
+  fill: currentColor;
+
+  $icons: (
+    (bitbucket, #205081),
+    (codepen, #000),
+    (dribbble, #ea4c89),
+    (email, #000),
+    (facebook, #3b5998),
+    (flickr, #0063dc),
+    (github, #181717),
+    (gitlab, #e24329),
+    (googleplus, #dc4e41),
+    (instagram, #e4405f),
+    (lastfm, #d51007),
+    (linkedin, #0077b5),
+    (pinterest, #bd081c),
+    (rss, #ffa500),
+    (soundcloud, #f30),
+    (stackoverflow, #fe7a16),
+    (tumblr, #36465d),
+    (twitter, #1da1f2),
+    (xing, #005a5f),
+    (youtube, #cd201f)
+  );
+
+  @each $icon, $color in $icons {
+    &--#{$icon} {
+      fill: $color;
+    }
+  }
+}

data/_sass/basically-basic/_intro.scss

@@ -19,7 +19,9 @@
     right: 0;
     bottom: 0;
     left: 0;
-    background-color: rgba($accent-color, 0.25);
+    @if $intro-image-color-overlay == true {
+      background-color: rgba($accent-color, 0.25);
+    };
     content: '';
   }
 

data/_sass/basically-basic/_layout.scss

@@ -1,188 +1,188 @@
-/* ==========================================================================
-   Layout
-   ========================================================================== */
-
-.canvas {
-  position: relative;
-  width: 100%;
-  overflow: hidden;
-}
-
-.wrapper {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  min-height: 100vh;
-  transform: translateX(0);
-  transition: $global-transition;
-  background-color: $background-color;
-  z-index: 100;
-  -webkit-backface-visibility: hidden;
-  backface-visibility: hidden;
-}
-
-.intro,
-main {
-  > .inner {
-    padding: 0 0.5rem;
-
-    @include breakpoint($small) {
-      padding-right: 1rem;
-      padding-left: 1rem;
-    }
-
-    @include breakpoint($medium) {
-      padding-right: 2rem;
-      padding-left: 2rem;
-    }
-
-    @include breakpoint($large) {
-      padding-right: 3rem;
-      padding-left: 3rem;
-    }
-
-    @include breakpoint($xlarge) {
-      padding-right: 4rem;
-      padding-left: 4rem;
-    }
-  }
-}
-
-main {
-  section {
-    margin-left: auto;
-    margin-right: auto;
-    max-width: 100%;
-  }
-}
-
-.inner {
-  max-width: $large;
-}
-
-/*
-   Layout specific adjustments
-   ========================================================================== */
-
-.layout--post,
-.layout--page {
-  .entry-content {
-    @include breakpoint($large) {
-      width: span(14 of 16);
-    }
-  }
-}
-
-.layout--about {
-  .entry-wrap {
-    display: -ms-flexbox;
-    display: flex;
-    -ms-flex-wrap: wrap;
-    flex-wrap: wrap;
-
-    @include breakpoint($medium) {
-      -ms-flex-wrap: nowrap;
-      flex-wrap: nowrap;
-    }
-  }
-
-  .entry-content {
-    @include breakpoint($medium) {
-      -ms-flex: 1;
-      flex: 1;
-    }
-  }
-
-  .entry-sidebar {
-    order: -1;
-    -ms-flex-order: -1;
-
-    @include breakpoint($medium) {
-      order: initial;
-      -ms-flex-order: initial;
-    }
-
-    .author-picture {
-      margin: 0 0 2rem;
-      border-radius: 2 * $border-radius;
-
-      @include breakpoint($medium) {
-        margin: 0 0 0 2rem;
-      }
-    }
-  }
-}
-
-.layout--cv {
-  .entries {
-    .entry-header {
-      @include breakpoint($medium) {
-        width: span(5 of 16);
-        padding-right: gutter(1 of 16);
-
-        /* remove space after last child element */
-        > *:last-child {
-          margin-bottom: 0;
-        }
-      }
-    }
-
-    .entry-content {
-      @include breakpoint($medium) {
-        float: right;
-        width: span(11 of 16);
-      }
-    }
-  }
-
-  .entry {
-    a {
-      color: $accent-color;
-    }
-
-    address {
-      font-style: normal;
-    }
-
-    .title,
-    .position,
-    .institution,
-    .language {
-      margin-bottom: 0;
-    }
-
-    .date {
-      margin-bottom: 1rem;
-      color: tint($text-color, 40%);
-      font-family: $monospace-font-family;
-      font-size: 80%;
-    }
-
-    .courses-title,
-    .awarder,
-    .publisher,
-    .level {
-      margin: 1rem 0 0;
-    }
-
-    .courses,
-    .keywords {
-      @include list-unstyled;
-    }
-  }
-
-  .taxonomy {
-    + .taxonomy {
-      margin-top: 0.5rem;
-    }
-
-    .title {
-      display: inline-block;
-      margin-right: 1rem;
-    }
-
-    .keywords {
-      display: inline-block;
-    }
-  }
-}
+/* ==========================================================================
+   Layout
+   ========================================================================== */
+
+.canvas {
+  position: relative;
+  width: 100%;
+  overflow: hidden;
+}
+
+.wrapper {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  min-height: 100vh;
+  transform: translateX(0);
+  transition: $global-transition;
+  background-color: $background-color;
+  z-index: 100;
+  -webkit-backface-visibility: hidden;
+  backface-visibility: hidden;
+}
+
+.intro,
+main {
+  > .inner {
+    padding: 0 0.5rem;
+
+    @include breakpoint($small) {
+      padding-right: 1rem;
+      padding-left: 1rem;
+    }
+
+    @include breakpoint($medium) {
+      padding-right: 2rem;
+      padding-left: 2rem;
+    }
+
+    @include breakpoint($large) {
+      padding-right: 3rem;
+      padding-left: 3rem;
+    }
+
+    @include breakpoint($xlarge) {
+      padding-right: 4rem;
+      padding-left: 4rem;
+    }
+  }
+}
+
+main {
+  section {
+    margin-left: auto;
+    margin-right: auto;
+    max-width: 100%;
+  }
+}
+
+.inner {
+  max-width: $large;
+}
+
+/*
+   Layout specific adjustments
+   ========================================================================== */
+
+.layout--post,
+.layout--page {
+  .entry-content {
+    @include breakpoint($large) {
+      width: span(14 of 16);
+    }
+  }
+}
+
+.layout--about {
+  .entry-wrap {
+    display: -ms-flexbox;
+    display: flex;
+    -ms-flex-wrap: wrap;
+    flex-wrap: wrap;
+
+    @include breakpoint($medium) {
+      -ms-flex-wrap: nowrap;
+      flex-wrap: nowrap;
+    }
+  }
+
+  .entry-content {
+    @include breakpoint($medium) {
+      -ms-flex: 1;
+      flex: 1;
+    }
+  }
+
+  .entry-sidebar {
+    order: -1;
+    -ms-flex-order: -1;
+
+    @include breakpoint($medium) {
+      order: initial;
+      -ms-flex-order: initial;
+    }
+
+    .author-picture {
+      margin: 0 0 2rem;
+      border-radius: 2 * $border-radius;
+
+      @include breakpoint($medium) {
+        margin: 0 0 0 2rem;
+      }
+    }
+  }
+}
+
+.layout--cv {
+  .entries {
+    .entry-header {
+      @include breakpoint($medium) {
+        width: span(5 of 16);
+        padding-right: gutter(1 of 16);
+
+        /* remove space after last child element */
+        > *:last-child {
+          margin-bottom: 0;
+        }
+      }
+    }
+
+    .entry-content {
+      @include breakpoint($medium) {
+        float: right;
+        width: span(11 of 16);
+      }
+    }
+  }
+
+  .entry {
+    a {
+      color: $accent-color;
+    }
+
+    address {
+      font-style: normal;
+    }
+
+    .title,
+    .position,
+    .institution,
+    .language {
+      margin-bottom: 0;
+    }
+
+    .date {
+      margin-bottom: 1rem;
+      color: tint($text-color, 40%);
+      font-family: $monospace-font-family;
+      font-size: 80%;
+    }
+
+    .courses-title,
+    .awarder,
+    .publisher,
+    .level {
+      margin: 1rem 0 0;
+    }
+
+    .courses,
+    .keywords {
+      @include list-unstyled;
+    }
+  }
+
+  .taxonomy {
+    + .taxonomy {
+      margin-top: 0.5rem;
+    }
+
+    .title {
+      display: inline-block;
+      margin-right: 1rem;
+    }
+
+    .keywords {
+      display: inline-block;
+    }
+  }
+}