basscss-jekyll-theme 0.1.0

data/_sass/basscss-addons/lighten.scss

@@ -0,0 +1,14 @@
+/* Basscss Lighten */
+
+.bg-lighten-1 { background-color: var(--lighten-1) }
+.bg-lighten-2 { background-color: var(--lighten-2) }
+.bg-lighten-3 { background-color: var(--lighten-3) }
+.bg-lighten-4 { background-color: var(--lighten-4) }
+
+:root {
+  --lighten-1: rgba(255, 255, 255, .0625);
+  --lighten-2: rgba(255, 255, 255, .125);
+  --lighten-3: rgba(255, 255, 255, .25);
+  --lighten-4: rgba(255, 255, 255, .5);
+}
+

data/_sass/basscss-addons/media-object.scss

@@ -0,0 +1,53 @@
+/* Basscss Media Object */
+
+.media,
+.sm-media,
+.md-media,
+.lg-media {
+  margin-left: -var(--media-object-space);
+  margin-right: -var(--media-object-space);
+}
+
+.media {
+  display: flex;
+}
+
+.media-center {
+  align-items: center;
+}
+
+.media-bottom {
+  align-items: flex-end;
+}
+
+.media-img,
+.media-body {
+  padding-left: var(--media-object-space);
+  padding-right: var(--media-object-space);
+}
+
+.media-body {
+  flex: 1 1 auto;
+}
+
+@media (--breakpoint-sm) {
+  .sm-media { display: flex }
+}
+
+@media (--breakpoint-md) {
+  .md-media { display: flex }
+}
+
+@media (--breakpoint-lg) {
+  .lg-media { display: flex }
+}
+
+@custom-media --breakpoint-sm (min-width: 40em);
+@custom-media --breakpoint-md (min-width: 52em);
+@custom-media --breakpoint-lg (min-width: 64em);
+
+:root {
+  --space-1: .5rem;
+  --media-object-space: var(--space-1);
+}
+

data/_sass/basscss-addons/progress.scss

@@ -0,0 +1,34 @@
+/* Basscss Progress */
+
+.progress {
+  display: block;
+  width: 100%;
+  height: calc( var(--form-field-height) / 4 );
+  margin: var(--form-field-padding-y) 0;
+  overflow: hidden;
+  background-color: var(--darken-2);
+  border: 0;
+  border-radius: 10000px;
+  -webkit-appearance: none;
+}
+
+.progress::-webkit-progress-bar {
+  -webkit-appearance: none;
+  background-color: var(--darken-2)
+}
+
+.progress::-webkit-progress-value {
+  -webkit-appearance: none;
+  background-color: currentcolor;
+}
+
+.progress::-moz-progress-bar {
+  background-color: currentcolor;
+}
+
+:root {
+  --form-field-height: 2.25rem;
+  --form-field-padding-y: .5rem;
+  --darken-2: rgba(0, 0, 0, .125);
+}
+

data/_sass/basscss-addons/responsive-layout.scss

@@ -0,0 +1,17 @@
+/* Basscss Responsive Layout */
+
+@import "basscss-lib/sm-layout";
+@import "basscss-lib/md-layout";
+@import "basscss-lib/lg-layout";
+
+@custom-media --breakpoint-sm (min-width: 40em);
+@custom-media --breakpoint-md (min-width: 52em);
+@custom-media --breakpoint-lg (min-width: 64em);
+
+:root {
+  --width-1: 24rem;
+  --width-2: 32rem;
+  --width-3: 48rem;
+  --width-4: 64rem;
+}
+

data/_sass/basscss-addons/responsive-margin.scss

@@ -0,0 +1,17 @@
+/* Basscss Responsive Margin */
+
+@import "basscss-lib/sm-margin";
+@import "basscss-lib/md-margin";
+@import "basscss-lib/lg-margin";
+
+@custom-media --breakpoint-sm (min-width: 40em);
+@custom-media --breakpoint-md (min-width: 52em);
+@custom-media --breakpoint-lg (min-width: 64em);
+
+:root {
+  --space-1: .5rem;
+  --space-2: 1rem;
+  --space-3: 2rem;
+  --space-4: 4rem;
+}
+

