added scss lint

Author: jasewarner

.gitignore

@@ -49,3 +49,4 @@ Thumbs.db
 !CHANGELOG.md
 !composer.json
 !.gitkeep
+!.scss-lint.yml

assets/.scss-lint.yml

@@ -0,0 +1,259 @@
+# Default application configuration that all configurations inherit from.
+
+scss_files: "**/*.scss"
+plugin_directories: ['.scss-linters']
+
+# List of gem names to load custom linters from (make sure they are already
+# installed)
+plugin_gems: []
+
+# Default severity of all linters.
+severity: warning
+
+linters:
+  BangFormat:
+    enabled: true
+    space_before_bang: true
+    space_after_bang: false
+
+  BemDepth:
+    enabled: false
+    max_elements: 1
+
+  BorderZero:
+    enabled: true
+    convention: zero # or `none`
+
+  ChainedClasses:
+    enabled: false
+
+  ColorKeyword:
+    enabled: true
+
+  ColorVariable:
+    enabled: true
+
+  Comment:
+    enabled: true
+    style: silent
+
+  DebugStatement:
+    enabled: true
+
+  DeclarationOrder:
+    enabled: true
+
+  DisableLinterReason:
+    enabled: false
+
+  DuplicateProperty:
+    enabled: true
+
+  ElsePlacement:
+    enabled: true
+    style: same_line # or 'new_line'
+
+  EmptyLineBetweenBlocks:
+    enabled: true
+    ignore_single_line_blocks: true
+
+  EmptyRule:
+    enabled: true
+
+  ExtendDirective:
+    enabled: false
+
+  FinalNewline:
+    enabled: true
+    present: true
+
+  HexLength:
+    enabled: true
+    style: short # or 'long'
+
+  HexNotation:
+    enabled: true
+    style: lowercase # or 'uppercase'
+
+  HexValidation:
+    enabled: true
+
+  IdSelector:
+    enabled: true
+
+  ImportantRule:
+    enabled: true
+
+  ImportPath:
+    enabled: true
+    leading_underscore: false
+    filename_extension: false
+
+  Indentation:
+    enabled: true
+    allow_non_nested_indentation: false
+    character: space # or 'tab'
+    width: 2
+
+  LeadingZero:
+    enabled: true
+    style: exclude_zero # or 'include_zero'
+
+  MergeableSelector:
+    enabled: true
+    force_nesting: true
+
+  NameFormat:
+    enabled: true
+    allow_leading_underscore: true
+    convention: hyphenated_lowercase # or 'camel_case', or 'snake_case', or a regex pattern
+
+  NestingDepth:
+    enabled: true
+    max_depth: 3
+    ignore_parent_selectors: false
+
+  PlaceholderInExtend:
+    enabled: true
+
+  PrivateNamingConvention:
+    enabled: false
+    prefix: _
+
+  PropertyCount:
+    enabled: false
+    include_nested: false
+    max_properties: 10
+
+  PropertySortOrder:
+    enabled: true
+    ignore_unspecified: false
+    min_properties: 2
+    separate_groups: false
+
+  PropertySpelling:
+    enabled: true
+    extra_properties: []
+    disabled_properties: []
+
+  PropertyUnits:
+    enabled: true
+    global: [
+      'ch', 'em', 'ex', 'rem',                 # Font-relative lengths
+      'cm', 'in', 'mm', 'pc', 'pt', 'px', 'q', # Absolute lengths
+      'vh', 'vw', 'vmin', 'vmax',              # Viewport-percentage lengths
+      'fr',                                    # Grid fractional lengths
+      'deg', 'grad', 'rad', 'turn',            # Angle
+      'ms', 's',                               # Duration
+      'Hz', 'kHz',                             # Frequency
+      'dpi', 'dpcm', 'dppx',                   # Resolution
+      '%']                                     # Other
+    properties: {}
+
+  PseudoElement:
+    enabled: true
+
+  QualifyingElement:
+    enabled: true
+    allow_element_with_attribute: false
+    allow_element_with_class: false
+    allow_element_with_id: false
+
+  SelectorDepth:
+    enabled: true
+    max_depth: 3
+
+  SelectorFormat:
+    enabled: true
+    convention: hyphenated_BEM # or 'classic_BEM', or 'hyphenated_lowercase', or 'snake_case', or 'camel_case', or a regex pattern
+
+  Shorthand:
+    enabled: true
+    allowed_shorthands: [1, 2, 3, 4]
+
+  SingleLinePerProperty:
+    enabled: true
+    allow_single_line_rule_sets: true
+
+  SingleLinePerSelector:
+    enabled: true
+
+  SpaceAfterComma:
+    enabled: true
+    style: one_space # or 'no_space', or 'at_least_one_space'
+
+  SpaceAfterComment:
+    enabled: false
+    style: one_space # or 'no_space', or 'at_least_one_space'
+    allow_empty_comments: true
+
+  SpaceAfterPropertyColon:
+    enabled: true
+    style: one_space # or 'no_space', or 'at_least_one_space', or 'aligned'
+
+  SpaceAfterPropertyName:
+    enabled: true
+
+  SpaceAfterVariableColon:
+    enabled: false
+    style: one_space # or 'no_space', 'at_least_one_space' or 'one_space_or_newline'
+
+  SpaceAfterVariableName:
+    enabled: true
+
+  SpaceAroundOperator:
+    enabled: true
+    style: one_space # or 'at_least_one_space', or 'no_space'
+
+  SpaceBeforeBrace:
+    enabled: true
+    style: space # or 'new_line'
+    allow_single_line_padding: false
+
+  SpaceBetweenParens:
+    enabled: true
+    spaces: 0
+
+  StringQuotes:
+    enabled: true
+    style: single_quotes # or double_quotes
+
+  TrailingSemicolon:
+    enabled: true
+
+  TrailingWhitespace:
+    enabled: true
+
+  TrailingZero:
+    enabled: false
+
+  TransitionAll:
+    enabled: false
+
+  UnnecessaryMantissa:
+    enabled: true
+
+  UnnecessaryParentReference:
+    enabled: true
+
+  UrlFormat:
+    enabled: true
+
+  UrlQuotes:
+    enabled: true
+
+  VariableForProperty:
+    enabled: false
+    properties: []
+
+  VendorPrefix:
+    enabled: true
+    identifier_list: base
+    additional_identifiers: []
+    excluded_identifiers: []
+
+  ZeroUnit:
+    enabled: true
+
+  Compass::*:
+    enabled: false

