@nice-digital/nds-button 2.0.5-alpha.0 → 2.0.8-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/package.json +3 -3
  2. package/scss/button.scss +19 -12
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nice-digital/nds-button",
3
- "version": "2.0.5-alpha.0",
3
+ "version": "2.0.8-alpha.0",
4
4
  "description": "Button component for the NICE Design System",
5
5
  "author": "Ian Routledge <ian.routledge@nice.org.uk>",
6
6
  "homepage": "https://design-system.nice.org.uk/",
@@ -34,7 +34,7 @@
34
34
  "url": "https://github.com/nice-digital/nice-design-system/issues"
35
35
  },
36
36
  "dependencies": {
37
- "@nice-digital/nds-core": "^2.0.5-alpha.0",
37
+ "@nice-digital/nds-core": "^2.0.8-alpha.0",
38
38
  "classnames": "^2.2.6",
39
39
  "prop-types": "^15.7.2"
40
40
  },
@@ -45,5 +45,5 @@
45
45
  "devDependencies": {
46
46
  "@babel/cli": "^7.5.0"
47
47
  },
48
- "gitHead": "c560cb90c31f1c8d2e3085df9b32bc4e47a37929"
48
+ "gitHead": "4db2dcd638baa87ff67933040dd030099785ba99"
49
49
  }
package/scss/button.scss CHANGED
@@ -20,7 +20,7 @@ $button-border-radius: utils.rem(3px);
20
20
  border: utils.rem(1px) solid colours.$btn-primary-text;
21
21
  border-radius: $button-border-radius;
22
22
  box-shadow: 0 utils.rem(3px) utils.rem(6px) 0 $button-shadow-colour;
23
- color: colours.$btn-primary-text;
23
+ color: colours.$btn-primary-text !important;
24
24
  cursor: pointer;
25
25
  display: inline-block;
26
26
  font-family: inherit;
@@ -42,13 +42,13 @@ $button-border-radius: utils.rem(3px);
42
42
  }
43
43
 
44
44
  &:visited {
45
- color: colours.$btn-primary-text;
45
+ color: colours.$btn-primary-text !important;
46
46
  }
47
47
 
48
48
  &:hover {
49
49
  background: colours.$btn-primary-hover;
50
50
  box-shadow: 0 utils.rem(5px) utils.rem(8px) 0 $button-shadow-colour;
51
- color: colours.$btn-primary-text;
51
+ color: colours.$btn-primary-text !important;
52
52
  text-decoration: none;
53
53
  }
54
54
 
@@ -56,11 +56,12 @@ $button-border-radius: utils.rem(3px);
56
56
  @include focus.default-focus-style;
57
57
  background: colours.$btn-primary;
58
58
  border-color: colours.$focus-inverse;
59
- color: colours.$btn-primary-text;
59
+ color: colours.$btn-primary-text !important;
60
60
  }
61
61
 
62
62
  &:active {
63
63
  background: colours.$btn-primary-hover;
64
+ color: colours.$btn-primary-text !important;
64
65
  text-decoration: none;
65
66
  top: utils.rem(2px);
66
67
  }
@@ -86,24 +87,26 @@ $button-border-radius: utils.rem(3px);
86
87
  background: colours.$btn-cta;
87
88
  border: utils.rem(1px) solid colours.$btn-cta-border;
88
89
  box-shadow: 4px 4px 8px $button-shadow-colour;
89
- color: colours.$btn-cta-text;
90
+ color: colours.$btn-cta-text !important;
90
91
 
91
92
  &:visited {
92
- color: colours.$btn-cta-text;
93
+ color: colours.$btn-cta-text !important;
93
94
  }
94
95
 
95
96
  &:hover {
96
97
  background: colours.$btn-cta-hover;
97
98
  box-shadow: 4px 4px 8px $button-shadow-colour;
98
- color: colours.$btn-cta-text;
99
+ color: colours.$btn-cta-text !important;
99
100
  }
100
101
 
101
102
  &:focus {
102
103
  background: colours.$btn-cta-hover;
104
+ color: colours.$btn-cta-text !important;
103
105
  }
104
106
 
105
107
  &:active {
106
108
  background: colours.$btn-cta-hover;
109
+ color: colours.$btn-cta-text !important;
107
110
  }
108
111
  }
109
112
 
@@ -112,23 +115,25 @@ $button-border-radius: utils.rem(3px);
112
115
  .btn--secondary {
113
116
  background: colours.$btn-secondary;
114
117
  border: utils.rem(1px) solid colours.$btn-secondary-text;
115
- color: colours.$btn-secondary-text;
118
+ color: colours.$btn-secondary-text !important;
116
119
 
117
120
  &:visited {
118
- color: colours.$btn-secondary-text;
121
+ color: colours.$btn-secondary-text !important;
119
122
  }
120
123
 
121
124
  &:hover {
122
125
  background: colours.$btn-secondary-hover;
123
- color: colours.$btn-secondary-text;
126
+ color: colours.$btn-secondary-text !important;
124
127
  }
125
128
 
126
129
  &:focus {
127
130
  background: colours.$btn-secondary-hover;
131
+ color: colours.$btn-secondary-text !important;
128
132
  }
129
133
 
130
134
  &:active {
131
135
  background: colours.$btn-secondary-hover;
136
+ color: colours.$btn-secondary-text !important;
132
137
  }
133
138
  }
134
139
 
@@ -140,19 +145,21 @@ $button-border-radius: utils.rem(3px);
140
145
  color: colours.$btn-inverse-text !important;
141
146
 
142
147
  &:visited {
143
- color: colours.$btn-inverse-text;
148
+ color: colours.$btn-inverse-text !important;
144
149
  }
145
150
 
146
151
  &:hover {
147
152
  background: colours.$btn-inverse-hover;
148
- color: colours.$btn-inverse-text;
153
+ color: colours.$btn-inverse-text !important;
149
154
  }
150
155
 
151
156
  &:focus {
152
157
  background: colours.$btn-inverse-hover;
158
+ color: colours.$btn-inverse-text !important;
153
159
  }
154
160
 
155
161
  &:active {
156
162
  background: colours.$btn-inverse-hover;
163
+ color: colours.$btn-inverse-text !important;
157
164
  }
158
165
  }