data/_sass/basscss-addons/responsive-padding.scss

@@ -0,0 +1,17 @@
+/* Basscss Responsive Padding */
+
+@import "basscss-lib/sm-padding";
+@import "basscss-lib/md-padding";
+@import "basscss-lib/lg-padding";
+
+@custom-media --breakpoint-sm (min-width: 40em);
+@custom-media --breakpoint-md (min-width: 52em);
+@custom-media --breakpoint-lg (min-width: 64em);
+
+:root {
+  --space-1: .5rem;
+  --space-2: 1rem;
+  --space-3: 2rem;
+  --space-4: 4rem;
+}
+

data/_sass/basscss-addons/responsive-position.scss

@@ -0,0 +1,10 @@
+/* Basscss Responsive Position */
+
+@import "basscss-lib/sm-position";
+@import "basscss-lib/md-position";
+@import "basscss-lib/lg-position";
+
+@custom-media --breakpoint-sm (min-width: 40em);
+@custom-media --breakpoint-md (min-width: 52em);
+@custom-media --breakpoint-lg (min-width: 64em);
+

data/_sass/basscss-addons/responsive-type-scale.scss

@@ -0,0 +1,21 @@
+/* Basscss Responsive Type Scale */
+
+@import "basscss-lib/sm-type-scale";
+@import "basscss-lib/md-type-scale";
+@import "basscss-lib/lg-type-scale";
+
+@custom-media --breakpoint-sm (min-width: 40em);
+@custom-media --breakpoint-md (min-width: 52em);
+@custom-media --breakpoint-lg (min-width: 64em);
+
+:root {
+  --h00: 4rem;
+  --h0: 3rem;
+  --h1: 2rem;
+  --h2: 1.5rem;
+  --h3: 1.25rem;
+  --h4: 1rem;
+  --h5: .875rem;
+  --h6: .75rem;
+}
+

data/_sass/basscss-addons/responsive-typography.scss

@@ -0,0 +1,11 @@
+/* Basscss Responsive Typography */
+
+@import "basscss-lib/sm-typography";
+@import "basscss-lib/md-typography";
+@import "basscss-lib/lg-typography";
+
+@custom-media --breakpoint-sm (min-width: 40em);
+@custom-media --breakpoint-md (min-width: 52em);
+@custom-media --breakpoint-lg (min-width: 64em);
+
+

data/_sass/basscss-lib/colors-variables.scss

@@ -0,0 +1,33 @@
+/*
+
+   VARIABLES
+
+   - Cool
+   - Warm
+   - Gray Scale
+
+*/
+
+:root {
+
+--aqua:  #7FDBFF;
+--blue:  #0074D9;
+--navy:  #001F3F;
+--teal:  #39CCCC;
+--green: #2ECC40;
+--olive: #3D9970;
+--lime:  #01FF70;
+
+--yellow:  #FFDC00;
+--orange:  #FF851B;
+--red:     #FF4136;
+--fuchsia: #F012BE;
+--purple:  #B10DC9;
+--maroon:  #85144B;
+
+--white:  #FFFFFF;
+--silver: #DDDDDD;
+--gray:   #AAAAAA;
+--black:  #111111;
+
+}

data/_sass/basscss-lib/grid.scss

@@ -0,0 +1,59 @@
+
+.col {
+  float: left;
+  box-sizing: border-box;
+}
+
+.col-right {
+  float: right;
+  box-sizing: border-box;
+}
+
+.col-1 {
+  width: calc(1/12 * 100%);
+}
+
+.col-2 {
+  width: calc(2/12 * 100%);
+}
+
+.col-3 {
+  width: calc(3/12 * 100%);
+}
+
+.col-4 {
+  width: calc(4/12 * 100%);
+}
+
+.col-5 {
+  width: calc(5/12 * 100%);
+}
+
+.col-6 {
+  width: calc(6/12 * 100%);
+}
+
+.col-7 {
+  width: calc(7/12 * 100%);
+}
+
+.col-8 {
+  width: calc(8/12 * 100%);
+}
+
+.col-9 {
+  width: calc(9/12 * 100%);
+}
+
+.col-10 {
+  width: calc(10/12 * 100%);
+}
+
+.col-11 {
+  width: calc(11/12 * 100%);
+}
+
+.col-12 {
+  width: 100%;
+}
+

