Update typey-chroma-kss fork with scss-lint rules.

10 files changed, 82 insertions, 26 deletions

diff --git a/fork-versions/typey-chroma-kss/base/_fonts.scss b/fork-versions/typey-chroma-kss/base/_fonts.scss
new file mode 100644
index 0000000..c3e3858
--- /dev/null
+++ b/fork-versions/typey-chroma-kss/base/_fonts.scss
@@ -0,0 +1,34 @@
+// Font faces
+//
+// Instead of relying on the fonts that are available on a user's computer, you
+// can use web fonts which, like images, are resources downloaded to the user's
+// browser. Because of the bandwidth and rendering resources required, web fonts
+// should be used with care.
+//
+// Numerous resources for web fonts can be found on Google. Here are a few
+// websites where you can find Open Source fonts to download:
+// - http://www.fontsquirrel.com/fontface
+// - http://www.theleagueofmoveabletype.com
+// - https://fonts.google.com
+//
+// In order to use these fonts, you will need to convert them into formats
+// suitable for web fonts. We recommend the free-to-use Font Squirrel's
+// Font-Face Generator:
+//   http://www.fontsquirrel.com/fontface/generator
+//
+// The following is an example @font-face declaration. This font can then be
+// used in any ruleset using a property like this:  font-family: Example, serif;
+//
+// Since we're using Sass, you'll need to declare your font faces here, then you
+// can add them to the font variables in the _init.scss partial.
+
+// @font-face {
+//   font-family: 'Example';
+//   src: url('../fonts/example.eot');
+//   src: url('../fonts/example.eot?iefix') format('eot'),
+//     url('../fonts/example.woff') format('woff'),
+//     url('../fonts/example.ttf') format('truetype'),
+//     url('../fonts/example.svg#webfontOkOndcij') format('svg');
+//   font-weight: normal;
+//   font-style: normal;
+// }
diff --git a/fork-versions/typey-chroma-kss/base/forms/_forms.scss b/fork-versions/typey-chroma-kss/base/forms/_forms.scss
index 826f588..3dc5641 100644
--- a/fork-versions/typey-chroma-kss/base/forms/_forms.scss
+++ b/fork-versions/typey-chroma-kss/base/forms/_forms.scss
@@ -91,7 +91,7 @@ input {
 //
 // Style guide: forms.base.button
 
-@import 'components/button/button';
+@import 'forms/button/button';
 
 // The %text-form-element can be used to style `<input>` text types and
 // `<textarea>` elements at the same time.
diff --git a/fork-versions/typey-chroma-kss/base/grouping/_grouping.scss b/fork-versions/typey-chroma-kss/base/grouping/_grouping.scss
index bef19f5..fbbd726 100644
--- a/fork-versions/typey-chroma-kss/base/grouping/_grouping.scss
+++ b/fork-versions/typey-chroma-kss/base/grouping/_grouping.scss
@@ -68,15 +68,6 @@ ul {
   @include margin(1 0);
 }
 
-// Turn off margins on nested lists.
-ol,
-ul {
-  ol,
-  ul {
-    margin: 0;
-  }
-}
-
 dt {
   // Add your styles.
 }
@@ -96,6 +87,12 @@ ul {
   @include rtl {
     padding: 0 $indent-amount 0 0;
   }
+
+  // Turn off margins on nested lists.
+  ol,
+  ul {
+    margin: 0;
+  }
 }
 
 // Figures
diff --git a/fork-versions/typey-chroma-kss/base/links/_links.scss b/fork-versions/typey-chroma-kss/base/links/_links.scss
index fa48697..b77730f 100644
--- a/fork-versions/typey-chroma-kss/base/links/_links.scss
+++ b/fork-versions/typey-chroma-kss/base/links/_links.scss
@@ -18,6 +18,7 @@
 a,
 %link {
   color: color(link);
+  // sass-lint:disable no-vendor-prefixes
   // Remove gaps in links underline in iOS 8+ and Safari 8+.
   -webkit-text-decoration-skip: objects;
 }
diff --git a/fork-versions/typey-chroma-kss/base/text/_text.scss b/fork-versions/typey-chroma-kss/base/text/_text.scss
index c4e3083..b955ce7 100644
--- a/fork-versions/typey-chroma-kss/base/text/_text.scss
+++ b/fork-versions/typey-chroma-kss/base/text/_text.scss
@@ -18,6 +18,7 @@
 abbr[title] {
   // Remove the bottom border in Firefox 39-.
   border-bottom: 0;
+  // sass-lint:disable no-duplicate-properties
   // Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
   text-decoration: underline;
   text-decoration: underline dotted;
diff --git a/fork-versions/typey-chroma-kss/components/button/_button.scss b/fork-versions/typey-chroma-kss/forms/button/_button.scss
index 554331b..7e769ad 100644
--- a/fork-versions/typey-chroma-kss/components/button/_button.scss
+++ b/fork-versions/typey-chroma-kss/forms/button/_button.scss
@@ -22,6 +22,7 @@ button,
 html [type='button'],
 [type='reset'],
 [type='submit'] {
+  // sass-lint:disable no-vendor-prefixes
   -moz-appearance: button;
   -webkit-appearance: button; // 2
 }
@@ -45,6 +46,7 @@ button,
   cursor: pointer;
   color: color(button);
 
+  // sass-lint:disable no-vendor-prefixes
   // Remove the inner border and padding in Firefox.
   &::-moz-focus-inner {
     border-style: none;
@@ -55,6 +57,7 @@ button,
   &:-moz-focusring {
     outline: 1px dotted ButtonText;
   }
+  // sass-lint:enable no-vendor-prefixes
 
   &:hover,
   &:focus,
diff --git a/fork-versions/typey-chroma-kss/components/button/button.twig b/fork-versions/typey-chroma-kss/forms/button/button.twig
index 4a32e9f..4a32e9f 100644
--- a/fork-versions/typey-chroma-kss/components/button/button.twig
+++ b/fork-versions/typey-chroma-kss/forms/button/button.twig
diff --git a/fork-versions/typey-chroma-kss/init/_colors.scss b/fork-versions/typey-chroma-kss/init/_colors.scss
index 1fb1f35..4cce4ce 100644
--- a/fork-versions/typey-chroma-kss/init/_colors.scss
+++ b/fork-versions/typey-chroma-kss/init/_colors.scss
@@ -1,4 +1,4 @@
-// sass-lint:disable indentation, no-color-keywords
+// sass-lint:disable indentation, no-color-keywords, no-color-hex
 
 // Colors
 //
diff --git a/fork-versions/typey-chroma-kss/styles.scss b/fork-versions/typey-chroma-kss/styles.scss
index 40f414d..36cb1a0 100644
--- a/fork-versions/typey-chroma-kss/styles.scss
+++ b/fork-versions/typey-chroma-kss/styles.scss
@@ -22,27 +22,48 @@
 // to an HTML element, these styles will be the ones displayed.
 //
 // Style guide: base
+
+// Ensure fonts get loaded first to minimize front-end performance impact.
+@import 'base/fonts';
 @import 'base/normalize';
 
-// Forms
+// Layouts
 //
-// Form components are specialized design components that are applied to forms
-// or form elements.
+// The layout styling for major parts of the page that are included with the
+// theme. Note: some Panels layouts are included in other parts of the system
+// and are not documented.
 //
-// Weight: 1
-//
-// Style guide: forms
+// Style guide: layouts
 
 // Components
 //
 // Design components are reusable designs that can be applied using just the CSS
 // class names specified in the component.
 //
-// Weight: 2
+// Weight: 1
 //
 // Style guide: components
 
-// This file is @import'ed by base/forms, so we don't import it again.
-// @import 'components/button/button';
 // This file is @import'ed by base/grouping, so we don't import it again.
 // @import 'components/divider/divider';
+
+// Navigation
+//
+// Navigation components are specialized design components that are used for
+// page navigation.
+//
+// Weight: 2
+//
+// Style guide: navigation
+
+// Forms
+//
+// Form components are specialized design components that are applied to forms
+// or form elements.
+//
+// Weight: 3
+//
+// Style guide: forms
+
+// This file is @import'ed by base/forms, so we don't import it again.
+// @import 'forms/button/button';
diff --git a/test/fixtures/fork-versions/typey-chroma-kss/output.css b/test/fixtures/fork-versions/typey-chroma-kss/output.css
index f8de1ee..8b0a6b4 100644
--- a/test/fixtures/fork-versions/typey-chroma-kss/output.css
+++ b/test/fixtures/fork-versions/typey-chroma-kss/output.css
@@ -77,18 +77,17 @@ ol,
 ul {
   margin: 1.5rem 0; }
 
-ol ol,
-ol ul,
-ul ol,
-ul ul {
-  margin: 0; }
-
 dd {
   margin: 0 0 0 32px; }
 
 ol,
 ul {
   padding: 0 0 0 32px; }
+  ol ol,
+  ol ul,
+  ul ol,
+  ul ul {
+    margin: 0; }
 
 figure {
   margin: 1.5rem 2rem;