minima-gutenberg 0.1.0

data/_sass/gutenberg/modules/_anchor.scss

@@ -0,0 +1,34 @@
+/* Links
+   ========================================================================== */
+
+$color-link-normal: $color-font-body;
+$color-link-hover: $color-font-body;
+$color-link-active: #f00;
+$color-link-visited: $color-font-light;
+
+a {
+  background: transparent;
+  color: $color-link-normal;
+  transition: all .3s;
+
+  &:active,
+  &:hover {
+    outline: 0;
+  }
+
+  &:hover {
+    color: $color-link-hover;
+  }
+
+  &:visited {
+    color: $color-link-visited;
+
+    &:hover {
+      color: $color-link-hover;
+    }
+  }
+
+  &:active {
+    color: $color-link-active;
+  }
+}

data/_sass/gutenberg/modules/_article.scss

@@ -0,0 +1,11 @@
+article {
+  display: block;
+  margin: 0 auto;
+  width: 80%;
+
+  @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+    max-width: #{1.5 * $max-width * $base-desktop + 'px'};
+    max-width: #{1.5 * $max-width + 'rem'};
+  }
+
+}

data/_sass/gutenberg/modules/_audio.scss

@@ -0,0 +1,10 @@
+audio {
+  display: inline-block;
+  vertical-align: baseline;
+
+  &:not([controls]) {
+    display: none;
+    height: 0;
+  }
+
+}

data/_sass/gutenberg/modules/_canvas.scss

@@ -0,0 +1,4 @@
+canvas {
+  display: inline-block;
+  vertical-align: baseline;
+}

data/_sass/gutenberg/modules/_code.scss

@@ -0,0 +1,28 @@
+// Contain overflow in all browsers.
+pre {
+  overflow: auto;
+}
+
+// Address odd `em`-unit font size rendering in all browsers.
+code,
+kbd,
+pre,
+samp {
+  font-family: monospace, monospace;
+}
+
+code {
+  @include padding-equal(1);
+
+  display: block;
+
+  @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+    $leading: $leading-desktop;
+    $leading-rem: $leading-rem-desktop;
+
+    @import '../mixins/padding';
+
+    @include padding-equal(1);
+  }
+
+}

data/_sass/gutenberg/modules/_details.scss

@@ -0,0 +1,7 @@
+details {
+  display: block;
+}
+
+summary {
+  display: block;
+}

data/_sass/gutenberg/modules/_figure.scss

@@ -0,0 +1,83 @@
+figcaption {
+  @include line-height(1);
+  color: $color-font-figcaption;
+  display: block;
+  font-size: .8125rem;
+  font-style: italic;
+  margin-bottom: 0;
+  text-align: center;
+
+  @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+    $leading: $leading-desktop;
+    $leading-rem: $leading-rem-desktop;
+
+    @import '../mixins/line-height';
+
+    @include line-height(1);
+    margin-bottom: 0;
+  }
+
+}
+
+figure {
+  display: block;
+}
+
+figure.floatLeft,
+figure.floatRight {
+
+  @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+    $leading: $leading-desktop;
+    $leading-rem: $leading-rem-desktop;
+
+    @import '../mixins/margin';
+    @import '../mixins/padding';
+
+    max-width: #{.5 * $max-width * $base-desktop + 'px'};
+    max-width: #{.5 * $max-width + 'rem'};
+
+    @if $paragraph-indent == true {
+      @include padding-equal(1);
+      @include margin-bottom(0);
+    } @else {
+      @include padding(0, 1);
+    }
+
+  }
+
+  blockquote {
+
+    @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+      $leading: $leading-desktop;
+      $leading-rem: $leading-rem-desktop;
+
+      @import '../mixins/margin';
+      @import '../mixins/padding';
+
+      @include padding-equal(0);
+      text-align: left;
+
+      @if $paragraph-indent == true {
+        @include margin-top(1);
+      }
+
+    }
+
+    p {
+
+      @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+        $leading: $leading-desktop;
+        $leading-rem: $leading-rem-desktop;
+
+        @import '../mixins/font-size';
+        @import '../mixins/line-height';
+
+        @include font-size(1.2);
+        @include line-height(1);
+      }
+
+    }
+
+  }
+
+}

