Write tests

.gitignore

@@ -1,5 +1,4 @@
 .sass-cache/
 *.css.map
 package-lock.json
-sass/
 node_modules/

.npmignore

@@ -0,0 +1,8 @@
+node_modules/
+test-files/
+.editorconfig
+.gitignore
+.travis.yml
+package-lock.json
+test.js
+windows.yml

.travis.yml

@@ -0,0 +1,9 @@
+sudo: required
+dist: trusty
+language: node_js
+node_js:
+  - "10"
+install:
+    - npm install
+script:
+    - npm test

README.md

@@ -1,10 +1,12 @@
 # TJW-SassLint-Rules
 
+[![Build Status](https://travis-ci.org/TheJaredWilcurt/tjw-sasslint-rules.svg?branch=master)](https://travis-ci.org/TheJaredWilcurt/tjw-sasslint-rules)
+
 ### *The Jared Wilcurt's very aggressive Sass Linting rules for obsessives.*
 
 #### **From the makers of: [Scout-App](http://scout-app.io)**
 
-These linting rules are designed to be very strict. Much thought has been placed in every rule. This includes a strict ordering of CSS properties. However not every single CSS property is included in this ruleset. If you find you are using a CSS property that is not in the list, please create an issue on GitHub to report it and it will be added into the ruleset.
+These linting rules are designed to be **very strict**. Much thought has been placed in every rule. This includes a strict ordering of CSS properties. However not every single CSS property is included in this ruleset. If you find you are using a CSS property that is not in the list, please create an issue on GitHub to report it and it will be added into the ruleset.
 
 These linting rules work on both `.sass` and `.scss` files, though if you are using these rules, you should probably be using `.sass` files primarily as they are stricter by default and less error proned (see pros/cons below).
 

package.json

@@ -4,7 +4,7 @@
   "description": "The Jared Wilcurt's Sass linting rules",
   "main": "index.js",
   "scripts": {
-    "test": "npm run sasslint",
+    "test": "node test.js",
     "sasslint": "sass-lint -c tjwsasslint.yml '**/*.sass, **/*.scss' -v -f table",
     "sasslint2": "sass-lint -c node_modules/tjw-sasslint-rules/tjwsasslint.yml '**/*.sass, **/*.scss' -v -f table",
     "winlint": "sass-lint -c windows.yml -v -f table",

test-files/app.scss

@@ -0,0 +1,69 @@
+/*
+ *  Methodologies for this Project
+ *
+ *
+ *  ITCSS
+ *  https://www.xfive.co/blog/itcss-scalable-maintainable-css-architecture/
+ *
+ *  Stands for Inverted Triangle CSS and it helps you to organize your
+ *  project CSS files in such way that you can better deal with
+ *  (not always easy-to-deal with) CSS specifics like global
+ *  namespace, cascade and selectors specificity.
+ *
+ *
+ *  BEM
+ *  http://getbem.com/introduction/
+ *
+ *  Stands for Block Element Modifier and helps to avoid inheritance,
+ *  provides some sort of scope by using unique CSS classes per
+ *  element (like .Button__icon--active), and reduces style
+ *  conflicts by keeping CSS specificity to a minimum level.
+ */
+
+
+/*
+ *  Variables, Fonts, Colors, Definitions, Branding
+ */
+@import "settings/index";
+
+
+/*
+ *  Global mixins and functions.
+ */
+@import "tools/index";
+
+
+/*
+ *  Reset Stylesheets, first layer of CSS.
+ */
+@import "generic/index";
+
+
+/*
+ *  Styling of Bare elements like H1, p, a, etc.
+ */
+@import "elements/index";
+
+
+/*
+ *  Class-based selectors which define undecorated
+ *  design patterns, for example media object
+ *  known from OOCSS.
+ */
+@import "objects/index";
+
+
+/*
+ *  Specific UI components. This is where majority
+ *  of our work takes place and our UI components
+ *  are often composed of Objects and Components.
+ */
+@import "components/index";
+
+
+/*
+ *  Helper classes with ability to override
+ *  anything which goes before in the
+ *  triangle, eg. hide helper class.
+ */
+@import "utilities/index";

test-files/components/Container.scss

@@ -0,0 +1,34 @@
+.Container {
+    position: relative ;
+    border: #ccc solid 1px;
+    box-shadow: 2px 4px 12px rgba(0,0,0,0);
+    margin: 20px ;
+    max-width: 100%;
+    padding: 40px 20px 20px ;
+
+    //&:hover {
+    //    box-shadow: 2px 4px 12px rgba(0,0,0,.25);
+    //    border-color: desaturate($primary-color, 50%);
+    //}
+
+    > code {
+        background: #f1f1f1;
+        border: #ccc solid 1px;
+        border-left: 0;
+        @include font-size(12px);
+        border-top: 0;
+        display: inline-flex;
+        flex-grow: 0;
+        flex-shrink: 1;
+        left: 0;
+        margin: 0 0 20px;
+        padding: 6px 8px 4px;
+        position: absolute;
+        top: 0;
+    }
+}
+
+body.Container {
+    border: 0;
+    margin: 0 ;
+}

test-files/components/Events.scss

@@ -0,0 +1,3 @@
+.Events {
+
+}

test-files/components/Footer.scss

@@ -0,0 +1,2 @@
+.Footer {
+}

test-files/components/Header.scss

@@ -0,0 +1,2 @@
+.Header {
+}

test-files/components/ListItem.scss

@@ -0,0 +1,36 @@
+.ListItem {
+    align-items: center;
+    color: $font__base-color;
+    cursor: pointer;
+    display: flex;
+    flex-direction: row;
+    padding: 14px 10px 12px;
+    text-decoration: none;
+
+    &__con {
+        display: flex;
+        flex-direction: column;
+        margin-left: 16px;
+
+        &:first-child {
+            margin-left: 0;
+        }
+    }
+
+    &__title {
+        @include font-size(16px);
+        font-weight: 600;
+        text-transform: capitalize;
+    }
+
+    &__subtitle {
+        @include font-size(12px);
+        color: #999;
+        margin-top: 3px;
+    }
+
+    &:hover {
+        background: #eee;
+        color: $primary-color;
+    }
+}

test-files/components/NProgress.scss

@@ -0,0 +1,65 @@
+#nprogress {
+    pointer-events: none;
+
+    .bar {
+        background: $pbar__bar-color;
+
+        height: 6px;
+        left: 0;
+        position: fixed;
+        top: 0;
+
+        width: 100%;
+        z-index: 1031;
+    }
+
+    /* Fancy blur effect */
+    .peg {
+        box-shadow: 0 0 10px $pbar__blur-color, 0 0 5px $pbar__blur-color;
+        display: block;
+        height: 100%;
+        opacity: 1;
+        position: absolute;
+        right: 0;
+        transform: rotate(3deg) translate(0, -4px);
+
+        width: 100px;
+    }
+
+    /* Remove these to get rid of the spinner */
+    .spinner {
+        display: block;
+        position: fixed;
+        right: 15px;
+        top: 15px;
+        z-index: 1031;
+    }
+
+    .spinner-icon {
+        animation: nprogress-spinner 400ms linear infinite;
+        border: solid 2px transparent;
+        border-left-color: $pbar__spin-color;
+
+        border-radius: 50%;
+        border-top-color: $pbar__spin-color;
+        box-sizing: border-box;
+        height: 18px;
+
+        width: 18px;
+    }
+}
+
+.nprogress-custom-parent {
+    overflow: hidden;
+    position: relative;
+}
+
+.nprogress-custom-parent #nprogress .spinner,
+.nprogress-custom-parent #nprogress .bar {
+    position: absolute;
+}
+
+@include keyframes(nprogress-spinner) {
+    0%   { -webkit-transform: rotate(0deg); }
+    100% { -webkit-transform: rotate(360deg); }
+}

test-files/components/Navigation.scss

@@ -0,0 +1,34 @@
+.Navigation {
+
+    &__con {
+        display: flex;
+        flex-direction: row;
+        width: 100%;
+
+        a {
+            align-items: center;
+            background: rgba($primary-color, 0.08);
+            border: rgba(desaturate($primary-color, 50%), 0.5) solid 1px;
+            color: $primary-color;
+            display: flex;
+            height: 48px;
+            justify-content: center;
+            margin-left: 8px;
+            padding: 0 20px;
+            text-decoration: none;
+
+            &:first-child {
+                margin-left: 0;
+            }
+
+            &:hover {
+                background: #fff;
+            }
+
+            &.active {
+                background: $primary-color;
+                color: #fff;
+            }
+        }
+    }
+}

test-files/components/People.scss

@@ -0,0 +1,15 @@
+.People {
+
+}
+
+.PeopleIndex {
+
+    &__con {
+
+    }
+
+    &__list {
+        display: flex;
+        flex-direction: column;
+    }
+}