Bump SASS and node versions

.travis.yml

@@ -3,7 +3,8 @@ language: node_js
 node_js:
   # we recommend testing addons with the same minimum supported node version as Ember CLI
   # so that your addon works for all apps
-  - "6"
+  - "8"
+  - "10"
 
 sudo: false
 dist: trusty

index.js

@@ -16,8 +16,6 @@ module.exports = {
   },
 
   included(app) {
-    let sass = require('node-sass');
-    let importOnce = require('node-sass-import-once');
     let autoprefixer = require('autoprefixer');
 
     let defaultPostcssOptions = {
@@ -44,21 +42,6 @@ module.exports = {
       defaultPostcssOptions
     );
 
-    if (!app.options.sassOptions.nodeSass) {
-      let sassRender = sass.render;
-
-      sass.render = function(options, callBack) {
-        options.importer = importOnce;
-        options.importOnce = {
-          index: false,
-          css: false,
-          bower: false,
-        };
-
-        sassRender(options, callBack);
-      };
-    }
-
-    app.options.sassOptions.nodeSass = sass;
+    this._super.included.apply(this, arguments);
   },
 };

package.json

@@ -24,8 +24,7 @@
     "broccoli-funnel": "^2.0.1",
     "broccoli-merge-trees": "^3.0.0",
     "ember-cli-babel": "^6.6.0",
-    "node-sass": "^4.6.0",
-    "node-sass-import-once": "^1.2.0"
+    "sass": "^1.17.0"
   },
   "devDependencies": {
     "@addepar/eslint-config": "^4.0.1",
@@ -40,7 +39,7 @@
     "ember-cli-htmlbars-inline-precompile": "^1.0.0",
     "ember-cli-inject-live-reload": "^1.4.1",
     "ember-cli-qunit": "^4.1.1",
-    "ember-cli-sass": "^7.1.7",
+    "ember-cli-sass": "^8.0.1",
     "ember-cli-sass-lint": "^1.0.5",
     "ember-cli-shims": "^1.2.0",
     "ember-cli-sri": "^2.1.0",
@@ -60,7 +59,7 @@
     "sass-lint": "^1.12.1"
   },
   "engines": {
-    "node": "6.* || >= 7.*"
+    "node": "8.* || >= 10.*"
   },
   "ember-addon": {
     "configPath": "tests/dummy/config"

styles/onyx/components/pop-menu/utils/_mixins.scss

@@ -431,15 +431,15 @@
     $side-1: $left-bottom;
     $side-2: $right-bottom;
   }
-  @elseif $direction == 'top' {
+  @else if $direction == 'top' {
     $side-1: $left-top;
     $side-2: $right-top;
   }
-  @elseif $direction == 'left' {
+  @else if $direction == 'left' {
     $side-1: $left-bottom;
     $side-2: $left-top;
   }
-  @elseif $direction == 'right' {
+  @else if $direction == 'right' {
     $side-1: $right-bottom;
     $side-2: $right-top;
   }