Permalink
Browse files

fix(Button): Make disabled style a bit more obvious

  • Loading branch information...
HHogg committed Sep 25, 2018
1 parent e9d7b8a commit 8cd731c5a0d3404cdac11aff7b7e462bf356cdc2
Showing with 11 additions and 8 deletions.
  1. +11 −8 src/Button/Button.css
@@ -22,6 +22,7 @@
&[disabled],
&[disabled]:hover,
&[disabled]:active {
opacity: 0.75;
cursor: default;
}

@@ -43,17 +44,18 @@
&.Button--negative { color: var(--color-negative--shade-1); }
}

&.Button--active,
&:active {
&:active,
&.Button--active {
&.Button--accent { color: var(--color-accent--shade-3); }
&.Button--positive { color: var(--color-positive--shade-3); }
&.Button--negative { color: var(--color-negative--shade-3); }
}

&[disabled],
&[disabled]:hover,
&[disabled]:active {
color: var(--color-text--shade-2);
&[disabled]:active,
&[disabled].Button--active {
color: var(--color-text--shade-3);
}
}

@@ -67,17 +69,18 @@
&.Button--negative { background-color: var(--color-negative--shade-1); }
}

&.Button--active,
&:active {
&:active,
&.Button--active {
&.Button--accent { background-color: var(--color-accent--shade-3); }
&.Button--positive { background-color: var(--color-positive--shade-3); }
&.Button--negative { background-color: var(--color-negative--shade-3); }
}

&[disabled],
&[disabled]:hover,
&[disabled]:active {
background-color: var(--color-text--shade-2);
&[disabled]:active,
&[disabled].Button--active {
background-color: var(--color-text--shade-3);
color: var(--color-background--shade-3);
}
}

0 comments on commit 8cd731c

Please sign in to comment.