data/_sass/gutenberg/modules/_form.scss

@@ -0,0 +1,3 @@
+input {
+
+}

data/_sass/gutenberg/modules/_heading.scss

@@ -0,0 +1,108 @@
+/* Headings
+   ========================================================================== */
+
+// Headings Options
+// [ h1: size (in rem), line height (* leading), margin top (* leading), margin bottom (* leading) ]
+$headings: (
+  h1: (2.5, 2, 4, 1),
+  h2: (1.6875, 1.5, 2.5, .5),
+  h3: (1.375, 1, 2, .5),
+  h4: (1.2, 1, 1.5, .5),
+  h5: (1, 1, 2.5, .5),
+  h6: (1, 1, 2.5, .5)
+) !default;
+
+// Set headings sizes, line-heights and margins
+@each $heading, $properties in $headings {
+  #{$heading} {
+    @include font-size(nth($properties, 1));
+    @include line-height(nth($properties, 2));
+    @include margin-top(nth($properties, 3));
+    @include margin-bottom(nth($properties, 4));
+  }
+}
+
+@media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+  $leading: $leading-desktop;
+  $leading-rem: $leading-rem-desktop;
+
+  @import '../mixins/font-size';
+  @import '../mixins/line-height';
+  @import '../mixins/margin';
+
+  @each $heading, $properties in $headings {
+    #{$heading} {
+      @include font-size(nth($properties, 1));
+      @include line-height(nth($properties, 2));
+      @include margin-top(nth($properties, 3));
+      @include margin-bottom(nth($properties, 4));
+    }
+  }
+
+}
+
+// Set margins between headings
+h1 + h2 {
+  @include margin-top(1);
+
+  @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+    $leading: $leading-desktop;
+    $leading-rem: $leading-rem-desktop;
+
+    @import '../mixins/margin';
+
+    @include margin-top(1);
+  }
+
+}
+
+h2 + h3,
+h3 + h4,
+h4 + h5 {
+  @include margin-top(.5);
+
+  @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+    $leading: $leading-desktop;
+    $leading-rem: $leading-rem-desktop;
+
+    @import '../mixins/margin';
+
+    @include margin-top(.5);
+  }
+
+}
+
+h5 + h6 {
+  @include margin-top(-.5);
+
+  @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+    $leading: $leading-desktop;
+    $leading-rem: $leading-rem-desktop;
+
+    @import '../mixins/margin';
+
+    @include margin-top(-.5);
+  }
+
+}
+
+h6 {
+  font-style: italic;
+  font-weight: normal;
+}
+
+// Change headings font if a heading font is set
+@if $font-headings != null {
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    font-family: $font-headings;
+  }
+}
+
+hgroup {
+  display: block;
+}

data/_sass/gutenberg/modules/_horizontal-rule.scss

