@inspark/components-web 14.0.12 → 14.0.14

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 (41) hide show
  1. package/index.css +14 -10
  2. package/package.json +1 -1
  3. package/src/base/_functions.scss +5 -3
  4. package/src/base/_mixins.scss +4 -3
  5. package/src/base/_variables.scss +14 -12
  6. package/src/button/_mixins.scss +3 -3
  7. package/src/button/_variables.scss +12 -8
  8. package/src/card/_mixins.scss +5 -5
  9. package/src/card/_variables.scss +2 -1
  10. package/src/crop/_mixins.scss +5 -3
  11. package/src/grid/_variables.scss +25 -22
  12. package/src/icon/_mixins.scss +2 -1
  13. package/src/input/_variables.scss +4 -3
  14. package/src/list-group/_mixins.scss +2 -1
  15. package/src/list-group/_variables.scss +4 -2
  16. package/src/mediaqueries/_mixins.scss +14 -13
  17. package/src/nav/_mixins.scss +1 -1
  18. package/src/navbar/_mixins.scss +2 -2
  19. package/src/navbar/_variables.scss +11 -10
  20. package/src/nvd3/_variables-theme-contrast.scss +2 -1
  21. package/src/nvd3/_variables-theme-green.scss +2 -1
  22. package/src/nvd3/_variables-theme-light.scss +2 -1
  23. package/src/nvd3/_variables.scss +2 -1
  24. package/src/ratio/_mixins.scss +5 -3
  25. package/src/sass-mq/_mixins.scss +15 -10
  26. package/src/sidebar/_mixins.scss +2 -1
  27. package/src/theme/_functions.scss +2 -1
  28. package/src/theme/_mixins.scss +3 -2
  29. package/src/theme/blue.scss +26 -25
  30. package/src/theme/contrast.scss +26 -25
  31. package/src/theme/green.scss +26 -25
  32. package/src/theme/light.scss +26 -25
  33. package/src/tools/_tools.rem.scss +7 -6
  34. package/src/tree-table/_mixins.scss +5 -3
  35. package/src/typography/_mixins.scss +11 -8
  36. package/src/typography/_variables.scss +9 -6
  37. package/src/utilities/_utilities.hide.scss +4 -2
  38. package/src/utilities/_utilities.overflow.scss +4 -0
  39. package/src/utilities/_utilities.spacing.scss +4 -2
  40. package/src/utilities/_utilities.typography.scss +2 -1
  41. package/src/utilities/_utilities.widths.scss +6 -4
@@ -1,3 +1,4 @@
1
+ @use "sass:map";
1
2
  @import './mixins';
2
3
  @import "../base/variables";
3
4
  @import "../badge/variables";
@@ -33,7 +34,7 @@
33
34
  @import "../tree-table/variables";
34
35
  @import "../typography/variables";
35
36
 
