[components] Remove deprecated kind secondary button (#660)

* [components] Linting button styling * [components] Remove deprecated kind secondary button * [components] Deprecated secondary button
sanity-io · Mar 15, 2018 · 88cf94c · 88cf94c
1 parent 7e302ea
commit 88cf94c
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 27 deletions.
diff --git a/packages/@sanity/components/src/buttons/styles/DefaultButton.css b/packages/@sanity/components/src/buttons/styles/DefaultButton.css
@@ -33,6 +33,16 @@
     0 0 10px 5px color(var(--white) a(10%));
 }
 
+.content {
+  display: flex;
+  align-items: center;
+}
+
+.inner {
+  display: block;
+  outline: none;
+}
+
 .root {
   margin: 0;
   padding: 0;
@@ -70,9 +80,18 @@
   animation-duration: 0.2s;
 }
 
-.inner {
-  display: block;
-  outline: none;
+.onlyIcon {
+  @nest & .inner {
+    padding: 0.7em 0.8em !important;
+  }
+
+  @nest & .content {
+    display: block;
+  }
+
+  @nest & .icon {
+    margin-right: 0;
+  }
 }
 
 .padding_default {
@@ -87,10 +106,6 @@
   }
 }
 
-.onlyIcon .inner {
-  padding: 0.7em 0.8em !important;
-}
-
 .padding_small {
   @nest & .inner {
     @nest :not(.onlyIcon) & {
@@ -103,11 +118,6 @@
   }
 }
 
-.content {
-  display: flex;
-  align-items: center;
-}
-
 .shadow {
   composes: shadow-1dp from "part:@sanity/base/theme/shadows-style";
 }
@@ -166,6 +176,10 @@
   }
 }
 
+.secondary {
+  composes: inverted;
+}
+
 .color__primary {
   border-color: var(--brand-primary);
   background-color: var(--brand-primary);
@@ -330,24 +344,11 @@
   /* empty */
 }
 
-.content {
-  display: inline-block;
-  vertical-align: middle;
-}
-
 .icon {
   transform: scale(1.2);
   margin-right: var(--small-padding);
 }
 
-.onlyIcon .content {
-  display: block;
-}
-
-.onlyIcon .icon {
-  margin-right: 0;
-}
-
 .disabled {
   opacity: 0.2;
 }
diff --git a/packages/@sanity/components/src/dialogs/ConfirmDialog.js b/packages/@sanity/components/src/dialogs/ConfirmDialog.js
@@ -69,7 +69,7 @@ export default class DefaultDialog extends React.PureComponent {
                   <Button
                     onClick={onCancel}
                     icon={CloseIcon}
-                    kind="secondary"
+                    inverted
                   >
                     {cancelButtonText}
                   </Button>

diff --git a/packages/@sanity/desk-tool/src/components/ConfirmDelete.js b/packages/@sanity/desk-tool/src/components/ConfirmDelete.js
@@ -36,7 +36,7 @@ export default enhanceWithReferringDocuments(class ConfirmDelete extends React.P
 
     const actions = [
       canContinue && {name: 'confirm', title: hasReferringDocuments ? 'Try to delete anyway' : 'Delete now'},
-      {name: 'cancel', title: 'Cancel', kind: 'secondary'}
+      {name: 'cancel', title: 'Cancel', kind: 'simple'}
     ].filter(Boolean)
 
     const title = isCheckingReferringDocuments ? 'Checking…' : 'Confirm delete'