@eturnity/eturnity_reusable_components 8.34.0-EPDM-16204.1 → 8.37.0-EPDM-16798.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 (11) hide show
  1. package/dist/main.es199.js +6 -4
  2. package/dist/main.es348.js +4 -4
  3. package/dist/main.es559.js +1 -1
  4. package/dist/main.es708.js +1 -1
  5. package/dist/main.es8.js +91 -66
  6. package/package.json +1 -1
  7. package/src/assets/svgIcons/electricity_tariff.svg +2 -2
  8. package/src/assets/svgIcons/suitcase.svg +2 -2
  9. package/src/assets/theme.js +78 -63
  10. package/src/components/filterComponent/viewFilter.vue +1 -1
  11. package/src/components/sideMenu/index.vue +23 -27
package/dist/main.es199.js CHANGED
@@ -2,13 +2,15 @@ import "./main.es3.js";
2
2
  import { openBlock, createElementBlock, createElementVNode as createBaseVNode } from "./main.es6.js";
3
3
  const _hoisted_1 = {
4
4
  xmlns: "http://www.w3.org/2000/svg",
5
- width: "13",
6
- height: "13",
5
+ width: "10",
6
+ height: "18",
7
7
  fill: "none"
8
8
  };
9
9
  const _hoisted_2 = /* @__PURE__ */ createBaseVNode("path", {
10
- fill: "#000",
11
- d: "M8.513 1c.551 0 1 .448 1 1V4.44q.076-.012.154-.013h2.23c.552 0 1 .449 1 1V12a1 1 0 0 1-1 1h-3.23v-.014q-.075.013-.155.014h-2.23l-.103-.005-.051-.008V13h-3.23l-.103-.005A1 1 0 0 1 1.897 12v-.69a1.5 1.5 0 0 0 1-.295V12h2.23V8h-.94l.332-1h.609q.079 0 .154.012V2a1 1 0 0 1 .898-.995L6.282 1zM6.281 12h2.23V2h-2.23zm3.385 0h2.23V5.428h-2.23zM1.525.657a.5.5 0 0 1 .95.316l-1.28 3.842h2.027a.7.7 0 0 1 .665.921L2.474 9.973a.5.5 0 0 1-.949-.316l1.28-3.842H.777a.7.7 0 0 1-.664-.92z"
10
+ fill: "#263238",
11
+ "fill-rule": "evenodd",
12
+ d: "M9.367 9.334A.2.2 0 0 0 9.218 9h-3.05L8.299.785c.052-.202-.201-.339-.342-.184L.634 8.666A.2.2 0 0 0 .782 9h3.05l-2.13 8.215c-.053.202.2.34.341.184z",
13
+ "clip-rule": "evenodd"
12
14
  }, null, -1);