@@ -0,0 +1,69 @@
+// Horizontal rule
+$hr-style: line; // [ line / type ]
+$hr-type-content: '***'; // [ '***' ]
+$hr-type-char-spacing: .2em; // [ .2em ]
+$hr-margin: 2;
+$hr-margin-desktop: $hr-margin;
+$hr-color: $color-font-body;
+$hr-width: 100; // [ 100 ] — In pixels, only for line style
+$hr-height: 4; // [ 2 ] — In pixels, only for line style
+
+hr {
+  @include margin-top($hr-margin);
+  @include margin-bottom($hr-margin);
+
+  box-sizing: content-box;
+  border: 0;
+  color: $hr-color;
+  display: block;
+  height: #{$leading + 'px'};
+  height: #{$leading-rem + 'rem'};
+  margin-right: auto;
+  margin-left: auto;
+
+  @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+    $leading: $leading-desktop;
+    $leading-rem: $leading-rem-desktop;
+
+    @import '../mixins/margin';
+
+    @include margin-top($hr-margin);
+    @include margin-bottom($hr-margin);
+    height: #{$leading + 'px'};
+    height: #{$leading-rem + 'rem'};
+  }
+
+  @if $hr-style == 'line' {
+    background-size: 100% #{$leading + 'px'};
+    background-size: 100% #{$leading-rem + 'rem'};
+    background-image: linear-gradient(to bottom, transparent 1px, transparent #{ 0.5 * $leading - (0.5 * $hr-height) + 'px'},  $hr-color #{ 0.5 * $leading - (0.5 * $hr-height) + 'px'}, $hr-color #{ (0.5 * $leading  - (0.5 * $hr-height)) + $hr-height + 'px'}, transparent #{ (0.5 * $leading  - (0.5 * $hr-height)) + $hr-height + 'px'}, transparent #{$leading + 'px'});
+
+    @if $hr-width == null {
+      width: 100%;
+    } @else {
+      width: #{$hr-width + 'px'};
+    }
+  }
+
+  @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+    $leading: $leading-desktop;
+    $leading-rem: $leading-rem-desktop;
+    $hr-margin: $hr-margin-desktop;
+
+    @if $hr-style == 'line' {
+      background-size: 100% #{$leading + 'px'};
+      background-size: 100% #{$leading-rem + 'rem'};
+      background-image: linear-gradient(to bottom, transparent 1px, transparent #{ .5 * $leading - (.5 * $hr-height) + 'px'}, $hr-color #{ .5 * $leading - (.5 * $hr-height) + 'px'}, $hr-color #{ (.5 * $leading - (.5 * $hr-height)) + $hr-height + 'px'}, transparent #{ (.5 * $leading - (.5 * $hr-height)) + $hr-height + 'px'}, transparent #{$leading + 'px'});
+    }
+
+  }
+
+  @if $hr-style == 'type' {
+    text-align: center;
+
+    &:before {
+      content: $hr-type-content;
+      letter-spacing: $hr-type-char-spacing;
+    }
+  }
+}

data/_sass/gutenberg/modules/_image.scss

@@ -0,0 +1,12 @@
+// Remove border when inside `a` element in IE 8/9/10.
+img {
+  border: 0;
+  max-width: 100%;
+  display: block;
+  margin: inherit auto;
+}
+
+// Correct overflow not hidden in IE 9/10/11.
+svg:not(:root) {
+  overflow: hidden;
+}

data/_sass/gutenberg/modules/_list.scss

@@ -0,0 +1,9 @@
+// Lists
+ul,
+ol {
+
+  li {
+    margin-bottom: 0;
+  }
+
+}

data/_sass/gutenberg/modules/_navigation.scss

@@ -0,0 +1,3 @@
+nav {
+  display: block;
+}

data/_sass/gutenberg/modules/_progress.scss

@@ -0,0 +1,4 @@
+progress {
+  display: inline-block;
+  vertical-align: baseline;
+}

data/_sass/gutenberg/modules/_quote.scss

@@ -0,0 +1,48 @@
+blockquote {
+  font-style: italic;
+  padding-left: 1.4375rem;
+  // font-size: 95%;
+
+  @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+    padding-left: 2rem;
+  }
+
+}
+
+cite {
+  display: block;
+  font-style: normal;
+}
+
+// Quotes
+figure blockquote {
+  @include padding(1, 0);
+
+  @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+    $leading: $leading-desktop;
+    $leading-rem: $leading-rem-desktop;
+
+    @import '../mixins/padding';
+
+    @include padding(2, 0, 1);
+    text-align: center;
+  }
+
+  p {
+    @include font-size(1.6875);
+    @include line-height(1.5);
+
+    @media screen and (min-width: #{ $max-width + 5 + 'em'}) {
+      $leading: $leading-desktop;
+      $leading-rem: $leading-rem-desktop;
+
+      @import '../mixins/font-size';
+      @import '../mixins/line-height';
+
+      @include font-size(1.6875);
+      @include line-height(1.5);
+    }
+
+  }
+
+}