diff --git a/addons/rose/addon/components/rose/header/dropdown.js b/addons/rose/addon/components/rose/header/dropdown.js
index bfc8ec9e1..4a5897084 100644
--- a/addons/rose/addon/components/rose/header/dropdown.js
+++ b/addons/rose/addon/components/rose/header/dropdown.js
@@ -9,7 +9,7 @@ export default Component.extend({
   // Uses details widget state to close dropdown
   @action
   close(element) {
-    if(element.open) {
+    if (element.open) {
       element.open = false;
     }
   },
diff --git a/addons/rose/addon/styles/rose/components/_header.scss b/addons/rose/addon/styles/rose/components/_header.scss
index a6970359f..184cd52f2 100644
--- a/addons/rose/addon/styles/rose/components/_header.scss
+++ b/addons/rose/addon/styles/rose/components/_header.scss
@@ -5,8 +5,10 @@
 $brand-hashicorp: "data:image/svg+xml;utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 106.86 113.14' fill='%23ffffff'><g id='Layer_2' data-name='Layer 2'><g id='Logo'><polygon points='44.54 0 0 25.69 0 25.71 0 87.41 16.73 97.07 16.73 35.35 44.54 19.3 44.54 0'/><polygon points='62.32 0 62.32 49.15 44.54 49.15 44.54 30.81 27.8 40.47 27.8 103.44 44.54 113.12 44.54 64.11 62.32 64.11 62.32 82.33 79.05 72.67 79.05 9.66 62.32 0'/><polygon points='62.32 113.14 106.86 87.45 106.86 87.43 106.86 25.73 90.12 16.07 90.12 77.79 62.32 93.84 62.32 113.14'/></g></g></svg>";
 
 $dropdown-chevron: (
-  'default': "data:image/svg+xml;utf-8,<svg viewBox='0 0 24 24' fill='%23ebeef2' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z'></path></svg>",
-  'open': "data:image/svg+xml;utf-8,<svg viewBox='0 0 24 24' fill='%231f2124' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z'></path></svg>",
+  'default':
+    "data:image/svg+xml;utf-8,<svg viewBox='0 0 24 24' fill='%23ebeef2' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z'></path></svg>",
+  'open':
+    "data:image/svg+xml;utf-8,<svg viewBox='0 0 24 24' fill='%231f2124' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z'></path></svg>",
 );
 
 .rose-header {
@@ -69,7 +71,8 @@ $dropdown-chevron: (
     }
   }
 
-  .rose-header-navigation, .rose-header-utilities {
+  .rose-header-navigation,
+  .rose-header-utilities {
     .rose-header-dropdown {
       &[open] {
         .rose-header-dropdown-trigger {
@@ -104,7 +107,7 @@ $dropdown-chevron: (
 
         .rose-icon {
           position: relative;
-          top: - sizing.rems(xxs);
+          top: -sizing.rems(xxs);
         }
       }
 
@@ -120,7 +123,7 @@ $dropdown-chevron: (
           right: sizing.rems(s);
         }
 
-        .rose-header-dropdown-content-link{
+        .rose-header-dropdown-content-link {
           padding: sizing.rems(xs) sizing.rems(s);
           text-decoration: none;
           display: block;
diff --git a/addons/rose/addon/styles/rose/variables/_media.scss b/addons/rose/addon/styles/rose/variables/_media.scss
index d0f695bbf..289c96ad9 100644
--- a/addons/rose/addon/styles/rose/variables/_media.scss
+++ b/addons/rose/addon/styles/rose/variables/_media.scss
@@ -10,7 +10,7 @@ $width-breakpoints: (
   large: 1024px,
   medium: 768px,
   small: 480px,
-  xsmall: 320px
+  xsmall: 320px,
 );
 
 /**
diff --git a/addons/rose/app/components/rose/header/brand.js b/addons/rose/app/components/rose/header/brand.js
index b21f5e748..edd708f53 100644
--- a/addons/rose/app/components/rose/header/brand.js
+++ b/addons/rose/app/components/rose/header/brand.js
@@ -1 +1 @@
-export { default } from 'rose/components/rose/header/brand';
\ No newline at end of file
+export { default } from 'rose/components/rose/header/brand';
diff --git a/addons/rose/app/components/rose/header/dropdown.js b/addons/rose/app/components/rose/header/dropdown.js
index 689d4487e..16d89ac10 100644
--- a/addons/rose/app/components/rose/header/dropdown.js
+++ b/addons/rose/app/components/rose/header/dropdown.js
@@ -1 +1 @@
-export { default } from 'rose/components/rose/header/dropdown';
\ No newline at end of file
+export { default } from 'rose/components/rose/header/dropdown';
diff --git a/addons/rose/app/components/rose/header/dropdown/content.js b/addons/rose/app/components/rose/header/dropdown/content.js
index 0ef8131da..51792f92e 100644
--- a/addons/rose/app/components/rose/header/dropdown/content.js
+++ b/addons/rose/app/components/rose/header/dropdown/content.js
@@ -1 +1 @@
-export { default } from 'rose/components/rose/header/dropdown/content';
\ No newline at end of file
+export { default } from 'rose/components/rose/header/dropdown/content';
diff --git a/addons/rose/app/components/rose/header/dropdown/content/button.js b/addons/rose/app/components/rose/header/dropdown/content/button.js
index 7576f9dae..cc70f39b5 100644
--- a/addons/rose/app/components/rose/header/dropdown/content/button.js
+++ b/addons/rose/app/components/rose/header/dropdown/content/button.js
@@ -1 +1 @@
-export { default } from 'rose/components/rose/header/dropdown/content/button';
\ No newline at end of file
+export { default } from 'rose/components/rose/header/dropdown/content/button';
diff --git a/addons/rose/app/components/rose/header/dropdown/trigger.js b/addons/rose/app/components/rose/header/dropdown/trigger.js
index ea84a3b44..0bb1491ed 100644
--- a/addons/rose/app/components/rose/header/dropdown/trigger.js
+++ b/addons/rose/app/components/rose/header/dropdown/trigger.js
@@ -1 +1 @@
-export { default } from 'rose/components/rose/header/dropdown/trigger';
\ No newline at end of file
+export { default } from 'rose/components/rose/header/dropdown/trigger';
diff --git a/addons/rose/app/components/rose/header/utilities.js b/addons/rose/app/components/rose/header/utilities.js
index bb5f37bc3..6c4acf7b5 100644
--- a/addons/rose/app/components/rose/header/utilities.js
+++ b/addons/rose/app/components/rose/header/utilities.js
@@ -1 +1 @@
-export { default } from 'rose/components/rose/header/utilities';
\ No newline at end of file
+export { default } from 'rose/components/rose/header/utilities';
diff --git a/addons/rose/tests/integration/components/rose/header/brand-test.js b/addons/rose/tests/integration/components/rose/header/brand-test.js
index 5529aa5a3..e3df6dc9e 100644
--- a/addons/rose/tests/integration/components/rose/header/brand-test.js
+++ b/addons/rose/tests/integration/components/rose/header/brand-test.js
@@ -3,7 +3,7 @@ import { setupRenderingTest } from 'ember-qunit';
 import { render, find } from '@ember/test-helpers';
 import hbs from 'htmlbars-inline-precompile';
 
-module('Integration | Component | rose/header/brand', function(hooks) {
+module('Integration | Component | rose/header/brand', function (hooks) {
   setupRenderingTest(hooks);
 
   test('it renders', async function (assert) {
diff --git a/addons/rose/tests/integration/components/rose/header/dropdown-test.js b/addons/rose/tests/integration/components/rose/header/dropdown-test.js
index 690e5103d..439c29800 100644
--- a/addons/rose/tests/integration/components/rose/header/dropdown-test.js
+++ b/addons/rose/tests/integration/components/rose/header/dropdown-test.js
@@ -3,29 +3,34 @@ import { setupRenderingTest } from 'ember-qunit';
 import { render, click, find, findAll } from '@ember/test-helpers';
 import hbs from 'htmlbars-inline-precompile';
 
-module('Integration | Component | rose/header/dropdown', function(hooks) {
+module('Integration | Component | rose/header/dropdown', function (hooks) {
   setupRenderingTest(hooks);
 
-  test('it renders', async function(assert) {
+  test('it renders', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown />`);
     assert.ok(find('.rose-header-dropdown'));
   });
 
-  test('it renders with html attributes', async function(assert) {
-    await render(hbs`<Rose::Header::Dropdown id="custom-id" class="custom-class"/>`);
+  test('it renders with html attributes', async function (assert) {
+    await render(
+      hbs`<Rose::Header::Dropdown id="custom-id" class="custom-class"/>`
+    );
     assert.ok(find('#custom-id'));
     assert.ok(find('.custom-class'));
   });
 
-  test('it renders with trigger', async function(assert) {
+  test('it renders with trigger', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown as |dropdown|>
       <dropdown.trigger>Click me</dropdown.trigger>
     </Rose::Header::Dropdown>`);
     assert.ok(find('.rose-header-dropdown-trigger'));
-    assert.equal(find('.rose-header-dropdown-trigger').textContent.trim(), 'Click me');
+    assert.equal(
+      find('.rose-header-dropdown-trigger').textContent.trim(),
+      'Click me'
+    );
   });
 
-  test('it renders with content', async function(assert) {
+  test('it renders with content', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown as |dropdown|>
       <dropdown.content as |content|>
         <content.link @route="about"/>
@@ -40,7 +45,7 @@ module('Integration | Component | rose/header/dropdown', function(hooks) {
     assert.equal(findAll('button').length, 3);
   });
 
-  test('it is toggled on click on trigger content', async function(assert) {
+  test('it is toggled on click on trigger content', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown id="dropdown" as |dropdown|>
       <dropdown.trigger id="trigger">Click me</dropdown.trigger>
       <dropdown.content as |content|>
@@ -56,7 +61,7 @@ module('Integration | Component | rose/header/dropdown', function(hooks) {
     assert.notOk(find('#dropdown').open);
   });
 
-  test('it is closed with outside click is triggered', async function(assert) {
+  test('it is closed with outside click is triggered', async function (assert) {
     await render(hbs`<div id="wrapper"><Rose::Header::Dropdown id="dropdown" as |dropdown|>
       <dropdown.trigger id="trigger">Click me</dropdown.trigger>
       <dropdown.content as |content|>
diff --git a/addons/rose/tests/integration/components/rose/header/dropdown/content-test.js b/addons/rose/tests/integration/components/rose/header/dropdown/content-test.js
index 26fd3c413..b0bb4a371 100644
--- a/addons/rose/tests/integration/components/rose/header/dropdown/content-test.js
+++ b/addons/rose/tests/integration/components/rose/header/dropdown/content-test.js
@@ -3,36 +3,47 @@ import { setupRenderingTest } from 'ember-qunit';
 import { render, find } from '@ember/test-helpers';
 import hbs from 'htmlbars-inline-precompile';
 
-module('Integration | Component | rose/header/dropdown/content', function(hooks) {
+module('Integration | Component | rose/header/dropdown/content', function (
+  hooks
+) {
   setupRenderingTest(hooks);
 
-  test('it renders', async function(assert) {
+  test('it renders', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown::Content />`);
     assert.ok(find('.rose-header-dropdown-content'));
   });
 
-  test('it renders with content', async function(assert) {
+  test('it renders with content', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown::Content>
       content
     </Rose::Header::Dropdown::Content>`);
-    assert.equal(find('.rose-header-dropdown-content').textContent.trim(), 'content');
+    assert.equal(
+      find('.rose-header-dropdown-content').textContent.trim(),
+      'content'
+    );
   });
 
-  test('it renders with html attributes', async function(assert) {
-    await render(hbs`<Rose::Header::Dropdown::Content id="dropdown-content" class="universe" />`);
+  test('it renders with html attributes', async function (assert) {
+    await render(
+      hbs`<Rose::Header::Dropdown::Content id="dropdown-content" class="universe" />`
+    );
     assert.equal(find('.rose-header-dropdown-content').id, 'dropdown-content');
-    assert.ok(find('.rose-header-dropdown-content').className.match('universe'));
+    assert.ok(
+      find('.rose-header-dropdown-content').className.match('universe')
+    );
   });
 
-  test('it is positioned right when @alignRight={{true}}', async function(assert) {
+  test('it is positioned right when @alignRight={{true}}', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown::Content />`);
     assert.notOk(find('.rose-header-dropdown-content-right'));
 
-    await render(hbs`<Rose::Header::Dropdown::Content @alignRight="{{true}}"/>`);
+    await render(
+      hbs`<Rose::Header::Dropdown::Content @alignRight="{{true}}"/>`
+    );
     assert.ok(find('.rose-header-dropdown-content-right'));
   });
 
-  test('it render link element', async function(assert) {
+  test('it render link element', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown::Content as |content|>
       <content.link @route="about" />
     </Rose::Header::Dropdown::Content>`);
@@ -40,14 +51,14 @@ module('Integration | Component | rose/header/dropdown/content', function(hooks)
     assert.ok(find('.rose-header-dropdown-content-link'));
   });
 
-  test('it render link element with content', async function(assert) {
+  test('it render link element with content', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown::Content as |content|>
       <content.link @route="about">linkify</content.link>
     </Rose::Header::Dropdown::Content>`);
     assert.equal(find('a').textContent.trim(), 'linkify');
   });
 
-  test('it render button element', async function(assert) {
+  test('it render button element', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown::Content as |content|>
       <content.button />
     </Rose::Header::Dropdown::Content>`);
@@ -55,7 +66,7 @@ module('Integration | Component | rose/header/dropdown/content', function(hooks)
     assert.ok(find('.rose-header-dropdown-content-button'));
   });
 
-  test('it render button element with content', async function(assert) {
+  test('it render button element with content', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown::Content as |content|>
       <content.button>dropdown button</content.button>
     </Rose::Header::Dropdown::Content>`);
diff --git a/addons/rose/tests/integration/components/rose/header/dropdown/content/button-test.js b/addons/rose/tests/integration/components/rose/header/dropdown/content/button-test.js
index 8ea5783c8..a73dc28df 100644
--- a/addons/rose/tests/integration/components/rose/header/dropdown/content/button-test.js
+++ b/addons/rose/tests/integration/components/rose/header/dropdown/content/button-test.js
@@ -3,22 +3,30 @@ import { setupRenderingTest } from 'ember-qunit';
 import { render, find } from '@ember/test-helpers';
 import hbs from 'htmlbars-inline-precompile';
 
-module('Integration | Component | rose/header/dropdown/content/button', function(hooks) {
-  setupRenderingTest(hooks);
+module(
+  'Integration | Component | rose/header/dropdown/content/button',
+  function (hooks) {
+    setupRenderingTest(hooks);
 
-  test('it renders', async function(assert) {
-    await render(hbs`<Rose::Header::Dropdown::Content::Button />`);
-    assert.ok(find('.rose-header-dropdown-content-button'));
-  });
+    test('it renders', async function (assert) {
+      await render(hbs`<Rose::Header::Dropdown::Content::Button />`);
+      assert.ok(find('.rose-header-dropdown-content-button'));
+    });
 
-  test('it renders with content', async function(assert) {
-    await render(hbs`<Rose::Header::Dropdown::Content::Button>Button content</Rose::Header::Dropdown::Content::Button>`);
-    assert.equal(find('.rose-header-dropdown-content-button').textContent.trim(), 'Button content');
-  });
+    test('it renders with content', async function (assert) {
+      await render(
+        hbs`<Rose::Header::Dropdown::Content::Button>Button content</Rose::Header::Dropdown::Content::Button>`
+      );
+      assert.equal(
+        find('.rose-header-dropdown-content-button').textContent.trim(),
+        'Button content'
+      );
+    });
 
-  test('it render button element', async function(assert) {
-    await render(hbs`<Rose::Header::Dropdown::Content::Button />`);
-    assert.ok(find('button'));
-    assert.equal(find('button').type, 'button');
-  });
-});
+    test('it render button element', async function (assert) {
+      await render(hbs`<Rose::Header::Dropdown::Content::Button />`);
+      assert.ok(find('button'));
+      assert.equal(find('button').type, 'button');
+    });
+  }
+);
diff --git a/addons/rose/tests/integration/components/rose/header/dropdown/trigger-test.js b/addons/rose/tests/integration/components/rose/header/dropdown/trigger-test.js
index aca4e98b3..83309f23e 100644
--- a/addons/rose/tests/integration/components/rose/header/dropdown/trigger-test.js
+++ b/addons/rose/tests/integration/components/rose/header/dropdown/trigger-test.js
@@ -3,29 +3,38 @@ import { setupRenderingTest } from 'ember-qunit';
 import { render, find } from '@ember/test-helpers';
 import hbs from 'htmlbars-inline-precompile';
 
-module('Integration | Component | rose/header/dropdown/trigger', function(hooks) {
+module('Integration | Component | rose/header/dropdown/trigger', function (
+  hooks
+) {
   setupRenderingTest(hooks);
 
-  test('it renders', async function(assert) {
+  test('it renders', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown::Trigger />`);
     assert.ok(find('.rose-header-dropdown-trigger'));
     assert.notOk(find('.rose-header-dropdown-open'));
   });
 
-  test('it renders with content', async function(assert) {
+  test('it renders with content', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown::Trigger>
       trigger content
     </Rose::Header::Dropdown::Trigger>`);
-    assert.equal(find('.rose-header-dropdown-trigger').textContent.trim(), 'trigger content');
+    assert.equal(
+      find('.rose-header-dropdown-trigger').textContent.trim(),
+      'trigger content'
+    );
   });
 
-  test('it renders with html attributes', async function(assert) {
-    await render(hbs`<Rose::Header::Dropdown::Trigger id="trigger" class="dropdown-trigger" />`);
+  test('it renders with html attributes', async function (assert) {
+    await render(
+      hbs`<Rose::Header::Dropdown::Trigger id="trigger" class="dropdown-trigger" />`
+    );
     assert.equal(find('.rose-header-dropdown-trigger').id, 'trigger');
-    assert.ok(find('.rose-header-dropdown-trigger').className.match('dropdown-trigger'));
+    assert.ok(
+      find('.rose-header-dropdown-trigger').className.match('dropdown-trigger')
+    );
   });
 
-  test('it renders chevron', async function(assert) {
+  test('it renders chevron', async function (assert) {
     await render(hbs`<Rose::Header::Dropdown::Trigger />`);
     assert.ok(find('.rose-header-dropdown-chevron'));
   });
diff --git a/addons/rose/tests/integration/components/rose/header/utilities-test.js b/addons/rose/tests/integration/components/rose/header/utilities-test.js
index 56f263714..b0dca161d 100644
--- a/addons/rose/tests/integration/components/rose/header/utilities-test.js
+++ b/addons/rose/tests/integration/components/rose/header/utilities-test.js
@@ -3,7 +3,7 @@ import { setupRenderingTest } from 'ember-qunit';
 import { render, find, findAll } from '@ember/test-helpers';
 import hbs from 'htmlbars-inline-precompile';
 
-module('Integration | Component | rose/header/utilities', function(hooks) {
+module('Integration | Component | rose/header/utilities', function (hooks) {
   setupRenderingTest(hooks);
 
   test('it renders', async function (assert) {
diff --git a/addons/rose/tests/integration/modifiers/on-click-outside-test.js b/addons/rose/tests/integration/modifiers/on-click-outside-test.js
index 859de9902..7318ef423 100644
--- a/addons/rose/tests/integration/modifiers/on-click-outside-test.js
+++ b/addons/rose/tests/integration/modifiers/on-click-outside-test.js
@@ -3,10 +3,10 @@ import { setupRenderingTest } from 'ember-qunit';
 import { render, click } from '@ember/test-helpers';
 import hbs from 'htmlbars-inline-precompile';
 
-module('Integration | Modifier | on-click-outside', function(hooks) {
+module('Integration | Modifier | on-click-outside', function (hooks) {
   setupRenderingTest(hooks);
 
-  test('it fires event when an outside element is clicked', async function(assert) {
+  test('it fires event when an outside element is clicked', async function (assert) {
     this.set('clickedOutside', (element, event) => {
       assert.ok(element);
       assert.equal(event.target.id, 'outside');
@@ -18,9 +18,11 @@ module('Integration | Modifier | on-click-outside', function(hooks) {
     await click('#outside');
   });
 
-  test('it does not fire event when element is clicked', async function(assert) {
+  test('it does not fire event when element is clicked', async function (assert) {
     assert.expect(1);
-    this.set('clickedOutside', () => { assert.ok(true)});
+    this.set('clickedOutside', () => {
+      assert.ok(true);
+    });
 
     await render(hbs`<div id="outside"></div>
     <div id="inside" {{on-click-outside this.clickedOutside}}>