36
- $ids-theme-property-values: map-merge($ids-theme-property-values, (
37
+ $ids-theme-property-values: map.merge($ids-theme-property-values, (
37
38
  // Primary
38
39
  primary: #0f7a65,
39
40
  primary-rgb: '37, 184, 135',
@@ -78,20 +79,20 @@ $ids-theme-property-values: map-merge($ids-theme-property-values, (
78
79
  state-falsevalue-text: $color-gray-80
79
80
  ));
80
81
 
81
- $ids-base-theme-property-values: map-merge($ids-base-theme-property-values, (
82
+ $ids-base-theme-property-values: map.merge($ids-base-theme-property-values, (
82
83
  body-bg: $color-gray-5,
83
84
  webkit-scrollbar-track-bg: #f1f1f1,
84
85
  webkit-scrollbar-thumb-bg: $color-gray-10,
85
86
  webkit-scrollbar-corner-bg: $color-gray-5
86
87
  ));
87
88
 
88
- $ids-crumb-theme-property-values: map-merge($ids-base-theme-property-values, (
89
+ $ids-crumb-theme-property-values: map.merge($ids-base-theme-property-values, (
89
90
  breadcrumb-bg: $color-base-white,
90
91
  breadcrumb-color: $color-base-black,
91
92
  breadcrumb-active-color: $color-gray-90
92
93
  ));
93
94
 
94
- $ids-badge-theme-property-values: map-merge($ids-badge-theme-property-values, (
95
+ $ids-badge-theme-property-values: map.merge($ids-badge-theme-property-values, (
95
96
  badge-primary-bg: var(--ids-theme-primary, $ids-theme-primary),
96
97
  badge-success-bg: var(--ids-theme-state-success-bg, $state-success-bg),
97
98
  badge-pending-bg: var(--ids-theme-state-pending-bg, $state-pending-bg),
@@ -105,7 +106,7 @@ $ids-badge-theme-property-values: map-merge($ids-badge-theme-property-values, (
105
106
  badge-text-falsevalue: var(--ids-theme-state-falsevalue-text, $state-falsevalue-text)
106
107
  ));
107
108
 
108
- $ids-button-theme-property-values: map-merge($ids-button-theme-property-values, (
109
+ $ids-button-theme-property-values: map.merge($ids-button-theme-property-values, (
109
110
  btn-default-background: $color-gray-5,
110
111
  btn-default-color: var(--ids-theme-text-color, $text-color),
111
112
  btn-default-background--hover: #b8b8b8,
@@ -146,7 +147,7 @@ $ids-button-theme-property-values: map-merge($ids-button-theme-property-values,
146
147
  btn-grouped-border-color: $color-gray-10
147
148
  ));
148
149
 
149
- $ids-checkbox-theme-property-values: map-merge($ids-checkbox-theme-property-values, (
150
+ $ids-checkbox-theme-property-values: map.merge($ids-checkbox-theme-property-values, (
150
151
  checkbox-border-color: $color-gray-80,
151
152
  checkbox-img-checked: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMjQgMjQiPiAgPHRpdGxlPiAgICBJY29uL2NoZWNrYm94X29uICA8L3RpdGxlPiAgPGRlc2M+ICAgIENyZWF0ZWQgd2l0aCBTa2V0Y2guICA8L2Rlc2M+ICA8ZGVmcz4gICAgPHBhdGggaWQ9ImNoZWNrYm94X29uLWEiIGQ9Ik0yLDMuOTkwNzk1MTQgQzIsMi44OTEzMDkzNCAyLjg5ODIxMjM4LDIgMy45OTA3OTUxNCwyIEwyMC4wMDkyMDQ5LDIgQzIxLjEwODY5MDcsMiAyMiwyLjg5ODIxMjM4IDIyLDMuOTkwNzk1MTQgTDIyLDIwLjAwOTIwNDkgQzIyLDIxLjEwODY5MDcgMjEuMTAxNzg3NiwyMiAyMC4wMDkyMDQ5LDIyIEwzLjk5MDc5NTE0LDIyIEMyLjg5MTMwOTM0LDIyIDIsMjEuMTAxNzg3NiAyLDIwLjAwOTIwNDkgTDIsMy45OTA3OTUxNCBaIE05LjMwMjc3MTI2LDE3LjkyNDc3MzMgTDE4LjgwOCw3LjQ2OTE5NjM2IEwxNy4xOTI5MzIyLDYgTDkuMjI4NTI1MywxNC43NjE4OTU3IEw2LjU0MzQ0MjMxLDEyLjA3NjgxMjggTDUsMTMuNjIxMTI4NSBMOS4zMDI3NzEyNiwxNy45MjQ3NzMzIFoiLz4gIDwvZGVmcz4gIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiPiAgICA8cmVjdCB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHg9IjIiIHk9IjIiLz4gICAgPG1hc2sgaWQ9ImNoZWNrYm94X29uLWIiIGZpbGw9IiNmZmYiPiAgICAgIDx1c2UgeGxpbms6aHJlZj0iI2NoZWNrYm94X29uLWEiLz4gICAgPC9tYXNrPiAgICA8Zy8+ICAgIDxnIGZpbGw9IiMzODczODIiIG1hc2s9InVybCgjY2hlY2tib3hfb24tYikiPiAgICAgIDxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgeD0iMCIgeT0iMCIvPiAgICA8L2c+ICA8L2c+PC9zdmc+'),
152
153
  checkbox-disabled-border-color: $color-gray-10,
@@ -163,7 +164,7 @@ $ids-checkbox-theme-property-values: map-merge($ids-checkbox-theme-property-valu
163
164
  checkbox-switch-on-icon-text: $color-base-white,
164
165
  ));
165
166
 
166
- $ids-form-theme-property-values: map-merge($ids-form-theme-property-values, (
167
+ $ids-form-theme-property-values: map.merge($ids-form-theme-property-values, (
167
168
  form-color: $color-base-black,
168
169
  form-color_placeholder: rgba($color-gray-80, 0.7),
169
170
  form-background: rgba($color-base-black, 0.1),
@@ -183,10 +184,10 @@ $ids-form-theme-property-values: map-merge($ids-form-theme-property-values, (
183
184
  form-validation-success: var(--ids-theme-status-success, $ids-theme-status-success),
184
185
  ));
185
186
 
186
- $ids-icon-theme-property-values: map-merge($ids-icon-theme-property-values, (
187
+ $ids-icon-theme-property-values: map.merge($ids-icon-theme-property-values, (
187
188
  ));
188
189
 
189
- $ids-input-theme-property-values: map-merge($ids-input-theme-property-values, (
190
+ $ids-input-theme-property-values: map.merge($ids-input-theme-property-values, (
190
191
  input-tap-highlight-color: $color-base-white,
191
192
  input-tap-highlight-color-rgb: hex-to-rgb-numbers($color-base-white),
192
193
  inuit-forms-border_inner: inset 0 0 0 1px transparent,
@@ -207,18 +208,18 @@ $ids-input-theme-property-values: map-merge($ids-input-theme-property-values, (
207
208
  inuit-forms-validation-success: var(--ids-theme-status-success, $ids-theme-status-success)
208
209
  ));
209
210
 
210
- $ids-input-group-theme-property-values: map-merge($ids-input-group-theme-property-values, (
211
+ $ids-input-group-theme-property-values: map.merge($ids-input-group-theme-property-values, (
211
212
  input-group-addon-border: $color-gray-10,
212
213
  input-group-addon-background: $color-gray-10,
213
214
  input-group-addon-color: $color-gray-80
214
215
  ));
215
216
 
216
- $ids-label-theme-property-values: map-merge($ids-label-theme-property-values, (
217
+ $ids-label-theme-property-values: map.merge($ids-label-theme-property-values, (
217
218
  label-color: $color-gray-90,
218
219
  label-sub-color: $color-gray-80,
219
220
  ));
220
221
 
221
- $ids-list-theme-property-values: map-merge($ids-list-theme-property-values, (
222
+ $ids-list-theme-property-values: map.merge($ids-list-theme-property-values, (
222
223
  list-scrollable-border-color: $color-gray-10,
223
224
  list-scrollable-background: $color-base-white,
224
225
  list-item-background-hover: $color-gray-5,
@@ -226,7 +227,7 @@ $ids-list-theme-property-values: map-merge($ids-list-theme-property-values, (
226
227
  list-item-background-active: rgba(var(--ids-theme-primary-rgb, #{$ids-theme-primary-rgb}), 0.3)
227
228
  ));
228
229
 
229
- $ids-list-group-theme-property-values: map-merge($ids-list-group-theme-property-values, (
230
+ $ids-list-group-theme-property-values: map.merge($ids-list-group-theme-property-values, (
230
231
  list-group-color: $color-base-black,
231
232
  list-group-bg: $color-base-white,
232
233
  list-group-border-color: rgba($color-gray-20, 0.125),
@@ -245,12 +246,12 @@ $ids-list-group-theme-property-values: map-merge($ids-list-group-theme-property-
245
246
  list-group-link-active-bg: rgba(var(--ids-theme-secondary-rgb, $ids-theme-secondary), 0.5),
246
247
  ));
247
248
 
248
- $ids-nav-theme-property-values: map-merge($ids-nav-theme-property-values, (
249
+ $ids-nav-theme-property-values: map.merge($ids-nav-theme-property-values, (
249
250
  nav-link-hover-bg: rgba(var(--ids-theme-primary-rgb, $ids-theme-primary), 0.2),
250
251
  nav-disabled-link-hover-color: $color-gray-40,
251
252
  ));
252
253
 
253
- $ids-navbar-theme-property-values: map-merge($ids-navbar-theme-property-values, (
254
+ $ids-navbar-theme-property-values: map.merge($ids-navbar-theme-property-values, (
254
255
  navbar-default-color: $color-base-black,
255
256
  navbar-default-bg: #0F7A65,
256
257
  navbar-default-border: #dadada,
@@ -270,11 +271,11 @@ $ids-navbar-theme-property-values: map-merge($ids-navbar-theme-property-values,
270
271
  navbar-default-toggle-color: $color-base-black
271
272
  ));
272
273
 
273
- //$ids-nvd3-theme-property-values: map-merge($ids-nvd3-theme-property-values, (
274
+ //$ids-nvd3-theme-property-values: map.merge($ids-nvd3-theme-property-values, (
274
275
  //
275
276
  //));
276
277
 
277
- $ids-panel-theme-property-values: map-merge($ids-panel-theme-property-values, (
278
+ $ids-panel-theme-property-values: map.merge($ids-panel-theme-property-values, (
278
279
  panel-bg: $color-base-white,
279
280
  panel-bg-rgb: hex-to-rgb-numbers($color-base-white),
280
281
  panel-lighter-background: $color-base-white,
@@ -284,17 +285,17 @@ $ids-panel-theme-property-values: map-merge($ids-panel-theme-property-values, (
284
285
  panel-comment-bg-rgb: hex-to-rgb-numbers($color-base-white),
285
286
  ));
286
287
 
287
- $ids-card-theme-property-values: map-merge($ids-card-theme-property-values, (
288
+ $ids-card-theme-property-values: map.merge($ids-card-theme-property-values, (
288
289
  card-border-color: rgba($color-base-white, .125),
289
290
  card-cap-bg: rgba($color-base-white, .03),
290
291
  card-bg: $color-gray-5
291
292
  ));
292
293
 
293
- $ids-radio-theme-property-values: map-merge($ids-radio-theme-property-values, (
294
+ $ids-radio-theme-property-values: map.merge($ids-radio-theme-property-values, (
294
295
  radio-disabled-background: $color-gray-90
295
296
  ));
296
297
 
297
- $ids-select-theme-property-values: map-merge($ids-select-theme-property-values, (
298
+ $ids-select-theme-property-values: map.merge($ids-select-theme-property-values, (
298
299
  select-background: rgba($color-base-black, 0.1),
299
300
  select-arrow: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212%22%20viewBox%3D%220%200%20658%201024%22%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M614.286%20420.571q0%207.429-5.714%2013.143l-266.286%20266.286q-5.714%205.714-13.143%205.714t-13.143-5.714l-266.286-266.286q-5.714-5.714-5.714-13.143t5.714-13.143l28.571-28.571q5.714-5.714%2013.143-5.714t13.143%205.714l224.571%20224.571%20224.571-224.571q5.714-5.714%2013.143-5.714t13.143%205.714l28.571%2028.571q5.714%205.714%205.714%2013.143z%22%2F%3E%3C%2Fsvg%3E'),
300
301
  select-color: $color-base-black,
@@ -312,11 +313,11 @@ $ids-select-theme-property-values: map-merge($ids-select-theme-property-values,
312
313
  status-error: var(--ids-theme-status-error, $ids-theme-status-error),
313
314
  ));
314
315
 
315
- $ids-sidebar-theme-property-values: map-merge($ids-sidebar-theme-property-values, (
316
+ $ids-sidebar-theme-property-values: map.merge($ids-sidebar-theme-property-values, (
316
317
  sidebar-bg: #0F7A65
317
318
  ));
318
319
 
319
- $ids-table-theme-property-values: map-merge($ids-table-theme-property-values, (
320
+ $ids-table-theme-property-values: map.merge($ids-table-theme-property-values, (
320
321
  table-bg: transparent,
321
322
  table-border-color: $color-gray-20,
322
323
  table-th-color: $color-gray-90,
@@ -326,21 +327,21 @@ $ids-table-theme-property-values: map-merge($ids-table-theme-property-values, (
326
327
  table-bg-primary: var(--ids-theme-primary, $ids-theme-primary),
327
328
  ));
328
329
 
329
- $ids-tooltip-theme-property-values: map-merge($ids-tooltip-theme-property-values, (
330
+ $ids-tooltip-theme-property-values: map.merge($ids-tooltip-theme-property-values, (
330
331
  tooltip-bg: rgba($color-base-white, 0.95),
331
332
  tooltip-color: $color-base-black,
332
333
  tooltip-arrow-color: rgba($color-base-white, 0.95),
333
334
  tooltip-arrow-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20viewBox%3D%225%205%2026%2026%22%20preserveAspectRatio%3D%22xMidYMid%20meet%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%3Cdefs%3E%3Cstyle%3E.clr-i-outline%7Bfill%3A%23a32100%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ctitle%3Eexclamation-circle-line%3C%2Ftitle%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20class%3D%22clr-i-outline%20clr-i-outline-path-1%22%20d%3D%22M18%2C6A12%2C12%2C0%2C1%2C0%2C30%2C18%2C12%2C12%2C0%2C0%2C0%2C18%2C6Zm0%2C22A10%2C10%2C0%2C1%2C1%2C28%2C18%2C10%2C10%2C0%2C0%2C1%2C18%2C28Z%22%3E%3C%2Fpath%3E%3Cpath%20class%3D%22clr-i-outline%20clr-i-outline-path-2%22%20d%3D%22M18%2C20.07a1.3%2C1.3%2C0%2C0%2C1-1.3-1.3v-6a1.3%2C1.3%2C0%2C1%2C1%2C2.6%2C0v6A1.3%2C1.3%2C0%2C0%2C1%2C18%2C20.07Z%22%3E%3C%2Fpath%3E%3Ccircle%20class%3D%22clr-i-outline%20clr-i-outline-path-3%22%20cx%3D%2217.95%22%20cy%3D%2223.02%22%20r%3D%221.5%22%3E%3C%2Fcircle%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E")
334
335
  ));
335
336
 
336
- $ids-tree-table-theme-property-values: map-merge($ids-tree-table-theme-property-values, (
337
+ $ids-tree-table-theme-property-values: map.merge($ids-tree-table-theme-property-values, (
337
338
  tree-table-cell-background: $color-gray-5,
338
339
  tree-table__cell-content_header: $color-gray-80,
339
340
  tree-table-cell-header-background: $color-base-black,
340
341
  tree-table-cell-status-none-background: $color-gray-20
341
342
  ));
342
343
 
343
- $ids-typography-theme-property-values: map-merge($ids-typography-theme-property-values, (
344
+ $ids-typography-theme-property-values: map.merge($ids-typography-theme-property-values, (
344
345
  link-color: var(--ids-theme-primary, $ids-theme-primary),
345
346
  link-hover-color: var(--ids-theme-secondary, $ids-theme-secondary),
346
347
  link-disabled-color: $link-disabled-color,
@@ -1,3 +1,4 @@
1
+ @use "sass:map";
1
2
  @import './mixins';
2
3
  @import "../base/variables";
3
4
  @import "../badge/variables";
@@ -33,7 +34,7 @@
33
34
  @import "../tree-table/variables";
34
35
  @import "../typography/variables";
35
36
 
36
- $ids-theme-property-values: map-merge($ids-theme-property-values, (
37
+ $ids-theme-property-values: map.merge($ids-theme-property-values, (
37
38
  // Primary
38
39
  primary: $color-blue-dark-500,
39
40
  primary-rgb: '56, 115, 130',
@@ -78,20 +79,20 @@ $ids-theme-property-values: map-merge($ids-theme-property-values, (
78
79
  state-falsevalue-text: $color-gray-80
79
80
  ));
80
81
 
81
- $ids-base-theme-property-values: map-merge($ids-base-theme-property-values, (
82
+ $ids-base-theme-property-values: map.merge($ids-base-theme-property-values, (
82
83
  body-bg: $color-gray-5,
83
84
  webkit-scrollbar-track-bg: #f1f1f1,
84
85
  webkit-scrollbar-thumb-bg: $color-gray-10,
85
86
  webkit-scrollbar-corner-bg: $color-gray-5
86
87
  ));
87
88
 
88
- $ids-crumb-theme-property-values: map-merge($ids-base-theme-property-values, (
89
+ $ids-crumb-theme-property-values: map.merge($ids-base-theme-property-values, (
89
90
  breadcrumb-bg: $color-base-white,
90
91
  breadcrumb-color: $color-base-black,
91
92
  breadcrumb-active-color: $color-gray-90
92
93
  ));
93
94
 
94
- $ids-badge-theme-property-values: map-merge($ids-badge-theme-property-values, (
95
+ $ids-badge-theme-property-values: map.merge($ids-badge-theme-property-values, (
95
96
  badge-primary-bg: var(--ids-theme-primary, $ids-theme-primary),
96
97
  badge-success-bg: var(--ids-theme-state-success-bg, $state-success-bg),
97
98
  badge-pending-bg: var(--ids-theme-state-pending-bg, $state-pending-bg),
@@ -105,7 +106,7 @@ $ids-badge-theme-property-values: map-merge($ids-badge-theme-property-values, (
105
106
  badge-text-falsevalue: var(--ids-theme-state-falsevalue-text, $state-falsevalue-text)
106
107
  ));
107
108
 
108
- $ids-button-theme-property-values: map-merge($ids-button-theme-property-values, (
109
+ $ids-button-theme-property-values: map.merge($ids-button-theme-property-values, (
109
110
  btn-default-background: $color-gray-5,
110
111
  btn-default-color: var(--ids-theme-text-color, $text-color),
111
112
  btn-default-background--hover: #b8b8b8,
@@ -146,7 +147,7 @@ $ids-button-theme-property-values: map-merge($ids-button-theme-property-values,
146
147
  btn-grouped-border-color: $color-gray-10
147
148
  ));
148
149
 
149
- $ids-checkbox-theme-property-values: map-merge($ids-checkbox-theme-property-values, (
150
+ $ids-checkbox-theme-property-values: map.merge($ids-checkbox-theme-property-values, (
150
151
  checkbox-border-color: $color-gray-80,
151
152
  checkbox-img-checked: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMjQgMjQiPiAgPHRpdGxlPiAgICBJY29uL2NoZWNrYm94X29uICA8L3RpdGxlPiAgPGRlc2M+ICAgIENyZWF0ZWQgd2l0aCBTa2V0Y2guICA8L2Rlc2M+ICA8ZGVmcz4gICAgPHBhdGggaWQ9ImNoZWNrYm94X29uLWEiIGQ9Ik0yLDMuOTkwNzk1MTQgQzIsMi44OTEzMDkzNCAyLjg5ODIxMjM4LDIgMy45OTA3OTUxNCwyIEwyMC4wMDkyMDQ5LDIgQzIxLjEwODY5MDcsMiAyMiwyLjg5ODIxMjM4IDIyLDMuOTkwNzk1MTQgTDIyLDIwLjAwOTIwNDkgQzIyLDIxLjEwODY5MDcgMjEuMTAxNzg3NiwyMiAyMC4wMDkyMDQ5LDIyIEwzLjk5MDc5NTE0LDIyIEMyLjg5MTMwOTM0LDIyIDIsMjEuMTAxNzg3NiAyLDIwLjAwOTIwNDkgTDIsMy45OTA3OTUxNCBaIE05LjMwMjc3MTI2LDE3LjkyNDc3MzMgTDE4LjgwOCw3LjQ2OTE5NjM2IEwxNy4xOTI5MzIyLDYgTDkuMjI4NTI1MywxNC43NjE4OTU3IEw2LjU0MzQ0MjMxLDEyLjA3NjgxMjggTDUsMTMuNjIxMTI4NSBMOS4zMDI3NzEyNiwxNy45MjQ3NzMzIFoiLz4gIDwvZGVmcz4gIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiPiAgICA8cmVjdCB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHg9IjIiIHk9IjIiLz4gICAgPG1hc2sgaWQ9ImNoZWNrYm94X29uLWIiIGZpbGw9IiNmZmYiPiAgICAgIDx1c2UgeGxpbms6aHJlZj0iI2NoZWNrYm94X29uLWEiLz4gICAgPC9tYXNrPiAgICA8Zy8+ICAgIDxnIGZpbGw9IiMzODczODIiIG1hc2s9InVybCgjY2hlY2tib3hfb24tYikiPiAgICAgIDxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgeD0iMCIgeT0iMCIvPiAgICA8L2c+ICA8L2c+PC9zdmc+'),
152
153
  checkbox-disabled-border-color: $color-gray-10,
@@ -163,7 +164,7 @@ $ids-checkbox-theme-property-values: map-merge($ids-checkbox-theme-property-valu
163
164
  checkbox-switch-on-icon-text: $color-base-white,
164
165
  ));
165
166
 
166
- $ids-form-theme-property-values: map-merge($ids-form-theme-property-values, (
167
+ $ids-form-theme-property-values: map.merge($ids-form-theme-property-values, (
167
168
  form-color: $color-base-black,
168
169
  form-color_placeholder: rgba($color-gray-80, 0.7),
169
170
  form-background: rgba($color-base-black, 0.1),
@@ -183,10 +184,10 @@ $ids-form-theme-property-values: map-merge($ids-form-theme-property-values, (
183
184
  form-validation-success: var(--ids-theme-status-success, $ids-theme-status-success),
184
185
  ));
185
186
 
186
- $ids-icon-theme-property-values: map-merge($ids-icon-theme-property-values, (
187
+ $ids-icon-theme-property-values: map.merge($ids-icon-theme-property-values, (
187
188
  ));
188
189
 
189
- $ids-input-theme-property-values: map-merge($ids-input-theme-property-values, (
190
+ $ids-input-theme-property-values: map.merge($ids-input-theme-property-values, (
190
191
  input-tap-highlight-color: $color-base-white,
191
192
  input-tap-highlight-color-rgb: hex-to-rgb-numbers($color-base-white),
192
193
  inuit-forms-border_inner: inset 0 0 0 1px transparent,
@@ -207,18 +208,18 @@ $ids-input-theme-property-values: map-merge($ids-input-theme-property-values, (
207
208
  inuit-forms-validation-success: var(--ids-theme-status-success, $ids-theme-status-success)
208
209
  ));
209
210
 
210
- $ids-input-group-theme-property-values: map-merge($ids-input-group-theme-property-values, (
211
+ $ids-input-group-theme-property-values: map.merge($ids-input-group-theme-property-values, (
211
212
  input-group-addon-border: $color-gray-10,
212
213
  input-group-addon-background: $color-gray-10,
213
214
  input-group-addon-color: $color-gray-80
214
215
  ));
215
216
 
216
- $ids-label-theme-property-values: map-merge($ids-label-theme-property-values, (
217
+ $ids-label-theme-property-values: map.merge($ids-label-theme-property-values, (
217
218
  label-color: $color-gray-90,
218
219
  label-sub-color: $color-gray-80,
219
220
  ));
220
221
 
221
- $ids-list-theme-property-values: map-merge($ids-list-theme-property-values, (
222
+ $ids-list-theme-property-values: map.merge($ids-list-theme-property-values, (
222
223
  list-scrollable-border-color: $color-gray-10,
223
224
  list-scrollable-background: $color-base-white,
224
225
  list-item-background-hover: $color-gray-5,
@@ -226,7 +227,7 @@ $ids-list-theme-property-values: map-merge($ids-list-theme-property-values, (
226
227
  list-item-background-active: rgba(var(--ids-theme-primary-rgb, #{$ids-theme-primary-rgb}), 0.3)
227
228
  ));
228
229
 
229
- $ids-list-group-theme-property-values: map-merge($ids-list-group-theme-property-values, (
230
+ $ids-list-group-theme-property-values: map.merge($ids-list-group-theme-property-values, (
230
231
  list-group-color: $color-base-black,
231
232
  list-group-bg: $color-base-white,
232
233
  list-group-border-color: rgba($color-gray-20, 0.125),
@@ -245,12 +246,12 @@ $ids-list-group-theme-property-values: map-merge($ids-list-group-theme-property-
245
246
  list-group-link-active-bg: rgba(var(--ids-theme-secondary-rgb, $ids-theme-secondary), 0.5),
246
247
  ));
247
248
 
248
- $ids-nav-theme-property-values: map-merge($ids-nav-theme-property-values, (
249
+ $ids-nav-theme-property-values: map.merge($ids-nav-theme-property-values, (
249
250
  nav-link-hover-bg: rgba(var(--ids-theme-primary-rgb, $ids-theme-primary), 0.2),
250
251
  nav-disabled-link-hover-color: $color-gray-40,
251
252
  ));
252
253
 
253
- $ids-navbar-theme-property-values: map-merge($ids-navbar-theme-property-values, (
254
+ $ids-navbar-theme-property-values: map.merge($ids-navbar-theme-property-values, (
254
255
  navbar-default-color: $color-base-black,
255
256
  navbar-default-bg: $color-gray-5,
256
257
  navbar-default-border: #dadada,
@@ -270,11 +271,11 @@ $ids-navbar-theme-property-values: map-merge($ids-navbar-theme-property-values,
270
271
  navbar-default-toggle-color: $color-base-black
271
272
  ));
272
273
 
273
- //$ids-nvd3-theme-property-values: map-merge($ids-nvd3-theme-property-values, (
274
+ //$ids-nvd3-theme-property-values: map.merge($ids-nvd3-theme-property-values, (
274
275
  //
275
276
  //));
276
277
 
277
- $ids-panel-theme-property-values: map-merge($ids-panel-theme-property-values, (
278
+ $ids-panel-theme-property-values: map.merge($ids-panel-theme-property-values, (
278
279
  panel-bg: $color-base-white,
279
280
  panel-bg-rgb: hex-to-rgb-numbers($color-base-white),
280
281
  panel-lighter-background: $color-base-white,
@@ -284,17 +285,17 @@ $ids-panel-theme-property-values: map-merge($ids-panel-theme-property-values, (
284
285
  panel-comment-bg-rgb: hex-to-rgb-numbers($color-base-white),
285
286
  ));
286
287
 
287
- $ids-card-theme-property-values: map-merge($ids-card-theme-property-values, (
288
+ $ids-card-theme-property-values: map.merge($ids-card-theme-property-values, (
288
289
  card-border-color: rgba($color-base-white, .125),
289
290
  card-cap-bg: rgba($color-base-white, .03),
290
291
  card-bg: $color-gray-5
291
292
  ));
292
293
 
293
- $ids-radio-theme-property-values: map-merge($ids-radio-theme-property-values, (
294
+ $ids-radio-theme-property-values: map.merge($ids-radio-theme-property-values, (
294
295
  radio-disabled-background: $color-gray-90
295
296
  ));
296
297
 
297
- $ids-select-theme-property-values: map-merge($ids-select-theme-property-values, (
298
+ $ids-select-theme-property-values: map.merge($ids-select-theme-property-values, (
298
299
  select-background: rgba($color-base-black, 0.1),
299
300
  select-arrow: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212%22%20viewBox%3D%220%200%20658%201024%22%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M614.286%20420.571q0%207.429-5.714%2013.143l-266.286%20266.286q-5.714%205.714-13.143%205.714t-13.143-5.714l-266.286-266.286q-5.714-5.714-5.714-13.143t5.714-13.143l28.571-28.571q5.714-5.714%2013.143-5.714t13.143%205.714l224.571%20224.571%20224.571-224.571q5.714-5.714%2013.143-5.714t13.143%205.714l28.571%2028.571q5.714%205.714%205.714%2013.143z%22%2F%3E%3C%2Fsvg%3E'),
300
301
  select-color: $color-base-black,
@@ -312,11 +313,11 @@ $ids-select-theme-property-values: map-merge($ids-select-theme-property-values,
312
313
  status-error: var(--ids-theme-status-error, $ids-theme-status-error),
313
314
  ));
314
315
 
315
- $ids-sidebar-theme-property-values: map-merge($ids-sidebar-theme-property-values, (
316
+ $ids-sidebar-theme-property-values: map.merge($ids-sidebar-theme-property-values, (
316
317
  sidebar-bg: $color-gray-40
317
318
  ));
318
319
 
319
- $ids-table-theme-property-values: map-merge($ids-table-theme-property-values, (
320
+ $ids-table-theme-property-values: map.merge($ids-table-theme-property-values, (
320
321
  table-bg: transparent,
321
322
  table-border-color: $color-gray-20,
322
323
  table-th-color: $color-gray-90,
@@ -326,21 +327,21 @@ $ids-table-theme-property-values: map-merge($ids-table-theme-property-values, (
326
327
  table-bg-primary: var(--ids-theme-primary, $ids-theme-primary),
327
328
  ));
328
329
 
329
- $ids-tooltip-theme-property-values: map-merge($ids-tooltip-theme-property-values, (
330
+ $ids-tooltip-theme-property-values: map.merge($ids-tooltip-theme-property-values, (
330
331
  tooltip-bg: rgba($color-base-white, 0.95),
331
332
  tooltip-color: $color-base-black,
332
333
  tooltip-arrow-color: rgba($color-base-white, 0.95),
333
334
  tooltip-arrow-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20viewBox%3D%225%205%2026%2026%22%20preserveAspectRatio%3D%22xMidYMid%20meet%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%3Cdefs%3E%3Cstyle%3E.clr-i-outline%7Bfill%3A%23a32100%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ctitle%3Eexclamation-circle-line%3C%2Ftitle%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20class%3D%22clr-i-outline%20clr-i-outline-path-1%22%20d%3D%22M18%2C6A12%2C12%2C0%2C1%2C0%2C30%2C18%2C12%2C12%2C0%2C0%2C0%2C18%2C6Zm0%2C22A10%2C10%2C0%2C1%2C1%2C28%2C18%2C10%2C10%2C0%2C0%2C1%2C18%2C28Z%22%3E%3C%2Fpath%3E%3Cpath%20class%3D%22clr-i-outline%20clr-i-outline-path-2%22%20d%3D%22M18%2C20.07a1.3%2C1.3%2C0%2C0%2C1-1.3-1.3v-6a1.3%2C1.3%2C0%2C1%2C1%2C2.6%2C0v6A1.3%2C1.3%2C0%2C0%2C1%2C18%2C20.07Z%22%3E%3C%2Fpath%3E%3Ccircle%20class%3D%22clr-i-outline%20clr-i-outline-path-3%22%20cx%3D%2217.95%22%20cy%3D%2223.02%22%20r%3D%221.5%22%3E%3C%2Fcircle%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E")
334
335
  ));
335
336
 
336
- $ids-tree-table-theme-property-values: map-merge($ids-tree-table-theme-property-values, (
337
+ $ids-tree-table-theme-property-values: map.merge($ids-tree-table-theme-property-values, (
337
338
  tree-table-cell-background: $color-gray-5,
338
339
  tree-table__cell-content_header: $color-gray-80,
339
340
  tree-table-cell-header-background: $color-base-black,
340
341
  tree-table-cell-status-none-background: $color-gray-20
341
342
  ));
342
343
 
343
- $ids-typography-theme-property-values: map-merge($ids-typography-theme-property-values, (
344
+ $ids-typography-theme-property-values: map.merge($ids-typography-theme-property-values, (
344
345
  link-color: var(--ids-theme-primary, $ids-theme-primary),
345
346
  link-hover-color: var(--ids-theme-secondary, $ids-theme-secondary),
346
347
  link-disabled-color: $link-disabled-color,
@@ -3,12 +3,13 @@
3
3
  // ======================================================================== */
4
4
 
5
5
  // Convert any px value into its rem equivalent.
6
-
6
+ @use "sass:math";
7
+ @use "sass:meta";
7
8
  @function inuit-rem($value) {
8
9
 
9
- @if (type-of($value) == number) {
10
+ @if (meta.type-of($value) == number) {
10
11
 
11
- @if (unit($value) != "px") {
12
+ @if (math.unit($value) != "px") {
12
13
  @error "`#{$value}` needs to be a pixel value.";
13
14
  }
14
15
 
@@ -16,7 +17,7 @@
16
17
  @error "`#{$value}` needs to be a number.";
17
18
  }
18
19
 
19
- @return $value / $inuit-global-font-size * 1rem;
20
+ @return math.div($value, $inuit-global-font-size) * 1rem;
20
21
 
21
22
  }
22
23
 
@@ -30,9 +31,9 @@
30
31
 
31
32
  @mixin inuit-rem($property, $value) {
32
33
 
33
- @if (type-of($value) == number) {
34
+ @if (meta.type-of($value) == number) {
34
35
 
35
- @if (unit($value) != "px") {
36
+ @if (math.unit($value) != "px") {
36
37
  @error "`#{$value}` needs to be a pixel value.";
37
38
  }
38
39
 
@@ -1,3 +1,5 @@
1
+ @use "sass:color";
2
+ @use "sass:map";
1
3
  @import "../base/variables";
2
4
  @import "./variables";
3
5
  @import "../mediaqueries/mixins";
@@ -18,7 +20,7 @@ Advanced table-like component.
18
20
  position: relative;
19
21
  align-content: flex-start;
20
22
 
21
- @media (min-width: #{map-get($screen-limits, large)}) {
23
+ @media (min-width: #{map.get($screen-limits, large)}) {
22
24
  overflow: hidden;
23
25
  height: calc(100% - 50px);
24
26
  //height: calc(100vh - 306px);
@@ -144,7 +146,7 @@ Advanced table-like component.
144
146
  }
145
147
 
146
148
  .c-tree-table_controller_selected {
147
- color: lighten($ids-theme-primary, 10%);
149
+ color: color.adjust($ids-theme-primary, $lightness: 10%);
148
150
  color: var(--ids-theme-primary, $ids-theme-primary);
149
151
  filter: brightness(110%);
150
152
  }
@@ -155,7 +157,7 @@ Advanced table-like component.
155
157
  }
156
158
 
157
159
  .c-tree-table_device_selected {
158
- color: lighten($ids-theme-primary, 10%);
160
+ color: color.adjust($ids-theme-primary, $lightness: 10%);
159
161
  color: var(--ids-theme-primary, $ids-theme-primary);
160
162
  filter: brightness(110%);
161
163
  }
@@ -1,3 +1,6 @@
1
+ @use "sass:map";
2
+ @use "sass:math";
3
+ @use "sass:meta";
1
4
  @import "./variables";
2
5
 
3
6
  ///* ========================================================================
@@ -34,8 +37,8 @@
34
37
  // Generate a font-size and baseline-compatible line-height.
35
38
  @mixin inuit-font-size($font-size, $line-height: auto, $important: false) {
36
39
 
37
- @if (type-of($font-size) == number) {
38
- @if (unit($font-size) != "px") {
40
+ @if (meta.type-of($font-size) == number) {
41
+ @if (math.unit($font-size) != "px") {
39
42
  @error "`#{$font-size}` needs to be a pixel value.";
40
43
  }
41
44
  } @else {
@@ -52,15 +55,15 @@
52
55
 
53
56
  // We provide a `px` fallback for old IEs not supporting `rem` values.
54
57
  font-size: $font-size $important;
55
- font-size: ($font-size / $inuit-global-font-size) * 1rem $important;
58
+ font-size: math.div($font-size, $inuit-global-font-size) * 1rem $important;
56
59
 
57
60
  @if ($line-height == 'auto') {
58
- line-height: ceil($font-size / $inuit-global-line-height) * ($inuit-global-line-height / $font-size) $important;
61
+ line-height: math.ceil(math.div($font-size, $inuit-global-line-height)) * math.div($inuit-global-line-height, $font-size) $important;
59
62
  }
60
63
 
61
64
  @else {
62
65
 
63
- @if (type-of($line-height) == number or $line-height == 'inherit' or $line-height == 'normal') {
66
+ @if (meta.type-of($line-height) == number or $line-height == 'inherit' or $line-height == 'normal') {
64
67
  line-height: $line-height $important;
65
68
  }
66
69
 
@@ -341,7 +344,7 @@
341
344
  font-weight: 300;
342
345
  line-height: 0.9;
343
346
 
344
- @media (min-width: #{map-get($screen-limits, xlarge)}) {
347
+ @media (min-width: #{map.get($screen-limits, xlarge)}) {
345
348
  font-size: 3rem;
346
349
  }
347
350
  }
@@ -351,7 +354,7 @@
351
354
  font-weight: 300;
352
355
  line-height: 0.9;
353
356
 
354
- @media (min-width: #{map-get($screen-limits, xlarge)}) {
357
+ @media (min-width: #{map.get($screen-limits, xlarge)}) {
355
358
  font-size: 2rem;
356
359
  }
357
360
  }
@@ -361,7 +364,7 @@
361
364
  font-weight: 300;
362
365
  line-height: 0.9;
363
366
 
364
- @media (min-width: #{map-get($screen-limits, xlarge)}) {
367
+ @media (min-width: #{map.get($screen-limits, xlarge)}) {
365
368
  font-size: 1.5rem;
366
369
  }
367
370
  }
@@ -1,3 +1,5 @@
1
+ @use "sass:color";
2
+ @use "sass:math";
1
3
  @import "../theme/variables";
2
4
  @import "../base/functions";
3
5
 
@@ -7,7 +9,8 @@
7
9
 
8
10
  $link-color: $ids-theme-primary !default;
9
11
  $link-decoration: none !default;
10
- $link-hover-color: darken($link-color, 15%) !default;
12
+ $link-hover-color: color.adjust($link-color, $lightness: -15%)!default;
13
+ $link-hover-color-old: color.adjust($link-color, $lightness: -15%)!default;
11
14
  $link-disabled-color: $color-gray-40 !default;
12
15
  $link-hover-decoration: underline !default;
13
16
 
@@ -41,11 +44,11 @@ $line-height-1: 1;
41
44
 
42
45
  $paragraph-color: $color-base-white !default;
43
46
 
44
- $inuit-font-size-h1: round($inuit-global-font-size * 2.25) !default; // 32px
45
- $inuit-font-size-h2: round($inuit-global-font-size * 1.75) !default; //25px
46
- $inuit-font-size-h3: round($inuit-global-font-size * 1.5) !default; // 21px
47
- $inuit-font-size-h4: round($inuit-global-font-size * 1.25) !default; // 18px
48
- $inuit-font-size-h5: round($inuit-global-font-size * 1.125) !default; // 16px
47
+ $inuit-font-size-h1: math.round($inuit-global-font-size * 2.25) !default; // 32px
48
+ $inuit-font-size-h2: math.round($inuit-global-font-size * 1.75) !default; //25px
49
+ $inuit-font-size-h3: math.round($inuit-global-font-size * 1.5) !default; // 21px
50
+ $inuit-font-size-h4: math.round($inuit-global-font-size * 1.25) !default; // 18px
51
+ $inuit-font-size-h5: math.round($inuit-global-font-size * 1.125) !default; // 16px
49
52
  $inuit-font-size-h6: $inuit-global-font-size !default; // 14px
50
53
  $inuit-font-size-large: $inuit-global-font-size * 1.125 !default; // 16px
51
54
  $inuit-font-size-small: 12px !default; // 12px
@@ -7,6 +7,8 @@
7
7
  * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
8
8
  */
9
9
 
10
+ @use "sass:map";
11
+
10
12
  .u-hidden-visually {
11
13
  @include inuit-hidden-visually();
12
14
  }
@@ -24,13 +26,13 @@
24
26
  }
25
27
 
26
28
  .u-hidden-large-down {
27
- @media (max-width: #{map-get($screen-limits, large)}) {
29
+ @media (max-width: #{map.get($screen-limits, large)}) {
28
30
  display: none;
29
31
  }
30
32
  }
31
33
 
32
34
  .u-hidden\@medium-down {
33
- @media (max-width: #{map-get($screen-limits, medium)}) {
35
+ @media (max-width: #{map.get($screen-limits, medium)}) {
34
36
  display: none;
35
37
  }
36
38
  }
@@ -10,6 +10,10 @@
10
10
  overflow: hidden;
11
11
  }
12
12
 
13
+ .u-overflow-visible {
14
+ overflow: visible;
15
+ }
16
+
13
17
  .u-overflow-y-auto {
14
18
  overflow-y: auto;
15
19
  }
@@ -15,6 +15,8 @@
15
15
 
16
16
  /* stylelint-disable string-quotes */
17
17
 
18
+ @use "sass:map";
19
+
18
20
  $inuit-spacing-directions: (
19
21
  null: null,
20
22
  '-top': '-top',
@@ -61,13 +63,13 @@ $inuit-spacing-sizes: (
61
63
  }
62
64
 
63
65
  .u-margin-bottom-none\@large {
64
- @media (min-width: #{map-get($screen-limits, large)}) {
66
+ @media (min-width: #{map.get($screen-limits, large)}) {
65
67
  margin-bottom: 0 !important;
66
68
  }
67
69
  }
68
70
 
69
71
  .u-padding-right-tiny\@large {
70
- @media (min-width: #{map-get($screen-limits, large)}) {
72
+ @media (min-width: #{map.get($screen-limits, large)}) {
71
73
  padding-right: $unit-tiny !important;
72
74
  }
73
75
  }
@@ -1,3 +1,4 @@
1
+ @use "sass:map";
1
2
  @import "../theme/variables";
2
3
  @import "../typography/variables";
3
4
  @import "../mediaqueries/variables";
@@ -102,7 +103,7 @@
102
103
  }
103
104
 
104
105
  .u-small\@xlarge {
105
- @media (min-width: #{map-get($screen-limits, xlarge)}) {
106
+ @media (min-width: #{map.get($screen-limits, xlarge)}) {
106
107
  @include inuit-font-size($inuit-font-size-small);
107
108
  }
108
109
  }