data/_sass/basscss-lib/lg-grid.scss

@@ -0,0 +1,63 @@
+
+@media (--breakpoint-lg) {
+
+  .lg-col {
+    float: left;
+    box-sizing: border-box;
+  }
+
+  .lg-col-right {
+    float: right;
+    box-sizing: border-box;
+  }
+
+  .lg-col-1 {
+    width: calc(1/12 * 100%);
+  }
+
+  .lg-col-2 {
+    width: calc(2/12 * 100%);
+  }
+
+  .lg-col-3 {
+    width: calc(3/12 * 100%);
+  }
+
+  .lg-col-4 {
+    width: calc(4/12 * 100%);
+  }
+
+  .lg-col-5 {
+    width: calc(5/12 * 100%);
+  }
+
+  .lg-col-6 {
+    width: calc(6/12 * 100%);
+  }
+
+  .lg-col-7 {
+    width: calc(7/12 * 100%);
+  }
+
+  .lg-col-8 {
+    width: calc(8/12 * 100%);
+  }
+
+  .lg-col-9 {
+    width: calc(9/12 * 100%);
+  }
+
+  .lg-col-10 {
+    width: calc(10/12 * 100%);
+  }
+
+  .lg-col-11 {
+    width: calc(11/12 * 100%);
+  }
+
+  .lg-col-12 {
+    width: 100%;
+  }
+
+}
+

data/_sass/basscss-lib/lg-layout.scss

@@ -0,0 +1,18 @@
+
+@media (--breakpoint-lg) {
+
+  .lg-inline       { display: inline }
+  .lg-block        { display: block }
+  .lg-inline-block { display: inline-block }
+  .lg-table        { display: table }
+  .lg-table-cell   { display: table-cell }
+
+  .lg-overflow-hidden { overflow: hidden }
+  .lg-overflow-scroll { overflow: scroll }
+  .lg-overflow-auto   { overflow: auto }
+
+  .lg-left  { float: left }
+  .lg-right { float: right }
+
+}
+

data/_sass/basscss-lib/lg-margin.scss

@@ -0,0 +1,54 @@
+
+@media (--breakpoint-lg) {
+
+  .lg-m0  { margin:        0 }
+  .lg-mt0 { margin-top:    0 }
+  .lg-mr0 { margin-right:  0 }
+  .lg-mb0 { margin-bottom: 0 }
+  .lg-ml0 { margin-left:   0 }
+  .lg-mx0 { margin-left:   0; margin-right:  0 }
+  .lg-my0 { margin-top:    0; margin-bottom: 0 }
+
+  .lg-m1  { margin:        var(--space-1) }
+  .lg-mt1 { margin-top:    var(--space-1) }
+  .lg-mr1 { margin-right:  var(--space-1) }
+  .lg-mb1 { margin-bottom: var(--space-1) }
+  .lg-ml1 { margin-left:   var(--space-1) }
+  .lg-mx1 { margin-left:   var(--space-1); margin-right:  var(--space-1) }
+  .lg-my1 { margin-top:    var(--space-1); margin-bottom: var(--space-1) }
+
+  .lg-m2  { margin:        var(--space-2) }
+  .lg-mt2 { margin-top:    var(--space-2) }
+  .lg-mr2 { margin-right:  var(--space-2) }
+  .lg-mb2 { margin-bottom: var(--space-2) }
+  .lg-ml2 { margin-left:   var(--space-2) }
+  .lg-mx2 { margin-left:   var(--space-2); margin-right:  var(--space-2) }
+  .lg-my2 { margin-top:    var(--space-2); margin-bottom: var(--space-2) }
+
+  .lg-m3  { margin:        var(--space-3) }
+  .lg-mt3 { margin-top:    var(--space-3) }
+  .lg-mr3 { margin-right:  var(--space-3) }
+  .lg-mb3 { margin-bottom: var(--space-3) }
+  .lg-ml3 { margin-left:   var(--space-3) }
+  .lg-mx3 { margin-left:   var(--space-3); margin-right:  var(--space-3) }
+  .lg-my3 { margin-top:    var(--space-3); margin-bottom: var(--space-3) }
+
+  .lg-m4  { margin:        var(--space-4) }
+  .lg-mt4 { margin-top:    var(--space-4) }
+  .lg-mr4 { margin-right:  var(--space-4) }
+  .lg-mb4 { margin-bottom: var(--space-4) }
+  .lg-ml4 { margin-left:   var(--space-4) }
+  .lg-mx4 { margin-left:   var(--space-4); margin-right:  var(--space-4) }
+  .lg-my4 { margin-top:    var(--space-4); margin-bottom: var(--space-4) }
+
+  .lg-mxn1 { margin-left: -var(--space-1); margin-right: -var(--space-1); }
+  .lg-mxn2 { margin-left: -var(--space-2); margin-right: -var(--space-2); }
+  .lg-mxn3 { margin-left: -var(--space-3); margin-right: -var(--space-3); }
+  .lg-mxn4 { margin-left: -var(--space-4); margin-right: -var(--space-4); }
+
+  .lg-ml-auto { margin-left:  auto }
+  .lg-mr-auto { margin-right: auto }
+  .lg-mx-auto { margin-left: auto; margin-right: auto; }
+
+}
+

