@entur/tab 0.4.77-beta.0 → 0.4.78

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/dist/styles.css +28 -0
  2. package/package.json +4 -4
package/dist/styles.css CHANGED
@@ -209,6 +209,7 @@
209
209
  bottom: 0;
210
210
  left: 0;
211
211
  right: 0;
212
+ background-color: #e3e6e8;
212
213
  background-color: var(--components-tab-standard-border);
213
214
  display: block;
214
215
  height: 0.125rem;
@@ -216,6 +217,7 @@
216
217
  z-index: -1;
217
218
  }
218
219
  .eds-contrast .eds-tab-list::after {
220
+ background-color: #aeb7e2;
219
221
  background-color: var(--components-tab-contrast-border);
220
222
  }
221
223
  .eds-tab-list::-webkit-scrollbar {
@@ -226,9 +228,11 @@
226
228
  -webkit-appearance: none;
227
229
  -moz-appearance: none;
228
230
  appearance: none;
231
+ background: #edf0f2;
229
232
  background: var(--components-tab-standard-fill-unselected);
230
233
  border: 0.125rem solid transparent;
231
234
  border-radius: 0.25rem 0.25rem 0 0;
235
+ color: #181c56;
232
236
  color: var(--components-tab-standard-text);
233
237
  cursor: pointer;
234
238
  font-family: inherit;
@@ -245,15 +249,20 @@
245
249
  min-width: 0;
246
250
  }
247
251
  .eds-contrast .eds-tab {
252
+ background-color: #393d79;
248
253
  background-color: var(--components-tab-contrast-fill-unselected);
254
+ color: #ffffff;
249
255
  color: var(--components-tab-contrast-text);
250
256
  }
251
257
  .eds-tab:hover {
258
+ background-color: #e3e6e8;
252
259
  background-color: var(--components-tab-standard-fill-hover);
253
260
  color: var(--components-menu-tableofcontent-standard-text-selected);
254
261
  }
255
262
  .eds-contrast .eds-tab:hover {
263
+ background-color: #626493;
256
264
  background-color: var(--components-tab-contrast-fill-hover);
265
+ color: #ffffff;
257
266
  color: var(--components-tab-contrast-text);
258
267
  }
259
268
  .eds-tab + .eds-tab {
@@ -265,30 +274,40 @@
265
274
  bottom: -0.125rem;
266
275
  left: -0.125rem;
267
276
  right: -0.125rem;
277
+ background-color: #e3e6e8;
268
278
  background-color: var(--components-tab-standard-border);
269
279
  display: block;
270
280
  height: 0.125rem;
271
281
  }
272
282
  .eds-contrast .eds-tab::after {
283
+ background-color: #aeb7e2;
273
284
  background-color: var(--components-tab-contrast-border);
274
285
  }
275
286
  .eds-tab[aria-selected=true] {
287
+ background-color: #ffffff;
276
288
  background-color: var(--components-tab-standard-fill-selected);
289
+ border-color: #e3e6e8;
277
290
  border-color: var(--components-tab-standard-border);
291
+ color: #181c56;
278
292
  color: var(--components-tab-standard-text);
279
293
  font-weight: 600;
280
294
  }
281
295
  .eds-contrast .eds-tab[aria-selected=true] {
296
+ background-color: #181c56;
282
297
  background-color: var(--components-tab-contrast-fill-selected);
298
+ color: #ffffff;
283
299
  color: var(--components-tab-contrast-text);
300
+ border-color: #aeb7e2;
284
301
  border-color: var(--components-tab-contrast-border);
285
302
  }
286
303
  .eds-tab[aria-selected=true]::after {
304
+ background-color: #ffffff;
287
305
  background-color: var(--components-tab-standard-fill-selected);
288
306
  left: 0;
289
307
  right: 0;
290
308
  }
291
309
  .eds-contrast .eds-tab[aria-selected=true]::after {
310
+ background-color: #181c56;
292
311
  background-color: var(--components-tab-contrast-fill-selected);
293
312
  }
294
313
  .eds-tab[aria-selected=true]::before {
@@ -297,6 +316,7 @@
297
316
  margin: 0 auto;
298
317
  width: 2rem;
299
318
  height: 3px;
319
+ background: #ff5959;
300
320
  background: var(--components-tab-standard-underline-selected);
301
321
  position: absolute;
302
322
  bottom: 0.25rem;
@@ -307,22 +327,28 @@
307
327
  background: transparent;
308
328
  }
309
329
  .eds-tab[disabled] {
330
+ background: #cfd2d4;
310
331
  background: var(--components-tab-standard-fill-disabled);
311
332
  border-color: none;
333
+ color: #515254;
312
334
  color: var(--components-tab-standard-text-disabled);
313
335
  cursor: not-allowed;
314
336
  }
315
337
  .eds-contrast .eds-tab[disabled] {
338
+ background: rgba(84, 86, 140, 0.4);
316
339
  background: var(--components-tab-contrast-fill-disabled);
317
340
  border-color: none;
341
+ color: #b6b8ba;
318
342
  color: var(--components-tab-contrast-text-disabled);
319
343
  }
320
344
  .eds-tab:focus {
321
345
  outline: 2px solid #181c56;
346
+ outline-color: #181c56;
322
347
  outline-color: var(--basecolors-stroke-focus-standard);
323
348
  outline-offset: 0.125rem;
324
349
  }
325
350
  .eds-contrast .eds-tab:focus {
351
+ outline-color: #aeb7e2;
326
352
  outline-color: var(--basecolors-stroke-focus-contrast);
327
353
  }
328
354
 
@@ -332,9 +358,11 @@
332
358
 
333
359
  .eds-tab-panel:focus {
334
360
  outline: 2px solid #181c56;
361
+ outline-color: #181c56;
335
362
  outline-color: var(--basecolors-stroke-focus-standard);
336
363
  outline-offset: 0.125rem;
337
364
  }
338
365
  .eds-contrast .eds-tab-panel:focus {
366
+ outline-color: #aeb7e2;
339
367
  outline-color: var(--basecolors-stroke-focus-contrast);
340
368
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entur/tab",
3
- "version": "0.4.77-beta.0",
3
+ "version": "0.4.78",
4
4
  "license": "EUPL-1.2",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/tab.esm.js",
@@ -26,13 +26,13 @@
26
26
  "react-dom": ">=16.8.0"
27
27
  },
28
28
  "dependencies": {
29
- "@entur/tokens": "^3.17.4-beta.0",
30
- "@entur/utils": "^0.12.2-beta.0",
29
+ "@entur/tokens": "^3.17.5",
30
+ "@entur/utils": "^0.12.2",
31
31
  "@reach/tabs": "^0.15.0",
32
32
  "classnames": "^2.3.1"
33
33
  },
34
34
  "devDependencies": {
35
35
  "dts-cli": "2.0.5"
36
36
  },
37
- "gitHead": "b213fa4fd10a1a07abada3fa987b7ee2ed110ac2"
37
+ "gitHead": "1a989376d61ab59a8c554a9cab733039aef8b2eb"
38
38
  }