@miljodirektoratet/md-css 6.4.0 → 6.4.2

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 (3) hide show
  1. package/package.json +1 -1
  2. package/src/button/button.css +14 -14
  3. package/src/iconButton/iconButton.css +2 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@miljodirektoratet/md-css",
3
- "version": "6.4.0",
3
+ "version": "6.4.2",
4
4
  "description": "CSS for Miljødirektoratet",
5
5
  "author": "Miljødirektoratet",
6
6
  "main": "./src/index.css",
package/src/button/button.css CHANGED
@@ -84,7 +84,7 @@
84
84
  border-color: var(--md-color-cta-primary-hover);
85
85
  }
86
86
 
87
- .md-button:active:enabled {
87
+ .md-button:active:not(:disabled):not([disabled]) {
88
88
  background-color: var(--md-color-cta-primary-active);
89
89
  }
90
90
 
@@ -114,11 +114,11 @@
114
114
  padding: calc(var(--md-size-16) - 2px) calc(var(--md-size-20) - 2px);
115
115
  }
116
116
 
117
- .md-button--secondary:hover:enabled {
117
+ .md-button--secondary:hover:not(:disabled):not([disabled]) {
118
118
  background-color: var(--md-color-cta-secondary-hover);
119
119
  }
120
120
 
121
- .md-button--secondary:focus-visible:enabled {
121
+ .md-button--secondary:focus-visible:not(:disabled):not([disabled]) {
122
122
  background-color: var(--md-color-surface-primary);
123
123
  border-color: var(--md-color-cta-primary-focus);
124
124
  color: var(--md-color-cta-primary-focus);
@@ -126,7 +126,7 @@
126
126
  outline-offset: -6px;
127
127
  }
128
128
 
129
- .md-button--secondary:active:enabled {
129
+ .md-button--secondary:active:not(:disabled):not([disabled]) {
130
130
  background-color: var(--md-color-cta-secondary-active);
131
131
  color: var(--md-color-cta-primary-hover);
132
132
  border-color: var(--md-color-cta-primary-hover);
@@ -161,23 +161,23 @@
161
161
  padding: var(--md-size-16) var(--md-size-20);
162
162
  }
163
163
 
164
- .md-button--tertiary:hover:enabled {
164
+ .md-button--tertiary:hover:not(:disabled):not([disabled]) {
165
165
  text-decoration: underline;
166
166
  background-color: var(--md-color-cta-secondary-hover);
167
167
  }
168
168
 
169
- .md-button--tertiary:focus-visible:enabled {
169
+ .md-button--tertiary:focus-visible:not(:disabled):not([disabled]) {
170
170
  border-color: var(--md-color-border-tertiary);
171
171
  outline: var(--md-size-2) var(--md-color-primary-80) solid;
172
172
  background-color: transparent;
173
173
  outline-offset: 0px;
174
174
  }
175
175
 
176
- .md-button--tertiary:focus-visible:hover:enabled {
176
+ .md-button--tertiary:focus-visible:hover:not(:disabled):not([disabled]) {
177
177
  background-color: var(--md-color-surface-info-primary);
178
178
  }
179
179
 
180
- .md-button--tertiary:active:enabled {
180
+ .md-button--tertiary:active:not(:disabled):not([disabled]) {
181
181
  background-color: var(--md-color-cta-secondary-active) !important;
182
182
  color: var(--md-color-text-visited) !important;
183
183
  }
@@ -200,17 +200,17 @@
200
200
  background-color: var(--md-color-attention-error-primary);
201
201
  }
202
202
 
203
- .md-button--danger:focus-visible:enabled {
203
+ .md-button--danger:focus-visible:not(:disabled):not([disabled]) {
204
204
  background-color: var(--md-color-attention-error-primary);
205
205
  outline: var(--md-size-2) var(--md-color-text-inverted) solid;
206
206
  outline-offset: -4px;
207
207
  }
208
208
 
209
- .md-button--danger:hover:enabled {
209
+ .md-button--danger:hover:not(:disabled):not([disabled]) {
210
210
  background-color: var(--md-color-attention-error-primary-hover);
211
211
  }
212
212
 
213
- .md-button--danger:active:enabled {
213
+ .md-button--danger:active:not(:disabled):not([disabled]) {
214
214
  background-color: var(--md-color-attention-error-primary-active);
215
215
  }
216
216
 
@@ -230,12 +230,12 @@
230
230
  padding: calc(var(--md-size-16) - 2px) calc(var(--md-size-20) - 2px);
231
231
  }
232
232
 
233
- .md-button--danger-secondary:hover:enabled {
233
+ .md-button--danger-secondary:hover:not(:disabled):not([disabled]) {
234
234
  background-color: var(--md-color-attention-error-secondary-hover);
235
235
  border-color: var(--md-color-attention-error-primary);
236
236
  }
237
237
 
238
- .md-button--danger-secondary:focus-visible:enabled {
238
+ .md-button--danger-secondary:focus-visible:not(:disabled):not([disabled]) {
239
239
  background-color: var(--md-color-surface-primary);
240
240
  border-color: var(--md-color-attention-error-primary);
241
241
  color: var(--md-color-attention-error-primary);
@@ -243,7 +243,7 @@
243
243
  outline-offset: -6px;
244
244
  }
245
245
 
246
- .md-button--danger-secondary:active:enabled {
246
+ .md-button--danger-secondary:active:not(:disabled):not([disabled]) {
247
247
  background-color: var(--md-color-attention-error-bg);
248
248
  color: var(--md-color-attention-error-primary-hover);
249
249
  border-color: var(--md-color-attention-error-primary-hover);
package/src/iconButton/iconButton.css CHANGED
@@ -107,7 +107,8 @@
107
107
  }
108
108
 
109
109
  .md-icon-button--plain:active:enabled {
110
- background-color: var(--md-color-cta-primary-hover);
110
+ background-color: var(--md-color-cta-secondary-hover);
111
+ outline: var(--md-size-1) var(--md-color-cta-primary-hover) solid;
111
112
  color: var(--md-color-cta-primary-hover);
112
113
  }
113
114