13
15
  const _hoisted_3 = [
14
16
  _hoisted_2
package/dist/main.es348.js CHANGED
@@ -2,13 +2,13 @@ import "./main.es3.js";
2
2
  import { openBlock, createElementBlock, createElementVNode as createBaseVNode } from "./main.es6.js";
3
3
  const _hoisted_1 = {
4
4
  xmlns: "http://www.w3.org/2000/svg",
5
- width: "14",
6
- height: "13",
5
+ width: "16",
6
+ height: "15",
7
7
  fill: "none"
8
8
  };
9
9
  const _hoisted_2 = /* @__PURE__ */ createBaseVNode("path", {
10
- fill: "#000",
11
- d: "M8 0a2 2 0 0 1 2 2v1h2.5l.153.008A1.5 1.5 0 0 1 14 4.5v7a1.5 1.5 0 0 1-1.347 1.492L12.5 13h-11a1.5 1.5 0 0 1-1.492-1.347L0 11.5v-7A1.5 1.5 0 0 1 1.5 3H4V2a2 2 0 0 1 2-2zM1.5 4a.5.5 0 0 0-.5.5v7a.5.5 0 0 0 .5.5h11a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.5-.5zM6 1a1 1 0 0 0-1 1v1h4V2a1 1 0 0 0-1-1z"
10
+ fill: "#263238",
11
+ d: "M25.6 16.15h-2.1v-1.4c0-.777-.623-1.4-1.4-1.4h-4.2c-.777 0-1.4.623-1.4 1.4v1.4h-2.1c-.777 0-1.4.623-1.4 1.4v7.7c0 .777.623 1.4 1.4 1.4h11.2c.777 0 1.4-.623 1.4-1.4v-7.7c0-.777-.623-1.4-1.4-1.4m-7.7-1.4h4.2v1.4h-4.2zm7.7 7H14.4v-4.2h11.2z"
12
12
  }, null, -1);
13
13
  const _hoisted_3 = [
14
14
  _hoisted_2
package/dist/main.es559.js CHANGED
@@ -1,4 +1,4 @@
1
- const __vite_glob_0_172 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTMiIGhlaWdodD0iMTMiIHZpZXdCb3g9IjAgMCAxMyAxMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTguNTEyNSAwLjk5OTYzNkM5LjA2NDMgMS4wMDAwNiA5LjUxMjI5IDEuNDQ3NzkgOS41MTI1IDEuOTk5NjRWNC40NDEwNEM5LjU2MjU3IDQuNDMzMzIgOS42MTQ1NyA0LjQyODM1IDkuNjY2OCA0LjQyODM1SDExLjg5NzNDMTIuNDQ5IDQuNDI4OCAxMi44OTcxIDQuODc2NTIgMTIuODk3MyA1LjQyODM1VjExLjk5OTZDMTIuODk3MSAxMi41NTE1IDEyLjQ0OTEgMTIuOTk5MiAxMS44OTczIDEyLjk5OTZIOC42NjY4VjEyLjk4NkM4LjYxNjU2IDEyLjk5MzggOC41NjQ5MiAxMi45OTk2IDguNTEyNSAxMi45OTk2SDYuMjgyMDNMNi4xNzk1IDEyLjk5NDhDNi4xNjIyOSAxMi45OTMgNi4xNDQ2OCAxMi45ODk2IDYuMTI3NzQgMTIuOTg2OVYxMi45OTk2SDIuODk3MjdMMi43OTQ3MyAxMi45OTQ4QzIuMjkwNjQgMTIuOTQzNCAxLjg5NzMzIDEyLjUxNzMgMS44OTcyNyAxMS45OTk2VjExLjMwOTJDMi4yNTk4NCAxMS4zMzQzIDIuNjEzODYgMTEuMjI2NSAyLjg5NzI3IDExLjAxNTNWMTEuOTk5Nkg1LjEyNzc0VjcuOTk5NjRINC4xODYzM0w0LjUxOTM0IDYuOTk5NjRINS4xMjc3NEM1LjE4MDExIDYuOTk5NjggNS4yMzE4NCA3LjAwNDU0IDUuMjgyMDMgNy4wMTIzM1YxLjk5OTY0QzUuMjgyMjMgMS40ODIxMyA1LjY3NTQ5IDEuMDU1ODQgNi4xNzk1IDEuMDA0NTJMNi4yODIwMyAwLjk5OTYzNkg4LjUxMjVaTTYuMjgyMDMgMTEuOTk5Nkg4LjUxMjVWMS45OTk2NEg2LjI4MjAzVjExLjk5OTZaTTkuNjY2OCAxMS45OTk2SDExLjg5NzNWNS40MjgzNUg5LjY2NjhWMTEuOTk5NlpNMS41MjUyIDAuNjU2ODYyQzEuNjEyNTIgMC4zOTQ5MDkgMS44OTYwNiAwLjI1MzE3MSAyLjE1ODAxIDAuMzQwNDU2QzIuNDE5OTggMC40Mjc3OCAyLjU2MTc0IDAuNzExMjk3IDIuNDc0NDIgMC45NzMyNjhMMS4xOTQxNCA0LjgxNTA3SDMuMjIyNDZDMy43MDAwMiA0LjgxNTE2IDQuMDM3MjMgNS4yODI4OCAzLjg4NjUzIDUuNzM1OTZMMi40NzQ0MiA5Ljk3MzI3QzIuMzg2OTUgMTAuMjM1IDIuMTAzNDYgMTAuMzc3IDEuODQxNjEgMTAuMjg5N0MxLjU3OTc5IDEwLjIwMjQgMS40MzgxMyA5LjkxODcxIDEuNTI1MiA5LjY1Njg2TDIuODA1NDcgNS44MTUwN0gwLjc3NzE1MkMwLjI5OTgxNyA1LjgxNDg2IC0wLjAzNzI5MzEgNS4zNDcwOCAwLjExMzA5IDQuODk0MTdMMS41MjUyIDAuNjU2ODYyWiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==";
1
+ const __vite_glob_0_172 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxMCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjM2NjUyIDkuMzM0NDVDOS40ODMyIDkuMjA1OTUgOS4zOTIwMyA5IDkuMjE4NDUgOUg2LjE2NzY3TDguMjk4OTYgMC43ODUyODlDOC4zNTE0MyAwLjU4MzA3MyA4LjA5Nzc1IDAuNDQ1OTUgNy45NTczMSAwLjYwMDYxTDAuNjMzNzg0IDguNjY1NTVDMC41MTcwOTYgOC43OTQwNSAwLjYwODI3MSA5IDAuNzgxODQ3IDlIMy44MzI2M0wxLjcwMTM0IDE3LjIxNDdDMS42NDg4NyAxNy40MTY5IDEuOTAyNTUgMTcuNTU0MSAyLjA0Mjk5IDE3LjM5OTRMOS4zNjY1MiA5LjMzNDQ1WiIgZmlsbD0iIzI2MzIzOCIvPgo8L3N2Zz4K";
2
2
  export {
3
3
  __vite_glob_0_172 as default
4
4
  };
package/dist/main.es708.js CHANGED
@@ -1,4 +1,4 @@
1
- const __vite_glob_0_321 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTMiIHZpZXdCb3g9IjAgMCAxNCAxMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggMEM5LjEwNDU3IDMuMjIxMzNlLTA4IDEwIDAuODk1NDMxIDEwIDJWM0gxMi41TDEyLjY1MzMgMy4wMDc4MUMxMy40MDk3IDMuMDg0NjEgMTQgMy43MjMzNCAxNCA0LjVWMTEuNUMxNCAxMi4yNzY3IDEzLjQwOTcgMTIuOTE1NCAxMi42NTMzIDEyLjk5MjJMMTIuNSAxM0gxLjVDMC43MjMzMzYgMTMgMC4wODQ2MDk3IDEyLjQwOTcgMC4wMDc4MTI1IDExLjY1MzNMMCAxMS41VjQuNUMwIDMuNjcxNTcgMC42NzE1NzMgMyAxLjUgM0g0VjJDNCAwLjg5NTQzMSA0Ljg5NTQzIDMuMjIxMjhlLTA4IDYgMEg4Wk0xLjUgNEMxLjIyMzg2IDQgMSA0LjIyMzg2IDEgNC41VjExLjVDMSAxMS43NzYxIDEuMjIzODYgMTIgMS41IDEySDEyLjVDMTIuNzc2MSAxMiAxMyAxMS43NzYxIDEzIDExLjVWNC41QzEzIDQuMjIzODYgMTIuNzc2MSA0IDEyLjUgNEgxLjVaTTYgMUM1LjQ0NzcyIDEgNSAxLjQ0NzcyIDUgMlYzSDlWMkM5IDEuNDQ3NzIgOC41NTIyOCAxIDggMUg2WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==";
1
+ const __vite_glob_0_321 = "data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjE1IiB2aWV3Ym94PSIxMiAxMiAxNiAxNSIgd2lkdGg9IjE2IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMjUuNiAxNi4xNUgyMy41VjE0Ljc1QzIzLjUgMTMuOTczIDIyLjg3NyAxMy4zNSAyMi4xIDEzLjM1SDE3LjlDMTcuMTIzIDEzLjM1IDE2LjUgMTMuOTczIDE2LjUgMTQuNzVWMTYuMTVIMTQuNEMxMy42MjMgMTYuMTUgMTMgMTYuNzczIDEzIDE3LjU1VjI1LjI1QzEzIDI2LjAyNyAxMy42MjMgMjYuNjUgMTQuNCAyNi42NUgyNS42QzI2LjM3NyAyNi42NSAyNyAyNi4wMjcgMjcgMjUuMjVWMTcuNTVDMjcgMTYuNzczIDI2LjM3NyAxNi4xNSAyNS42IDE2LjE1Wk0xNy45IDE0Ljc1SDIyLjFWMTYuMTVIMTcuOVYxNC43NVpNMjUuNiAyMS43NUgxNC40VjE3LjU1SDE2LjVIMTcuOUgyMi4xSDIzLjVIMjUuNlYyMS43NVoiIGZpbGw9IiMyNjMyMzgiPjwvcGF0aD4KPC9zdmc+Cg==";
2
2
  export {
3
3
  __vite_glob_0_321 as default
4
4
  };
package/dist/main.es8.js CHANGED
@@ -26,8 +26,6 @@ const theme = (() => {
26
26
  red2: "#de5959",
27
27
  red3: "#FFCCCC",
28
28
  red4: "#FF9A9A",
29
- red6: "#FFEBEB",
30
- red5: "#CC4545",
31
29
  pureRed: "#ff0000",
32
30
  darkRed: "#d00000",
33
31
  cornellRed: "#a52019",
@@ -69,8 +67,6 @@ const theme = (() => {
69
67
  purple4: "#D0D6F5",
70
68
  purple5: "#533181",
71
69
  purple6: "#6F20DC",
72
- purple7: "#F5EEFF",
73
- purple8: "#B17BFA",
74
70
  orange: "#ffc338",
75
71
  disabled: "#dfe1e1",
76
72
  transparentWhite2: "#ffffff32",
@@ -183,9 +179,35 @@ const theme = (() => {
183
179
  900: "#331111"
184
180
  }
185
181
  };
182
+ const chartGradients = {
183
+ simple: {
184
+ from: semanticColors.purple[500],
185
+ to: semanticColors.purple[400]
186
+ },
187
+ stacked: [{
188
+ from: "#F5EDFF",
189
+ to: "#DEC5FF"
190
+ }, {
191
+ from: "#CAA2FF",
192
+ to: "#F2E8FF"
193
+ }, {
194
+ from: "#B987FC",
195
+ to: "#904AEF"
196
+ }, {
197
+ from: "#8B40F2",
198
+ to: "#4A1394"
199
+ }, {
200
+ from: "#6A05F2",
201
+ to: "#4905A5"
202
+ }, {
203
+ from: "#5402C3",
204
+ to: "#2B0362"
205
+ }]
206
+ };
186
207
  return {
187
208
  colors,
188
209
  semanticColors,
210
+ chartGradients,
189
211
  fonts: {
190
212
  mainFont: '"Figtree", sans-serif'
191
213
  },
@@ -401,27 +423,29 @@ const theme = (() => {
401
423
  backgroundColor: semanticColors.grey[300],
402
424
  borderColor: ""
403
425
  }
404
- },
405
- tertiary: {
426
+ }
427
+ },
428
+ protag: {
429
+ main: {
406
430
  default: {
407
- backgroundColor: "transparent",
431
+ backgroundColor: semanticColors.yellow[300],
408
432
  textColor: semanticColors.teal[800],
409
- borderColor: semanticColors.teal[100]
433
+ borderColor: "transparent"
410
434
  },
411
435
  hover: {
412
- backgroundColor: semanticColors.grey[200],
436
+ backgroundColor: semanticColors.yellow[300],
413
437
  textColor: semanticColors.teal[800],
414
- borderColor: semanticColors.teal[100]
438
+ borderColor: ""
415
439
  },
416
440
  active: {
417
- backgroundColor: semanticColors.grey[400],
441
+ backgroundColor: semanticColors.yellow[300],
418
442
  textColor: semanticColors.teal[800],
419
- borderColor: semanticColors.teal[100]
443
+ borderColor: ""
420
444
  },
421
445
  disabled: {
422
- textColor: semanticColors.grey[600],
423
- backgroundColor: semanticColors.grey[500],
424
- borderColor: semanticColors.grey[800]
446
+ backgroundColor: semanticColors.yellow[300],
447
+ textColor: semanticColors.teal[400],
448
+ borderColor: ""
425
449
  }
426
450
  }
427
451
  },
@@ -448,54 +472,6 @@ const theme = (() => {
448
472
  borderColor: ""
449
473
  }
450
474
  }
451
- },
452
- protag: {
453
- main: {
454
- default: {
455
- backgroundColor: semanticColors.yellow[200],
456
- textColor: semanticColors.teal[800],
457
- borderColor: ""
458
- },
459
- hover: {
460
- backgroundColor: semanticColors.yellow[200],
461
- textColor: semanticColors.teal[800],
462
- borderColor: ""
463
- },
464
- active: {
465
- backgroundColor: semanticColors.yellow[200],
466
- textColor: semanticColors.teal[800],
467
- borderColor: ""
468
- },
469
- disabled: {
470
- backgroundColor: semanticColors.yellow[200],
471
- textColor: semanticColors.teal[400],
472
- borderColor: ""
473
- }
474
- }
475
- },
476
- freeTrialTag: {
477
- main: {
478
- default: {
479
- backgroundColor: semanticColors.blue[200],
480
- textColor: semanticColors.teal[800],
481
- borderColor: ""
482
- },
483
- hover: {
484
- backgroundColor: semanticColors.blue[200],
485
- textColor: semanticColors.teal[800],
486
- borderColor: ""
487
- },
488
- active: {
489
- backgroundColor: semanticColors.blue[200],
490
- textColor: semanticColors.teal[800],
491
- borderColor: ""
492
- },
493
- disabled: {
494
- backgroundColor: semanticColors.blue[200],
495
- textColor: semanticColors.teal[400],
496
- borderColor: ""
497
- }
498
- }
499
475
  }
500
476
  },
501
477
  dark: {
@@ -647,6 +623,55 @@ const theme = (() => {
647
623
  }
648
624
  }
649
625
  },
626
+ tertiary: {
627
+ // type
628
+ main: {
629
+ // variant: this is the default variant
630
+ default: {
631
+ backgroundColor: "transparent",
632
+ textColor: semanticColors.purple[50],
633
+ borderColor: semanticColors.teal[500]
634
+ },
635
+ hover: {
636
+ backgroundColor: semanticColors.teal[600],
637
+ textColor: semanticColors.purple[50],
638
+ borderColor: semanticColors.teal[400]
639
+ },
640
+ active: {
641
+ backgroundColor: semanticColors.teal[700],
642
+ textColor: semanticColors.purple[50],
643
+ borderColor: semanticColors.teal[300]
644
+ },
645
+ disabled: {
646
+ textColor: semanticColors.grey[600],
647
+ backgroundColor: semanticColors.grey[500],
648
+ borderColor: semanticColors.grey[800]
649
+ }
650
+ },
651
+ cancel: {
652
+ // variant
653
+ default: {
654
+ backgroundColor: semanticColors.teal[200],
655
+ textColor: semanticColors.red[400],
656
+ borderColor: semanticColors.teal[500]
657
+ },
658
+ hover: {
659
+ backgroundColor: semanticColors.red[700],
660
+ textColor: semanticColors.red[700],
661
+ borderColor: semanticColors.teal[400]
662
+ },
663
+ active: {
664
+ backgroundColor: semanticColors.red[600],
665
+ textColor: semanticColors.red[200],
666
+ borderColor: semanticColors.teal[300]
667
+ },
668
+ disabled: {
669
+ textColor: semanticColors.grey[600],
670
+ backgroundColor: semanticColors.grey[500],
671
+ borderColor: semanticColors.grey[800]
672
+ }
673
+ }
674
+ },
650
675
  ghost: {
651
676
  // type
652
677
  main: {
@@ -738,9 +763,9 @@ const theme = (() => {
738
763
  iconWidth: "26px"
739
764
  },
740
765
  tiny: {
741
- padding: "3px 5px",
742
- fontSize: "11px",
743
- iconWidth: "14px"
766
+ padding: "2px 5px",
767
+ fontSize: "10px",
768
+ iconWidth: "18px"
744
769
  }
745
770
  }
746
771
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eturnity/eturnity_reusable_components",
3
- "version": "8.34.0-EPDM-16204.1",
3
+ "version": "8.37.0-EPDM-16798.0",
4
4
  "files": [
5
5
  "dist",
6
6
  "src"
package/src/assets/svgIcons/electricity_tariff.svg CHANGED
@@ -1,3 +1,3 @@
1
- <svg width="13" height="13" viewBox="0 0 13 13" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M8.5125 0.999636C9.0643 1.00006 9.51229 1.44779 9.5125 1.99964V4.44104C9.56257 4.43332 9.61457 4.42835 9.6668 4.42835H11.8973C12.449 4.4288 12.8971 4.87652 12.8973 5.42835V11.9996C12.8971 12.5515 12.4491 12.9992 11.8973 12.9996H8.6668V12.986C8.61656 12.9938 8.56492 12.9996 8.5125 12.9996H6.28203L6.1795 12.9948C6.16229 12.993 6.14468 12.9896 6.12774 12.9869V12.9996H2.89727L2.79473 12.9948C2.29064 12.9434 1.89733 12.5173 1.89727 11.9996V11.3092C2.25984 11.3343 2.61386 11.2265 2.89727 11.0153V11.9996H5.12774V7.99964H4.18633L4.51934 6.99964H5.12774C5.18011 6.99968 5.23184 7.00454 5.28203 7.01233V1.99964C5.28223 1.48213 5.67549 1.05584 6.1795 1.00452L6.28203 0.999636H8.5125ZM6.28203 11.9996H8.5125V1.99964H6.28203V11.9996ZM9.6668 11.9996H11.8973V5.42835H9.6668V11.9996ZM1.5252 0.656862C1.61252 0.394909 1.89606 0.253171 2.15801 0.340456C2.41998 0.42778 2.56174 0.711297 2.47442 0.973268L1.19414 4.81507H3.22246C3.70002 4.81516 4.03723 5.28288 3.88653 5.73596L2.47442 9.97327C2.38695 10.235 2.10346 10.377 1.84161 10.2897C1.57979 10.2024 1.43813 9.91871 1.5252 9.65686L2.80547 5.81507H0.777152C0.299817 5.81486 -0.0372931 5.34708 0.11309 4.89417L1.5252 0.656862Z" fill="black"/>
1
+ <svg width="10" height="18" viewBox="0 0 10 18" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M9.36652 9.33445C9.4832 9.20595 9.39203 9 9.21845 9H6.16767L8.29896 0.785289C8.35143 0.583073 8.09775 0.44595 7.95731 0.60061L0.633784 8.66555C0.517096 8.79405 0.608271 9 0.781847 9H3.83263L1.70134 17.2147C1.64887 17.4169 1.90255 17.5541 2.04299 17.3994L9.36652 9.33445Z" fill="#263238"/>
3
3
  </svg>
package/src/assets/svgIcons/suitcase.svg CHANGED
@@ -1,3 +1,3 @@
1
- <svg width="14" height="13" viewBox="0 0 14 13" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M8 0C9.10457 3.22133e-08 10 0.895431 10 2V3H12.5L12.6533 3.00781C13.4097 3.08461 14 3.72334 14 4.5V11.5C14 12.2767 13.4097 12.9154 12.6533 12.9922L12.5 13H1.5C0.723336 13 0.0846097 12.4097 0.0078125 11.6533L0 11.5V4.5C0 3.67157 0.671573 3 1.5 3H4V2C4 0.895431 4.89543 3.22128e-08 6 0H8ZM1.5 4C1.22386 4 1 4.22386 1 4.5V11.5C1 11.7761 1.22386 12 1.5 12H12.5C12.7761 12 13 11.7761 13 11.5V4.5C13 4.22386 12.7761 4 12.5 4H1.5ZM6 1C5.44772 1 5 1.44772 5 2V3H9V2C9 1.44772 8.55228 1 8 1H6Z" fill="black"/>
1
+ <svg fill="none" height="15" viewbox="12 12 16 15" width="16" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M25.6 16.15H23.5V14.75C23.5 13.973 22.877 13.35 22.1 13.35H17.9C17.123 13.35 16.5 13.973 16.5 14.75V16.15H14.4C13.623 16.15 13 16.773 13 17.55V25.25C13 26.027 13.623 26.65 14.4 26.65H25.6C26.377 26.65 27 26.027 27 25.25V17.55C27 16.773 26.377 16.15 25.6 16.15ZM17.9 14.75H22.1V16.15H17.9V14.75ZM25.6 21.75H14.4V17.55H16.5H17.9H22.1H23.5H25.6V21.75Z" fill="#263238"></path>
3
3
  </svg>
package/src/assets/theme.js CHANGED
@@ -26,8 +26,6 @@ const theme = (() => {
26
26
  red2: '#de5959',
27
27
  red3: '#FFCCCC',
28
28
  red4: '#FF9A9A',
29
- red6: '#FFEBEB',
30
- red5: '#CC4545',
31
29
  pureRed: '#ff0000',
32
30
  darkRed: '#d00000',
33
31
  cornellRed: '#a52019',
@@ -68,8 +66,6 @@ const theme = (() => {
68
66
  purple4: '#D0D6F5',
69
67
  purple5: '#533181',
70
68
  purple6: '#6F20DC',
71
- purple7: '#F5EEFF',
72
- purple8: '#B17BFA',
73
69
  orange: '#ffc338',
74
70
  disabled: '#dfe1e1',
75
71
  transparentWhite2: '#ffffff32',
@@ -184,9 +180,25 @@ const theme = (() => {
184
180
  },
185
181
  }
186
182
 
183
+ const chartGradients = {
184
+ simple: {
185
+ from: semanticColors.purple[500],
186
+ to: semanticColors.purple[400],
187
+ },
188
+ stacked: [
189
+ { from: '#F5EDFF', to: '#DEC5FF' },
190
+ { from: '#CAA2FF', to: '#F2E8FF' },
191
+ { from: '#B987FC', to: '#904AEF' },
192
+ { from: '#8B40F2', to: '#4A1394' },
193
+ { from: '#6A05F2', to: '#4905A5' },
194
+ { from: '#5402C3', to: '#2B0362' },
195
+ ],
196
+ }
197
+
187
198
  return {
188
199
  colors,
189
200
  semanticColors,
201
+ chartGradients,
190
202
  fonts: {
191
203
  mainFont: '"Figtree", sans-serif',
192
204
  },
@@ -403,26 +415,28 @@ const theme = (() => {
403
415
  borderColor: '',
404
416
  },
405
417
  },
406
- tertiary: {
418
+ },
419
+ protag: {
420
+ main: {
407
421
  default: {
408
- backgroundColor: 'transparent',
422
+ backgroundColor: semanticColors.yellow[300],
409
423
  textColor: semanticColors.teal[800],
410
- borderColor: semanticColors.teal[100],
424
+ borderColor: 'transparent',
411
425
  },
412
426
  hover: {
413
- backgroundColor: semanticColors.grey[200],
427
+ backgroundColor: semanticColors.yellow[300],
414
428
  textColor: semanticColors.teal[800],
415
- borderColor: semanticColors.teal[100],
429
+ borderColor: '',
416
430
  },
417
431
  active: {
418
- backgroundColor: semanticColors.grey[400],
432
+ backgroundColor: semanticColors.yellow[300],
419
433
  textColor: semanticColors.teal[800],
420
- borderColor: semanticColors.teal[100],
434
+ borderColor: '',
421
435
  },
422
436
  disabled: {
423
- textColor: semanticColors.grey[600],
424
- backgroundColor: semanticColors.grey[500],
425
- borderColor: semanticColors.grey[800],
437
+ backgroundColor: semanticColors.yellow[300],
438
+ textColor: semanticColors.teal[400],
439
+ borderColor: '',
426
440
  },
427
441
  },
428
442
  },
@@ -450,152 +464,153 @@ const theme = (() => {
450
464
  },
451
465
  },
452
466
  },
453
- protag: {
467
+ },
468
+ dark: {
469
+ // theme
470
+ primary: {
471
+ // type
454
472
  main: {
473
+ // variant: this is the default variant
455
474
  default: {
456
- backgroundColor: semanticColors.yellow[200],
475
+ backgroundColor: colors.white,
457
476
  textColor: semanticColors.teal[800],
458
477
  borderColor: '',
459
478
  },
460
479
  hover: {
461
- backgroundColor: semanticColors.yellow[200],
480
+ backgroundColor: semanticColors.purple[100],
462
481
  textColor: semanticColors.teal[800],
463
482
  borderColor: '',
464
483
  },
465
484
  active: {
466
- backgroundColor: semanticColors.yellow[200],
485
+ backgroundColor: semanticColors.purple[100],
467
486
  textColor: semanticColors.teal[800],
468
487
  borderColor: '',
469
488
  },
470
489
  disabled: {
471
- backgroundColor: semanticColors.yellow[200],
472
- textColor: semanticColors.teal[400],
490
+ textColor: semanticColors.grey[800],
491
+ backgroundColor: semanticColors.grey[400],
473
492
  borderColor: '',
474
493
  },
475
494
  },
476
- },
477
- freeTrialTag: {
478
- main: {
495
+ cancel: {
496
+ // variant
479
497
  default: {
480
- backgroundColor: semanticColors.blue[200],
498
+ backgroundColor: semanticColors.red[400],
481
499
  textColor: semanticColors.teal[800],
482
500
  borderColor: '',
483
501
  },
484
502
  hover: {
485
- backgroundColor: semanticColors.blue[200],
503
+ backgroundColor: semanticColors.red[100],
486
504
  textColor: semanticColors.teal[800],
487
505
  borderColor: '',
488
506
  },
489
507
  active: {
490
- backgroundColor: semanticColors.blue[200],
508
+ backgroundColor: semanticColors.red[200],
491
509
  textColor: semanticColors.teal[800],
492
510
  borderColor: '',
493
511
  },
494
512
  disabled: {
495
- backgroundColor: semanticColors.blue[200],
496
- textColor: semanticColors.teal[400],
513
+ backgroundColor: semanticColors.grey[300],
514
+ textColor: semanticColors.grey[800],
497
515
  borderColor: '',
498
516
  },
499
517
  },
500
518
  },
501
- },
502
- dark: {
503
- // theme
504
- primary: {
519
+ secondary: {
505
520
  // type
506
521
  main: {
507
522
  // variant: this is the default variant
508
523
  default: {
509
- backgroundColor: colors.white,
510
- textColor: semanticColors.teal[800],
524
+ backgroundColor: semanticColors.teal[800],
525
+ textColor: semanticColors.purple[50],
511
526
  borderColor: '',
512
527
  },
513
528
  hover: {
514
- backgroundColor: semanticColors.purple[100],
515
- textColor: semanticColors.teal[800],
529
+ backgroundColor: semanticColors.teal[600],
530
+ textColor: semanticColors.purple[50],
516
531
  borderColor: '',
517
532
  },
518
533
  active: {
519
- backgroundColor: semanticColors.purple[100],
520
- textColor: semanticColors.teal[800],
534
+ backgroundColor: semanticColors.teal[700],
535
+ textColor: semanticColors.purple[50],
521
536
  borderColor: '',
522
537
  },
523
538
  disabled: {
524
- textColor: semanticColors.grey[800],
525
- backgroundColor: semanticColors.grey[400],
539
+ textColor: semanticColors.grey[600],
540
+ backgroundColor: semanticColors.grey[500],
526
541
  borderColor: '',
527
542
  },
528
543
  },
529
544
  cancel: {
530
545
  // variant
531
546
  default: {
532
- backgroundColor: semanticColors.red[400],
533
- textColor: semanticColors.teal[800],
547
+ backgroundColor: semanticColors.red[800],
548
+ textColor: semanticColors.red[400],
534
549
  borderColor: '',
535
550
  },
536
551
  hover: {
537
- backgroundColor: semanticColors.red[100],
538
- textColor: semanticColors.teal[800],
552
+ backgroundColor: semanticColors.red[700],
553
+ textColor: semanticColors.red[300],
539
554
  borderColor: '',
540
555
  },
541
556
  active: {
542
- backgroundColor: semanticColors.red[200],
543
- textColor: semanticColors.teal[800],
557
+ backgroundColor: semanticColors.red[600],
558
+ textColor: semanticColors.red[200],
544
559
  borderColor: '',
545
560
  },
546
561
  disabled: {
547
- backgroundColor: semanticColors.grey[300],
548
- textColor: semanticColors.grey[800],
562
+ textColor: semanticColors.grey[600],
563
+ backgroundColor: semanticColors.grey[500],
549
564
  borderColor: '',
550
565
  },
551
566
  },
552
567
  },
553
- secondary: {
568
+ tertiary: {
554
569
  // type
555
570
  main: {
556
571
  // variant: this is the default variant
557
572
  default: {
558
- backgroundColor: semanticColors.teal[800],
573
+ backgroundColor: 'transparent',
559
574
  textColor: semanticColors.purple[50],
560
- borderColor: '',
575
+ borderColor: semanticColors.teal[500],
561
576
  },
562
577
  hover: {
563
578
  backgroundColor: semanticColors.teal[600],
564
579
  textColor: semanticColors.purple[50],
565
- borderColor: '',
580
+ borderColor: semanticColors.teal[400],
566
581
  },
567
582
  active: {
568
583
  backgroundColor: semanticColors.teal[700],
569
584
  textColor: semanticColors.purple[50],
570
- borderColor: '',
585
+ borderColor: semanticColors.teal[300],
571
586
  },
572
587
  disabled: {
573
588
  textColor: semanticColors.grey[600],
574
589
  backgroundColor: semanticColors.grey[500],
575
- borderColor: '',
590
+ borderColor: semanticColors.grey[800],
576
591
  },
577
592
  },
578
593
  cancel: {
579
594
  // variant
580
595
  default: {
581
- backgroundColor: semanticColors.red[800],
596
+ backgroundColor: semanticColors.teal[200],
582
597
  textColor: semanticColors.red[400],
583
- borderColor: '',
598
+ borderColor: semanticColors.teal[500],
584
599
  },
585
600
  hover: {
586
601
  backgroundColor: semanticColors.red[700],
587
- textColor: semanticColors.red[300],
588
- borderColor: '',
602
+ textColor: semanticColors.red[700],
603
+ borderColor: semanticColors.teal[400],
589
604
  },
590
605
  active: {
591
606
  backgroundColor: semanticColors.red[600],
592
607
  textColor: semanticColors.red[200],
593
- borderColor: '',
608
+ borderColor: semanticColors.teal[300],
594
609
  },
595
610
  disabled: {
596
611
  textColor: semanticColors.grey[600],
597
612
  backgroundColor: semanticColors.grey[500],
598
- borderColor: '',
613
+ borderColor: semanticColors.grey[800],
599
614
  },
600
615
  },
601
616
  },
@@ -739,9 +754,9 @@ const theme = (() => {
739
754
  iconWidth: '26px',
740
755
  },
741
756
  tiny: {
742
- padding: '3px 5px',
743
- fontSize: '11px',
744
- iconWidth: '14px',
757
+ padding: '2px 5px',
758
+ fontSize: '10px',
759
+ iconWidth: '18px',
745
760
  },
746
761
  },
747
762
  },
package/src/components/filterComponent/viewFilter.vue CHANGED
@@ -115,7 +115,7 @@
115
115
  .replace('${index}', index)
116
116
  "
117
117
  :data-qa-id="
118
- rowDataId.dataQaId
118
+ rowDataId.dataId
119
119
  .replace('${type}', 'selectedDate')
120
120
  .replace('${index}', index)
121
121
  "
package/src/components/sideMenu/index.vue CHANGED
@@ -8,9 +8,6 @@
8
8
  <ListItem
9
9
  v-if="!item.children"
10
10
  :key="idx"
11
- :data-active="
12
- (activeTab === item.key || activeParentTab === item.key).toString()
13
- "
14
11
  :data-id="`sub_menu_settings_${item.key}`"
15
12
  :fill-type="item.icon === 'free_technology' ? 'stroke' : 'fill'"
16
13
  :is-active="activeTab === item.key || activeParentTab === item.key"
@@ -33,7 +30,6 @@
33
30
  </ListItem>
34
31
  <CollapseWrapper v-else :key="idx + item.key">
35
32
  <CollapseContainer
36
- :data-active="activeParentTab === item.key"
37
33
  :data-id="`sub_menu_settings_${item.key}`"
38
34
  :is-active="activeParentTab === item.key"
39
35
  @click="toggleActiveDropdown(item.key)"
@@ -55,11 +51,7 @@
55
51
  }}</ListText>
56
52
  <ArrowContainer>
57
53
  <Icon
58
- :color="
59
- activeParentTab === item.key
60
- ? theme.semanticColors.purple[500]
61
- : theme.semanticColors.teal[800]
62
- "
54
+ :color="theme.semanticColors.grey[800]"
63
55
  :name="
64
56
  activeDropdown === item.key
65
57
  ? 'arrow_up_unfilled'
@@ -73,7 +65,6 @@
73
65
  <SubRouter
74
66
  v-for="subItem in item.children"
75
67
  :key="subItem.key"
76
- :data-active="activeTab === subItem.key"
77
68
  :data-id="`sub_menu_settings_${subItem.key}`"
78
69
  :is-active="activeTab === subItem.key"
79
70
  @click="
@@ -90,14 +81,19 @@
90
81
  </template>
91
82
  </ListContainer>
92
83
  <BottomSection v-if="hasLogout">
93
- <ButtonIcon
84
+ <IconContainer
94
85
  data-id="button_settings_logout"
95
- icon-name="logout"
96
- text="Logout"
97
- type="ghost"
98
- variant="tertiary"
86
+ :is-active="false"
87
+ :is-button="true"
99
88
  @click="$emit('on-logout')"
100
- />
89
+ >
90
+ <RotateIcon
91
+ :color="theme.semanticColors.teal[800]"
92
+ cursor="pointer"
93
+ name="initial_situation"
94
+ size="18px"
95
+ />
96
+ </IconContainer>
101
97
  <AppVersion>{{ appVersion }}</AppVersion>
102
98
  </BottomSection>
103
99
  </PageContainer>
@@ -108,7 +104,6 @@
108
104
  import Icon from '../icon'
109
105
  import Spinner from '../spinner'
110
106
  import theme from '@/assets/theme.js'
111
- import ButtonIcon from '../buttons/buttonIcon'
112
107
 
113
108
  const PageAttrs = { isLoading: Boolean }
114
109
  const PageContainer = styled('div', PageAttrs)`
@@ -136,13 +131,13 @@
136
131
  padding: 4px;
137
132
  border-radius: 4px;
138
133
  background-color: ${(props) =>
139
- props.isActive ? props.theme.semanticColors.purple[100] : ''};
134
+ props.isActive ? props.theme.semanticColors.purple[50] : ''};
140
135
  color: ${(props) =>
141
136
  props.isActive
142
137
  ? props.theme.semanticColors.purple[500]
143
138
  : props.theme.semanticColors.teal[800]};
144
139
 
145
- &:hover:not([data-active='true']) {
140
+ :hover {
146
141
  background-color: ${(props) => props.theme.semanticColors.purple[100]};
147
142
  color: ${(props) => props.theme.semanticColors.purple[500]};
148
143
  svg path:not(.fix) {
@@ -171,7 +166,8 @@
171
166
  `
172
167
  cursor: pointer;
173
168
  &:hover {
174
- background-color: ${(props) => props.theme.semanticColors.purple[50]};
169
+ background-color: ${(props) =>
170
+ props.theme.semanticColors.purple[100]};
175
171
  `}
176
172
  `
177
173
 
@@ -213,10 +209,10 @@
213
209
  font-weight: 400;
214
210
  font-size: 14px;
215
211
  background: ${(props) =>
216
- props.isActive ? props.theme.semanticColors.purple[100] : ''};
212
+ props.isActive ? props.theme.semanticColors.purple[50] : ''};
217
213
 
218
- &:hover:not([data-active='true']) {
219
- background: ${(props) => props.theme.semanticColors.purple[50]};
214
+ &:hover {
215
+ background: ${(props) => props.theme.semanticColors.purple[100]};
220
216
  color: ${(props) => props.theme.semanticColors.purple[500]} !important;
221
217
  }
222
218
  `
@@ -232,15 +228,15 @@
232
228
  align-items: center;
233
229
  cursor: pointer;
234
230
  background: ${(props) =>
235
- props.isActive ? props.theme.semanticColors.purple[100] : ''};
231
+ props.isActive ? props.theme.semanticColors.purple[50] : ''};
236
232
 
237
233
  div {
238
234
  color: ${(props) =>
239
235
  props.isActive ? props.theme.semanticColors.purple[500] : ''};
240
236
  }
241
237
 
242
- &:hover:not([data-active='true']) {
243
- background: ${(props) => props.theme.semanticColors.purple[50]};
238
+ &:hover {
239
+ background: ${(props) => props.theme.semanticColors.purple[100]};
244
240
  color: ${(props) => props.theme.semanticColors.purple[500]};
245
241
  svg path:not(.fix) {
246
242
  fill: ${(props) => props.theme.semanticColors.purple[500]};
@@ -272,12 +268,12 @@
272
268
  Spinner,
273
269
  SpinnerContainer,
274
270
  BottomSection,
271
+ RotateIcon,
275
272
  AppVersion,
276
273
  CollapseWrapper,
277
274
  CollapseContainer,
278
275
  SubRouter,
279
276
  ArrowContainer,
280
- ButtonIcon,
281
277
  },
282
278
  props: {
283
279
  tabsData: {