assets/Gulpfile.js renamed to assets/gulpfile.js

@@ -8,12 +8,13 @@ const cleancss = require('gulp-clean-css');
 const concat = require('gulp-concat');
 const rename = require('gulp-rename');
 const uglify = require('gulp-uglify');
+const scsslint = require('gulp-scss-lint');
 
 /**
  * Here we set a prefix for our compiled and stylesheet and scripts.
  * Note that this should be the same as the `$themeHandlePrefix` in `func-script.php` and `func-style.php`.
  */
-const themePrefix = 'theme-name';
+const themePrefix = 'ucl';
 
 /**
  * Asset paths.
@@ -25,12 +26,20 @@ const jsSrcFiles = [
     `${jsSrcDir}/scripts/common.js`,
 ];
 
+/**
+ * Scss lint
+ */
+gulp.task('scss-lint', function() {
+    return gulp.src(scssSrc)
+        .pipe(scsslint());
+});
+
 /**
  * Task for styles.
  *
  * Scss files are compiled and sent over to `assets/css/`.
  */
-gulp.task('css', function () {
+gulp.task('css', ['scss-lint'], function () {
     gulp.src(scssSrc)
         .pipe(sass().on('error', sass.logError))
         .pipe(autoprefixer({ cascade : false }))
@@ -61,3 +70,8 @@ gulp.task('watch', function () {
     gulp.watch(scssSrc, ['css']);
     gulp.watch(jsSrcFiles, ['js']);
 });
+
+/**
+ * Default task
+ */
+gulp.task('default', ['css', 'js'] );

assets/package.json

@@ -12,17 +12,18 @@
   "babel-core": "^6.26.3",
   "babel-preset-env": "^1.7.0",
   "babel-preset-es2015": "^6.24.1",
-  "bootstrap-scss": "^4.3.1",
+  "bootstrap-scss": "^4.4.1",
   "gulp": "^3.9.1",
   "gulp-autoprefixer": "^6.0.0",
   "gulp-babel": "^7.0.1",
   "gulp-clean-css": "^4.0.0",
   "gulp-concat": "^2.6.1",
   "gulp-rename": "^1.4.0",
   "gulp-sass": "^4.0.2",
+  "gulp-scss-lint": "^1.0.0",
   "gulp-uglify": "^3.0.1",
   "gulp-uncss": "^1.0.6",
-  "node-sass": "^4.11.0"
+  "node-sass": "^4.13.1"
  },
  "dependencies": {
   "babel-polyfill": "^6.26.0"

assets/scss/layout/_footer.scss

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

assets/scss/layout/_header.scss

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

assets/scss/layout/_main.scss

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

assets/scss/layout/_nav.scss

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

assets/scss/mixins/_fonts.scss

@@ -1,14 +1,13 @@
 // --------------------------------------------------
 // font size
 
-@function calculateRem($size) {
-  $remSize: $size / 18px;
-  @return $remSize * 1rem;
+@function calculate-rem($size) {
+  $rem-size: $size / 16px;
+  @return $rem-size * 1rem;
 }
 
 @mixin font-size($size) {
-  font-size: $size;
-  font-size: calculateRem($size);
+  font-size: calculate-rem($size);
 }
 
 // --------------------------------------------------