data/_sass/basscss-lib/lg-padding.scss

@@ -0,0 +1,45 @@
+
+@media (--breakpoint-lg) {
+
+  .lg-p0  { padding:        0 }
+  .lg-pt0 { padding-top:    0 }
+  .lg-pr0 { padding-right:  0 }
+  .lg-pb0 { padding-bottom: 0 }
+  .lg-pl0 { padding-left:   0 }
+  .lg-px0 { padding-left:   0; padding-right:  0 }
+  .lg-py0 { padding-top:    0; padding-bottom: 0 }
+
+  .lg-p1  { padding:        var(--space-1) }
+  .lg-pt1 { padding-top:    var(--space-1) }
+  .lg-pr1 { padding-right:  var(--space-1) }
+  .lg-pb1 { padding-bottom: var(--space-1) }
+  .lg-pl1 { padding-left:   var(--space-1) }
+  .lg-px1 { padding-left:   var(--space-1); padding-right:  var(--space-1) }
+  .lg-py1 { padding-top:    var(--space-1); padding-bottom: var(--space-1) }
+
+  .lg-p2  { padding:        var(--space-2) }
+  .lg-pt2 { padding-top:    var(--space-2) }
+  .lg-pr2 { padding-right:  var(--space-2) }
+  .lg-pb2 { padding-bottom: var(--space-2) }
+  .lg-pl2 { padding-left:   var(--space-2) }
+  .lg-px2 { padding-left:   var(--space-2); padding-right:  var(--space-2) }
+  .lg-py2 { padding-top:    var(--space-2); padding-bottom: var(--space-2) }
+
+  .lg-p3  { padding:        var(--space-3) }
+  .lg-pt3 { padding-top:    var(--space-3) }
+  .lg-pr3 { padding-right:  var(--space-3) }
+  .lg-pb3 { padding-bottom: var(--space-3) }
+  .lg-pl3 { padding-left:   var(--space-3) }
+  .lg-px3 { padding-left:   var(--space-3); padding-right:  var(--space-3) }
+  .lg-py3 { padding-top:    var(--space-3); padding-bottom: var(--space-3) }
+
+  .lg-p4  { padding:        var(--space-4) }
+  .lg-pt4 { padding-top:    var(--space-4) }
+  .lg-pr4 { padding-right:  var(--space-4) }
+  .lg-pb4 { padding-bottom: var(--space-4) }
+  .lg-pl4 { padding-left:   var(--space-4) }
+  .lg-px4 { padding-left:   var(--space-4); padding-right:  var(--space-4) }
+  .lg-py4 { padding-top:    var(--space-4); padding-bottom: var(--space-4) }
+
+}
+