V9 merge 05212018 (#801)

* feat(dropdown): added inline dropdown, style changes to dropdown, fixed link in data table readme  (#746)

* feat(dropdown): added inline dropdown

* feat(dropdown): fixed js

* feat(Skeleton-states): Add skeleton state styles (#713)

* feat(skeleton): Add skeleton loading mixin and styles

* feat(skeleton): Add skeleton icon styles

* feat(skeleton): Add skeleton styles to components

* feat(skeleton): Add structured list skeleton

* feat: skeleton styles

* feat: add skeleton demo html

* feat: update skeleton html

* feat(skeleton-states): Update accordion skeleton styles

* feat(skeleton-states): Update accordion

* chore: Update px to rem

* chore: remove duplicate code

* chore: Add correct color value for skeleton state

* feat(skeleton-states): Update data table

* fix(tile): add check to make sure element exists (#786)

* feat(data-table-v2): add inline edit styles for cell (#780)

* fix(table): Missing border in firefox (#787)

* fix(overflow-menu): added different styles for focus and hover (#788)

* fix(overflow-menu): added different styles for focus and hover

* fix(overflow-menu): fixed danger hover/focus

* fix(data-table-v2): remove left positioning from sort icon (#789)

* fix(tile): check if is--expanded is set when tile component is loaded (#791)

* fix(danger-button): Add correct hover color for icon (#794)

* fix(table): removes selected class from row on cancel click (#793)

* chore(git): update gitignore for *.log files (#798)

* fix(button): bring back primary danger button

.gitignore

@@ -14,8 +14,8 @@ dist
 # OSX
 .DS_Store
 
-# Debug
-npm-debug.log
+# Logs
+*.log
 
 # Editors
 project.sublime-project

src/components/button/_button.scss

@@ -123,6 +123,11 @@
       color: $support-01;
       border: $button-border-width solid $support-01;
     }
+
+    &:hover > .#{$prefix}--btn__icon,
+    &:focus > .#{$prefix}--btn__icon {
+      fill: $inverse-01;
+    }
   }
 
   .#{$prefix}--btn--danger--primary {

src/components/button/button.config.js

@@ -72,6 +72,7 @@ module.exports = {
       notes: 'Danger buttons should be used for a negative action (such as Delete) on the page.',
       context: {
         variant: 'danger',
+        danger: true,
       },
     },
     {
@@ -84,6 +85,29 @@ module.exports = {
       `,
       context: {
         variant: 'danger',
+        danger: true,
+        small: true,
+      },
+    },
+    {
+      name: 'danger--primary',
+      label: 'Primary Danger Buttons',
+      context: {
+        variant: 'danger--primary',
+        danger: true,
+      },
+    },
+    {
+      name: 'danger--primary--small',
+      label: 'Primary Danger Buttons (Small)',
+      notes: `
+        Small buttons may be used when there is not enough space for a
+        regular sized button. This issue is most found in tables. Small button should have three words
+        or less.
+      `,
+      context: {
+        variant: 'danger--primary',
+        danger: true,
         small: true,
       },
     },

src/components/button/button.hbs

@@ -1,6 +1,6 @@
-<button class="bx--btn bx--btn--{{variant}}{{#if small}} bx--btn--sm{{/if}}" {{#is variant "danger"}}aria-label="danger"{{/is}} type="button">Button</button>
-<button class="bx--btn bx--btn--{{variant}}{{#if small}} bx--btn--sm{{/if}}" {{#is variant "danger"}}aria-label="danger"{{/is}} type="button" disabled>Button</button>
-<button class="bx--btn bx--btn--{{variant}}{{#if small}} bx--btn--sm{{/if}}" {{#is variant "danger"}}aria-label="danger"{{/is}} type="button">
+<button class="bx--btn bx--btn--{{variant}}{{#if small}} bx--btn--sm{{/if}}" {{#if danger}}aria-label="danger"{{/if}} type="button">Button</button>
+<button class="bx--btn bx--btn--{{variant}}{{#if small}} bx--btn--sm{{/if}}" {{#if danger}}aria-label="danger"{{/if}} type="button" disabled>Button</button>
+<button class="bx--btn bx--btn--{{variant}}{{#if small}} bx--btn--sm{{/if}}" {{#if danger}}aria-label="danger"{{/if}} type="button">
   With icon
   <svg class="bx--btn__icon" width="16" height="16" viewBox="0 0 16 16" fill-rule="evenodd">
     <path d="M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm4 9H9v3H7V9H4V7h3V4h2v3h3v2z"></path>

src/components/data-table-v2/_data-table-v2-expandable.scss

@@ -7,10 +7,6 @@
       display: none;
     }
 
-    td {
-      background-color: $ui-01;
-    }
-
     > td:first-of-type {
       position: relative;