@mtvh/mtvh-design-system 0.0.2 → 0.0.4

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 (33) hide show
  1. package/README.md +15 -2
  2. package/assets/scss/app.scss +38 -0
  3. package/assets/scss/base/_all.scss +4 -0
  4. package/assets/scss/base/_functions.scss +38 -0
  5. package/assets/scss/base/_global.scss +25 -0
  6. package/assets/scss/base/_mixins.scss +171 -0
  7. package/assets/scss/base/_print.scss +55 -0
  8. package/assets/scss/common/_custom.scss +63 -0
  9. package/assets/scss/common/_variables-custom.scss +0 -0
  10. package/assets/scss/common/_variables-overrides.scss +0 -0
  11. package/assets/scss/components/_all.scss +4 -0
  12. package/assets/scss/components/_button.scss +209 -0
  13. package/assets/scss/components/_content-block.scss +231 -0
  14. package/assets/scss/components/_form.scss +92 -0
  15. package/assets/scss/components/_link.scss +92 -0
  16. package/assets/scss/config/_font.scss +8 -0
  17. package/assets/scss/config/_map-amends.scss +15 -0
  18. package/assets/scss/config/_map-list.scss +114 -0
  19. package/assets/scss/config/_palette.scss +51 -0
  20. package/assets/scss/config/_theme.scss +23 -0
  21. package/assets/scss/config/_variables.scss +123 -0
  22. package/assets/scss/core/_all.scss +2 -0
  23. package/assets/scss/core/iconography/_icon.scss +32 -0
  24. package/assets/scss/core/typography/_typography.scss +93 -0
  25. package/assets/scss/mtvh.scss +68 -0
  26. package/dist/images/icons/inspection.svg +1 -0
  27. package/dist/images/icons/parking.svg +1 -0
  28. package/dist/images/icons/pet.svg +1 -0
  29. package/dist/images/icons/speech-dark.svg +1 -0
  30. package/dist/js/app.min.js +9 -0
  31. package/dist/mtvh.min.css +1 -1
  32. package/package.json +12 -12
  33. package/public/js/app.js +5194 -0
@@ -0,0 +1,231 @@
1
+ $mtvh-content-block: (
2
+
3
+ grey-01: (
4
+ background-color: var(--mtvh-grey-01)
5
+ ),
6
+ grey-02: (
7
+ background-color: var(--mtvh-grey-02)
8
+ ),
9
+ yellow-01: (
10
+ background-color: var(--mtvh-yellow-01)
11
+ ),
12
+ green-01: (
13
+ background-color: var(--mtvh-green-01)
14
+ ),
15
+ purple-01: (
16
+ background-color: var(--mtvh-purple-01)
17
+ ),
18
+ red-01: (
19
+ background-color: var(--mtvh-red-01)
20
+ ),
21
+ stone-02: (
22
+ background-color: var(--mtvh-stone-02)
23
+ ),
24
+ );
25
+
26
+ $mtvh-content-block-border: (
27
+ grey-03: (
28
+ border-color: var(--mtvh-grey-03)
29
+ ),
30
+ red-04: (
31
+ border-color: var(--mtvh-red-04)
32
+ ),
33
+ green-04: (
34
+ border-color: var(--mtvh-green-04)
35
+ ),
36
+ purple-04: (
37
+ border-color: var(--mtvh-purple-04)
38
+ ),
39
+ yellow-03: (
40
+ border-color: var(--mtvh-yellow-03)
41
+ ),
42
+ );
43
+
44
+ .mtvh-content-block {
45
+
46
+ padding: $mtvh-spacing-spacing-6 $mtvh-spacing-spacing-5;
47
+ @include media-breakpoint-up(md) {
48
+ padding: $mtvh-spacing-spacing-6;
49
+ }
50
+ &__date {
51
+ margin-bottom: .5rem;
52
+ }
53
+ &--text-only {
54
+ padding: $mtvh-spacing-spacing-5 $mtvh-spacing-spacing-5;
55
+ font-size: 1rem;
56
+ @include media-breakpoint-up(md) {
57
+ font-size: 1.125rem;
58
+ }
59
+ }
60
+ &--stretch {
61
+ height: 100%;
62
+ }
63
+
64
+ border-radius: .5rem;
65
+ position: relative;
66
+
67
+ &-link-card {
68
+ text-decoration: none;
69
+ box-shadow: var(--mtvh-box-shadow);
70
+ padding: $mtvh-spacing-spacing-5;
71
+ &:hover {
72
+ background-color: var(--mtvh-grey-02);
73
+ }
74
+
75
+ @include media-breakpoint-up(md) {
76
+ padding: $mtvh-spacing-spacing-6;
77
+ }
78
+ @include media-breakpoint-up(lg) {
79
+ min-height: 17rem;
80
+ }
81
+
82
+ &:focus-within {
83
+ outline: solid var(--mtvh-btn-outline-border) var(--mtvh-btn-outline-color);
84
+ outline-offset: $mtvh-spacing-spacing-3;
85
+ background-color: var(--mtvh-grey-04);
86
+ }
87
+
88
+ &:active, &:focus {
89
+ background-color: var(--mtvh-grey-04);
90
+ outline: unset;
91
+ }
92
+
93
+ a {
94
+ @extend %h3;
95
+ color: var(--mtvh-black);
96
+ text-decoration: none;
97
+ &:after {
98
+ bottom: 0;
99
+ content: "";
100
+ left: 0;
101
+ position: absolute;
102
+ right: 0;
103
+ top: 0;
104
+ z-index: 100;
105
+ }
106
+ &:active, &:focus {
107
+ background-color: var(--mtvh-grey-04);
108
+ outline: unset;
109
+ }
110
+
111
+ }
112
+ }
113
+ .mtvh-btn, p {
114
+ &:last-child {
115
+ margin-bottom: 0px;
116
+ }
117
+ }
118
+
119
+ h2 {
120
+ + .mtvh-btn, + .mtvh-link {
121
+
122
+ }
123
+ }
124
+
125
+ h3 {
126
+ + .mtvh-btn, + .mtvh-link {
127
+ margin-top: 0.625rem;
128
+ }
129
+ }
130
+ h4 {
131
+ + .mtvh-btn, + .mtvh-link {
132
+ margin-top: 0.625rem;
133
+ }
134
+ }
135
+ &-no-padding {
136
+ padding: 0;
137
+ }
138
+
139
+ &-border {
140
+
141
+ border: $border-width-sm solid;
142
+ @each $color, $property-map in $mtvh-content-block-border {
143
+ &--#{"" + $color} {
144
+ border-color: map-get($property-map, border-color);
145
+ }
146
+ }
147
+ }
148
+
149
+ &-bg {
150
+ background-color: var(--mtvh-white);
151
+ @each $color, $property-map in $mtvh-content-block {
152
+ &--#{"" + $color} {
153
+ background-color: map-get($property-map, background-color);
154
+ }
155
+ }
156
+ }
157
+
158
+ &-icon {
159
+ .mtvh-icon {
160
+ margin-bottom: $mtvh-spacing-spacing-3;
161
+ }
162
+
163
+ }
164
+
165
+ &-container {
166
+ font-size: $font-size-sm;
167
+ }
168
+ &-body {
169
+
170
+ @include media-breakpoint-up(md) {
171
+ max-width: 380px;
172
+ }
173
+ @include media-breakpoint-up(lg) {
174
+ max-width: 360px;
175
+ }
176
+ @include media-breakpoint-up(xl) {
177
+ max-width: 430px;
178
+ }
179
+
180
+ }
181
+ &-header {
182
+ padding-bottom: $mtvh-spacing-spacing-5;
183
+
184
+ h2 {
185
+ margin-bottom: $mtvh-spacing-spacing-3;
186
+ }
187
+ }
188
+ &-payment {
189
+
190
+ padding-top: $mtvh-spacing-spacing-5;
191
+ padding-bottom: $mtvh-spacing-spacing-5;
192
+ border-top: 1px solid var(--mtvh-grey-02);
193
+ border-bottom: 1px solid var(--mtvh-grey-02);
194
+
195
+ @include media-breakpoint-up(md) {
196
+ padding: 0;
197
+ text-align: right;
198
+ }
199
+
200
+ &-status {
201
+ font-size: $font-size-lg;
202
+ font-weight: $mtvh-font-weight-bold;
203
+ margin-bottom: $mtvh-spacing-spacing-3;
204
+ line-height: $line-height-md;//33.8px;
205
+ }
206
+ &-date {
207
+ font-weight: $mtvh-font-weight-bold;
208
+ font-size: $font-size-sm;
209
+ margin-bottom: 8px;
210
+ }
211
+
212
+
213
+ @include media-breakpoint-up(md) {
214
+ border: 0;
215
+ position: absolute;
216
+ top: 1.8rem;
217
+ right: $mtvh-spacing-spacing-6;;
218
+ width: 216px;
219
+ }
220
+ }
221
+ &-footer {
222
+
223
+ padding-top: $mtvh-spacing-spacing-5;
224
+
225
+ @include media-breakpoint-up(md) {
226
+ padding: 0;
227
+ }
228
+ max-width: 400px;
229
+ }
230
+
231
+ }
@@ -0,0 +1,92 @@
1
+ .form-control, .form-select, .form-check-input {
2
+ &:focus {
3
+ box-shadow: none;
4
+ outline: solid var(--mtvh-btn-outline-border) var(--mtvh-btn-outline-color);
5
+ outline-offset: 0;
6
+ outline-offset: var(--mtvh-btn-outline-border);
7
+ color: $input-color;
8
+ }
9
+ &.is-invalid {
10
+ &:focus {
11
+ border-color: $input-border-color;
12
+ box-shadow: none;
13
+ }
14
+ background-color: var(--mtvh-red-01);
15
+ }
16
+ }
17
+
18
+ .form-label, .col-form-label, form label {
19
+ font-size: $font-size-md;
20
+ font-weight: 700;
21
+ line-height: 1.4;
22
+ padding-top: 0;
23
+ padding-bottom: $mtvh-spacing-spacing-3;
24
+ margin-bottom: 0;
25
+ }
26
+
27
+ .form-control {
28
+ font-size: $input-font-size;
29
+ height: auto;
30
+ }
31
+ .invalid-feedback {
32
+ font-weight: $mtvh-font-weight-bold;
33
+ }
34
+
35
+ .form-text {
36
+ font-size: $font-size-sm;
37
+ margin-bottom: $mtvh-spacing-spacing-4;
38
+ &.error {
39
+ @include form-invalid-text();
40
+ }
41
+ }
42
+
43
+ .mtvh-formio{
44
+
45
+ div.formio-component {
46
+
47
+ margin-bottom: 5.5rem;
48
+
49
+ &.formio-hidden{
50
+ margin-bottom:0;
51
+ }
52
+
53
+ &.formio-component-button:has(> button[type="submit"]),&.formio-component-form,&.formio-component-fieldset,&.formio-component-columns,&.formio-component-mtvhLogicSet{
54
+ margin-bottom:0;
55
+ }
56
+
57
+ //Remove padding from last child
58
+ div.formio-component-form{
59
+ & .formio-component:last-child {
60
+ margin-bottom:0!important;
61
+ }
62
+ }
63
+
64
+
65
+ &.has-message.has-error {
66
+ .invalid-feedback {
67
+ display: block;
68
+ margin-top: $mtvh-spacing-spacing-4;
69
+
70
+ .form-text {
71
+ margin-bottom: 0;
72
+ margin-top:0;
73
+ }
74
+ }
75
+
76
+ .text-danger {
77
+ color: $danger !important;
78
+ }
79
+ }
80
+
81
+ textarea {
82
+ max-height: 496px;
83
+ @include media-breakpoint-up(md) {
84
+ max-height: 608px;
85
+ }
86
+ }
87
+
88
+ span[ref|="charcount"], .text-muted {
89
+ color : var(--mtvh-grey-06) !important;
90
+ }
91
+ }
92
+ }
@@ -0,0 +1,92 @@
1
+ $mtvh-links: (
2
+ primary: (
3
+ text-color: var(--mtvh-blue-04),
4
+ text-color-hover: var(--mtvh-blue-05),
5
+ text-color-active: var(--mtvh-blue-06),
6
+ text-color-focus: var(--mtvh-blue-05),
7
+ text-disabled-color: var(--mtvh-grey-06)
8
+ ),
9
+ light: (
10
+ text-color: var(--mtvh-white),
11
+ text-color-hover: var(--mtvh-grey-04),
12
+ text-color-active: var(--mtvh-grey-05),
13
+ text-color-focus: var(--mtvh-grey-04),
14
+ text-disabled-color: var(--mtvh-grey-06)
15
+ ),
16
+ );
17
+
18
+ .mtvh-link {
19
+
20
+ line-height: 1.2;
21
+ text-decoration: underline;
22
+ font-weight: bold;
23
+ cursor: pointer;
24
+ display: inline-block;
25
+ &:hover {
26
+ color: var(--mtvh-blue-05);
27
+ text-decoration: none;
28
+ }
29
+
30
+ &:focus:not(:focus-visible) {
31
+ outline: 0;
32
+ }
33
+
34
+ &.base {
35
+ font-size: 1em;
36
+ }
37
+
38
+ &:focus {
39
+ box-shadow: none;
40
+ outline: solid var(--mtvh-btn-outline-border) var(--mtvh-btn-outline-color);
41
+ outline-offset: 0.5rem;;
42
+ text-decoration: none;
43
+ border-radius: var(--mtvh-btn-border-radius);
44
+ color: var(--mtvh-blue-05);
45
+ }
46
+
47
+ &:active {
48
+ color: var(--mtvh-blue-06);
49
+ }
50
+
51
+ &.disabled, &[aria-disabled="true"] {
52
+ color: var(--mtvh-grey-06);
53
+ pointer-events: none;
54
+ cursor: not-allowed;
55
+ }
56
+
57
+ @each $color, $property-map in $mtvh-links {
58
+ &-#{"" + $color} {
59
+ color: map-get($property-map, text-color);
60
+
61
+ &:hover {
62
+ color: map-get($property-map, text-color-hover);
63
+ }
64
+
65
+ @if map-get($property-map, text-color-focus) {
66
+
67
+ &:focus {
68
+ color: map-get($property-map, text-color-focus);
69
+ }
70
+
71
+ &:focus:not(:focus-visible) {
72
+ color: map-get($property-map, text-color-active);
73
+ }
74
+ }
75
+ &:active {
76
+ color: map-get($property-map, text-color-active);
77
+ }
78
+ &:disabled,
79
+ &.disabled {
80
+ color: map-get($property-map, text-disabled-color);
81
+
82
+ }
83
+ }
84
+ }
85
+ &:before {
86
+ margin-right: $link-icon-spacing !important;
87
+ }
88
+ &:after {
89
+ margin-left: $link-icon-spacing !important;
90
+ }
91
+
92
+ }
@@ -0,0 +1,8 @@
1
+ @font-face {
2
+ font-family: 'Paralucent';
3
+ src:
4
+ url('#{$font-path}paralucent-demibold-webfont.woff2') format('woff2'),
5
+ url('#{$font-path}paralucent-demibold-webfont.woff') format('woff');
6
+ font-weight:600;
7
+ font-style:normal;
8
+ }
@@ -0,0 +1,15 @@
1
+ //modify bootstrap map
2
+
3
+
4
+ $mtvh-spacing : (
5
+ 'spacing-1': 0.125, //2px
6
+ 'spacing-2': 0.25, //4px
7
+ 'spacing-3': 0.5, //8px
8
+ 'spacing-4': 0.75, //12px
9
+ 'spacing-5': 1, //16px
10
+ 'spacing-6': 1.5, //24px
11
+ 'spacing-7': 2, //32px
12
+ 'spacing-8': 2.5, //40px
13
+ );
14
+
15
+
@@ -0,0 +1,114 @@
1
+ /**
2
+ * List of all the SVG icons of the project
3
+ */
4
+ $icons: (
5
+ 'arrow-right': '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.966 6.255c-.302-.3-.411-.658-.237-1.235.173-.577.45-.96.936-.922.486.037 2.475 1.723 3.219 2.32.743.597 2.08 1.53 2.818 1.966.738.436 1.331.782 1.296 1.297-.034.514-.158.995-1.05 1.706-.891.711-5.55 4.285-5.917 4.614-.367.329-.926-.276-.994-.691-.067-.415-.365-.869.15-1.251.516-.382 3.518-2.957 3.518-2.957s-.77.136-2.31.199c-2.218.09-2.99.17-4.771.147-1.78-.022-4.597-.173-5.368-.303-.77-.13-1.55-.25-1.145-.998.405-.749 1.46-1.049 2.71-1.1 1.25-.05 3.233-.018 5.505-.073 2.606-.059 4.92-.154 4.92-.154s-1.042-.793-1.783-1.333c-.742-.54-1.142-.895-1.489-1.241l-.008.01Z" fill="#0072BF"/></svg>'
6
+ ,'arrow-left': '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M9.034 13.935c.302.302.411.658.238 1.236-.174.577-.451.959-.937.922-.486-.037-2.475-1.724-3.219-2.32-.743-.597-2.08-1.531-2.818-1.967-.738-.435-1.331-.781-1.297-1.296.035-.515.16-.995 1.05-1.706.892-.712 5.55-4.286 5.918-4.614.367-.33.926.275.993.69.068.416.366.87-.15 1.252-.515.382-3.517 2.957-3.517 2.957s.77-.136 2.31-.199c2.218-.09 2.99-.17 4.771-.148 1.78.022 4.597.173 5.368.303.77.13 1.55.25 1.145.999-.405.748-1.46 1.048-2.71 1.1-1.25.05-3.233.018-5.505.072-2.606.06-4.92.154-4.92.154s1.042.794 1.783 1.334c.742.54 1.142.894 1.489 1.241l.008-.01Z" fill="#0072BF"/></svg>'
7
+ ,'arrow-up': '<svg width="20" height="20" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6.16006 9.12954C5.85875 9.4309 5.50207 9.54037 4.92472 9.36683C4.34736 9.1933 3.96535 8.91597 4.00249 8.43005C4.03963 7.94414 5.72601 5.95521 6.32286 5.21171C6.91971 4.46822 7.85344 3.13135 8.28895 2.39353C8.72446 1.6557 9.07083 1.06199 9.58548 1.09676C10.1001 1.13152 10.5804 1.2556 11.2917 2.14693C12.003 3.03826 15.5771 7.69693 15.9058 8.06424C16.2345 8.43155 15.6301 8.99029 15.2146 9.05777C14.7992 9.12525 14.3457 9.42315 13.9634 8.90793C13.5812 8.39272 11.0063 5.39061 11.0063 5.39061C11.0063 5.39061 11.1423 6.1612 11.2053 7.70092C11.2961 9.9181 11.3752 10.6907 11.3531 12.4713C11.3309 14.2519 11.18 17.0679 11.05 17.8391C10.92 18.6102 10.7998 19.3898 10.0514 18.9844C9.30299 18.579 9.00318 17.5234 8.95205 16.274C8.90092 15.0246 8.93379 13.041 8.87885 10.7697C8.81972 8.1637 8.72502 5.84973 8.72502 5.84973C8.72502 5.84973 7.93127 6.89092 7.39136 7.63242C6.85145 8.37391 6.49717 8.77406 6.15021 9.12108L6.16006 9.12954Z" fill="#0072BF"/></svg>'
8
+ ,'arrow-down': '<svg width="20" height="21" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M13.84 11.112c.301-.301.658-.41 1.235-.237.578.173.96.45.923.937-.038.486-1.724 2.474-2.32 3.218-.598.743-1.531 2.08-1.967 2.818-.436.738-.782 1.332-1.296 1.297-.515-.035-.995-.159-1.707-1.05-.711-.892-4.285-5.55-4.614-5.918-.328-.367.276-.926.691-.993.416-.068.87-.365 1.252.15s2.957 3.517 2.957 3.517-.136-.77-.2-2.31c-.09-2.218-.17-2.99-.147-4.77.022-1.781.173-4.597.303-5.368.13-.772.25-1.551.999-1.146.748.406 1.048 1.461 1.099 2.71.051 1.25.018 3.234.073 5.505.06 2.606.154 4.92.154 4.92s.794-1.041 1.334-1.783c.54-.741.894-1.141 1.24-1.489l-.01-.008Z" fill="#0072BF"/></svg>'
9
+ ,'check': '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="m6.813 13.492 9.9-9.848c.274-.275.587-.406.937-.393.35.012.663.156.938.43.274.275.412.587.412.937 0 .35-.137.661-.413.936l-10.8 10.784a1.313 1.313 0 0 1-1.912 0l-4.463-4.456c-.274-.274-.412-.587-.412-.936 0-.35.137-.662.413-.936.274-.275.587-.412.937-.412.35 0 .663.137.938.412l3.525 3.482Z" fill="#0072BF"/></svg>'
10
+ ,'filter': '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.894 20c-.293 0-.544-.104-.752-.312a1.024 1.024 0 0 1-.311-.751v-4.465c0-.293.104-.543.311-.751.208-.208.459-.312.752-.312s.543.104.75.312c.209.208.313.458.313.751v1.162h7.98c.293 0 .543.104.751.312.208.208.312.458.312.751s-.104.544-.312.752a1.024 1.024 0 0 1-.751.311h-7.98v1.177c0 .293-.104.543-.312.751a1.024 1.024 0 0 1-.751.312Zm-8.83-2.24c-.294 0-.544-.104-.752-.311A1.024 1.024 0 0 1 0 16.697c0-.293.104-.543.312-.75.208-.209.458-.313.751-.313h4.578c.293 0 .544.104.752.312.208.208.311.458.311.751s-.103.544-.311.752a1.024 1.024 0 0 1-.752.311H1.063Zm4.577-4.465c-.293 0-.543-.103-.75-.311a1.024 1.024 0 0 1-.313-.752V11.07H1.063c-.293 0-.543-.104-.751-.312a1.024 1.024 0 0 1-.312-.75c0-.294.104-.544.312-.752.208-.208.458-.312.751-.312h3.515V7.768c0-.293.104-.544.312-.752.208-.208.458-.312.751-.312s.544.104.752.312c.208.208.311.459.311.752v4.465c0 .292-.103.543-.311.75a1.024 1.024 0 0 1-.752.313Zm4.253-2.225c-.293 0-.544-.104-.752-.312a1.024 1.024 0 0 1-.311-.75c0-.294.104-.544.311-.752.208-.208.459-.312.752-.312h9.043c.293 0 .543.104.751.312.208.208.312.458.312.751s-.104.543-.312.751a1.024 1.024 0 0 1-.751.312H9.894Zm4.465-4.479c-.293 0-.544-.104-.752-.312a1.024 1.024 0 0 1-.311-.751V1.063c0-.293.104-.543.311-.751.208-.208.459-.312.752-.312s.543.104.75.312c.209.208.313.458.313.751V2.24h3.515c.293 0 .543.103.751.311.208.208.312.459.312.752s-.104.543-.312.75a1.024 1.024 0 0 1-.751.313h-3.515v1.162c0 .293-.104.543-.312.751a1.024 1.024 0 0 1-.751.312ZM1.063 4.366c-.293 0-.543-.104-.751-.312A1.024 1.024 0 0 1 0 3.303c0-.293.104-.544.312-.752.208-.208.458-.311.751-.311h9.043c.293 0 .544.103.752.311.207.208.311.459.311.752s-.104.543-.312.75a1.024 1.024 0 0 1-.75.313H1.062Z" fill="#0072BF"/></svg>'
11
+ ,'spreadsheet' : '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.143 20c-.59 0-1.094-.21-1.514-.63C.21 18.95 0 18.447 0 17.858V2.143c0-.59.21-1.094.63-1.514C1.05.21 1.553 0 2.142 0h15.714c.59 0 1.094.21 1.514.63.42.42.629.924.629 1.513v15.714c0 .59-.21 1.094-.63 1.514-.42.42-.924.629-1.513.629H2.143Zm0-2.143h3.8v-3.8h-3.8v3.8Zm5.943 0h3.828v-3.8H8.086v3.8Zm5.971 0h3.8v-3.8h-3.8v3.8ZM2.143 11.914h3.8V8.086h-3.8v3.828Zm5.943 0h3.828V8.086H8.086v3.828Zm5.971 0h3.8V8.086h-3.8v3.828ZM2.143 5.943h3.8v-3.8h-3.8v3.8Zm5.943 0h3.828v-3.8H8.086v3.8Zm5.971 0h3.8v-3.8h-3.8v3.8Z" fill="#000"/></svg>'
12
+ ,'word-doc' : '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.137 20c-.588 0-1.09-.21-1.51-.628A2.057 2.057 0 0 1 0 17.863V2.137c0-.588.21-1.09.628-1.51A2.058 2.058 0 0 1 2.137 0h15.726c.588 0 1.09.21 1.51.628.418.418.627.921.627 1.509v15.726c0 .588-.21 1.09-.628 1.51a2.057 2.057 0 0 1-1.509.627H2.137Zm0-2.137h15.726V2.137H2.137v15.726Zm3.376-2.336h5.612c.295 0 .546-.104.755-.313.21-.21.314-.46.314-.755s-.105-.546-.314-.755a1.029 1.029 0 0 0-.755-.314H5.513a1.03 1.03 0 0 0-.755.314 1.03 1.03 0 0 0-.314.755c0 .294.105.546.314.755.209.209.46.313.755.313Zm0-4.473h8.974c.295 0 .546-.104.755-.313.21-.21.314-.46.314-.755a1.03 1.03 0 0 0-.314-.755 1.03 1.03 0 0 0-.755-.314H5.513a1.03 1.03 0 0 0-.755.314 1.03 1.03 0 0 0-.314.755c0 .294.105.546.314.755.209.209.46.313.755.313Zm0-4.473h8.974c.295 0 .546-.104.755-.313a1.03 1.03 0 0 0 .314-.755 1.03 1.03 0 0 0-.314-.755 1.03 1.03 0 0 0-.755-.314H5.513a1.03 1.03 0 0 0-.755.314 1.03 1.03 0 0 0-.314.755c0 .294.105.546.314.755.209.209.46.313.755.313Z" fill="#000"/></svg>'
13
+ ,'video' : '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.797 18.345v-16.7c0-.487.166-.883.498-1.188A1.66 1.66 0 0 1 3.453 0c.143 0 .289.017.438.051.149.034.295.092.438.174l13.12 8.39a1.8 1.8 0 0 1 .566.62c.128.238.192.493.192.765s-.064.527-.192.765a1.722 1.722 0 0 1-.566.61l-13.12 8.39c-.143.089-.29.15-.438.184-.15.034-.291.051-.426.051-.448 0-.838-.152-1.17-.457-.332-.305-.498-.704-.498-1.198Zm2.708-1.939L14.587 10 4.505 3.594v12.812Z" fill="#000"/></svg>'
14
+ ,'music' : '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.633 20c-1.143 0-2.115-.401-2.916-1.203-.8-.802-1.201-1.774-1.201-2.917 0-1.142.4-2.114 1.201-2.916.8-.802 1.774-1.203 2.918-1.203.464 0 .898.071 1.303.213.405.143.775.358 1.111.646V1.038c0-.286.101-.53.303-.733.202-.203.448-.305.74-.305h4.353c.29 0 .537.101.74.304a.999.999 0 0 1 .303.732v1.71c0 .29-.102.535-.305.738-.203.203-.45.305-.739.305h-3.69V15.88c0 1.143-.4 2.115-1.203 2.917C9.75 19.6 8.776 20 7.633 20Z" fill="#000"/></svg>'
15
+ ,'download' : '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10 14.022c-.15 0-.29-.024-.422-.07a.987.987 0 0 1-.365-.24l-4.05-4.05a1.03 1.03 0 0 1-.324-.787c.01-.3.117-.563.323-.787.226-.225.493-.343.802-.352.31-.01.577.098.802.323l2.109 2.11V2.125c0-.319.108-.586.323-.802C9.414 1.108 9.681 1 10 1c.319 0 .586.108.802.323.215.216.323.483.323.802v8.044l2.11-2.11c.224-.225.492-.332.8-.323.31.01.578.127.803.352.206.225.314.487.323.787.01.3-.098.563-.323.787l-4.05 4.05a.988.988 0 0 1-.366.24c-.131.046-.272.07-.422.07ZM3.25 19c-.619 0-1.148-.22-1.59-.66-.44-.442-.66-.971-.66-1.59V14.5c0-.319.108-.586.323-.802.216-.215.483-.323.802-.323.319 0 .586.108.802.323.215.216.323.483.323.802v2.25h13.5V14.5c0-.319.108-.586.323-.802.216-.215.483-.323.802-.323.319 0 .586.108.802.323.215.216.323.483.323.802v2.25c0 .619-.22 1.148-.66 1.59-.442.44-.971.66-1.59.66H3.25Z" fill="#0072BF"/></svg>'
16
+ ,'person': '<svg width="25" height="25" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.5 11.611c-1.607 0-2.976-.566-4.108-1.697C7.26 8.782 6.694 7.412 6.694 5.806c0-1.607.566-2.976 1.698-4.108C9.524.566 10.893 0 12.5 0c1.607 0 2.976.566 4.108 1.698 1.132 1.132 1.698 2.5 1.698 4.108 0 1.606-.566 2.976-1.698 4.108-1.132 1.132-2.501 1.697-4.108 1.697ZM0 21.714v-1.17c0-.814.218-1.562.654-2.245a4.366 4.366 0 0 1 1.779-1.582 25.435 25.435 0 0 1 5.02-1.822c1.677-.41 3.36-.615 5.047-.615 1.688 0 3.37.205 5.05.615a25.352 25.352 0 0 1 5.019 1.821c.75.372 1.343.9 1.778 1.583.435.683.653 1.43.653 2.245v1.17c0 .673-.235 1.245-.706 1.716a2.336 2.336 0 0 1-1.716.706H2.422a2.336 2.336 0 0 1-1.716-.706A2.336 2.336 0 0 1 0 21.714Zm2.39.033h20.22v-1.199c0-.353-.1-.677-.3-.973-.2-.297-.477-.54-.83-.732a21.98 21.98 0 0 0-4.444-1.624 19.049 19.049 0 0 0-9.082 0c-1.493.367-2.969.908-4.426 1.624a2.285 2.285 0 0 0-.838.733c-.2.297-.3.62-.3.97v1.2ZM12.5 9.222a3.29 3.29 0 0 0 2.413-1.004 3.29 3.29 0 0 0 1.003-2.412 3.29 3.29 0 0 0-1.003-2.413A3.29 3.29 0 0 0 12.5 2.39a3.29 3.29 0 0 0-2.413 1.003 3.29 3.29 0 0 0-1.003 2.413c0 .94.334 1.743 1.003 2.412A3.29 3.29 0 0 0 12.5 9.222Z" fill="#000"/></svg>'
17
+ ,'search' : '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.215 14.417c-2.019 0-3.726-.698-5.122-2.094C.698 10.927 0 9.223 0 7.21c0-2.013.697-3.718 2.092-5.115C3.486.698 5.19 0 7.206 0c2.016 0 3.722.699 5.12 2.096 1.396 1.397 2.095 3.102 2.095 5.116 0 .843-.141 1.655-.425 2.436a6.767 6.767 0 0 1-1.134 2.03l6.89 6.871a.82.82 0 0 1 .248.59.803.803 0 0 1-.254.605.828.828 0 0 1-1.192.003l-6.883-6.888a6.552 6.552 0 0 1-2.065 1.152 7.238 7.238 0 0 1-2.39.406Zm-.004-1.688c1.545 0 2.851-.533 3.92-1.6 1.067-1.066 1.601-2.373 1.601-3.921 0-1.548-.534-2.855-1.602-3.921-1.068-1.066-2.375-1.599-3.922-1.599-1.547 0-2.854.533-3.92 1.6-1.066 1.066-1.6 2.373-1.6 3.921 0 1.548.534 2.855 1.6 3.921 1.067 1.066 2.374 1.599 3.923 1.599Z" fill="#000"/></svg>'
18
+ ,'generic-doc' : '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.95 20c-.528 0-.981-.188-1.358-.565a1.852 1.852 0 0 1-.565-1.358V1.923c0-.529.189-.982.565-1.358C2.97.188 3.422 0 3.95 0h7.308c.255 0 .499.047.73.141.231.094.438.232.62.413l4.8 4.79a1.925 1.925 0 0 1 .568 1.361v11.372c0 .529-.188.981-.565 1.358-.376.377-.83.565-1.358.565H3.95Zm7.154-14.09V1.923H3.95v16.154h12.103V6.872h-3.987a.926.926 0 0 1-.68-.282.926.926 0 0 1-.282-.68Z" fill="#000"/></svg>'
19
+ ,'presentation' : '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M18.182 17.727V3.182H1.818v6.363a.88.88 0 0 1-.261.648.88.88 0 0 1-.648.262.88.88 0 0 1-.648-.262A.88.88 0 0 1 0 9.545V3.182c0-.5.178-.928.534-1.284a1.75 1.75 0 0 1 1.284-.534h16.364c.5 0 .928.178 1.284.534.356.356.534.784.534 1.284v12.727c0 .5-.178.928-.534 1.284a1.75 1.75 0 0 1-1.284.534Zm-10.91-6.363c-1 0-1.855-.356-2.567-1.069-.713-.712-1.069-1.568-1.069-2.568s.356-1.856 1.069-2.568c.712-.712 1.568-1.068 2.568-1.068s1.856.356 2.568 1.068c.712.712 1.068 1.568 1.068 2.568s-.356 1.856-1.068 2.569c-.712.712-1.568 1.068-2.568 1.068Zm0-1.819c.5 0 .929-.178 1.285-.534a1.75 1.75 0 0 0 .534-1.284c0-.5-.178-.928-.534-1.284a1.75 1.75 0 0 0-1.284-.534c-.5 0-.928.178-1.284.534a1.75 1.75 0 0 0-.534 1.284c0 .5.178.928.534 1.284a1.75 1.75 0 0 0 1.284.534Zm-5.454 9.091c-.5 0-.928-.178-1.284-.534A1.75 1.75 0 0 1 0 16.818v-.727c0-.515.133-.989.398-1.42a2.65 2.65 0 0 1 1.057-.99 13.52 13.52 0 0 1 2.863-1.056 12.51 12.51 0 0 1 2.955-.352c1 0 1.985.117 2.954.352.97.235 1.925.587 2.864 1.057.44.227.792.557 1.057.989.265.431.398.905.398 1.42v.727c0 .5-.179.928-.535 1.284a1.751 1.751 0 0 1-1.284.534H1.818Zm0-1.818h10.91v-.727a.885.885 0 0 0-.455-.773 11.853 11.853 0 0 0-2.478-.92 10.548 10.548 0 0 0-5.045 0c-.833.204-1.66.511-2.477.92a.885.885 0 0 0-.455.773v.727Z" fill="#000"/></svg>'
20
+ ,'error' : '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6.1 19.212A9.738 9.738 0 0 0 10 20a9.738 9.738 0 0 0 3.9-.788 10.098 10.098 0 0 0 3.175-2.137c.9-.9 1.613-1.958 2.137-3.175A9.738 9.738 0 0 0 20 10a9.738 9.738 0 0 0-.788-3.9 10.099 10.099 0 0 0-2.137-3.175c-.9-.9-1.958-1.612-3.175-2.137A9.738 9.738 0 0 0 10 0a9.738 9.738 0 0 0-3.9.787 10.099 10.099 0 0 0-3.175 2.138c-.9.9-1.612 1.958-2.137 3.175A9.738 9.738 0 0 0 0 10c0 1.383.263 2.683.787 3.9a10.098 10.098 0 0 0 2.138 3.175c.9.9 1.958 1.613 3.175 2.137Zm9.575-3.537C14.125 17.225 12.233 18 10 18c-2.233 0-4.125-.775-5.675-2.325C2.775 14.125 2 12.233 2 10c0-2.233.775-4.125 2.325-5.675C5.875 2.775 7.767 2 10 2c2.233 0 4.125.775 5.675 2.325C17.225 5.875 18 7.767 18 10c0 2.233-.775 4.125-2.325 5.675Z" fill="#000"/><path d="M10 15.952c-.393 0-.73-.134-1.009-.404a1.3 1.3 0 0 1-.42-.971c0-.379.14-.702.42-.972.28-.27.616-.404 1.009-.404.393 0 .73.135 1.009.404.28.27.42.593.42.972a1.3 1.3 0 0 1-.42.971c-.28.27-.616.404-1.009.404Zm0-4.127c-.393 0-.73-.134-1.009-.404a1.3 1.3 0 0 1-.42-.971V4.947c0-.378.14-.702.42-.971.28-.27.616-.405 1.009-.405.393 0 .73.135 1.009.405.28.269.42.593.42.971v5.503a1.3 1.3 0 0 1-.42.971c-.28.27-.616.404-1.009.404Z" fill="#000"/></svg>'
21
+ ,'cancel': '<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.992 11.816 4.18 17.627c-.26.26-.555.384-.886.372-.33-.012-.626-.147-.886-.407a1.24 1.24 0 0 1 0-1.807l5.776-5.777-5.811-5.811A1.179 1.179 0 0 1 2 3.293c.012-.342.147-.643.407-.903a1.24 1.24 0 0 1 1.807 0L9.992 8.2l5.811-5.811a1.24 1.24 0 0 1 1.807 0 1.24 1.24 0 0 1 0 1.807L11.8 10.008l5.811 5.812c.26.26.39.555.39.886 0 .33-.13.626-.39.886a1.24 1.24 0 0 1-1.807 0l-5.811-5.776Z" fill="#DD080D"/></svg>'
22
+ ,'upload': '<svg width="21" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.39 12.825V16c0 .283.096.52.288.712.192.192.43.288.713.288s.52-.096.712-.288a.968.968 0 0 0 .288-.712v-3.175l.9.9c.1.1.212.175.337.225.125.05.25.07.375.063a1.038 1.038 0 0 0 .688-.313c.183-.2.279-.433.287-.7a.916.916 0 0 0-.287-.7l-2.6-2.6a.877.877 0 0 0-.325-.212 1.106 1.106 0 0 0-.375-.063c-.134 0-.259.02-.375.063a.877.877 0 0 0-.325.212l-2.6 2.6c-.2.2-.296.433-.288.7.008.267.113.5.313.7.2.183.433.28.7.288.266.008.5-.088.7-.288l.875-.875ZM4.39 20c-.55 0-1.02-.196-1.412-.587A1.926 1.926 0 0 1 2.391 18V2c0-.55.195-1.02.587-1.413A1.926 1.926 0 0 1 4.391 0h7.175a1.974 1.974 0 0 1 1.4.575l4.85 4.85a1.975 1.975 0 0 1 .575 1.4V18c0 .55-.196 1.02-.588 1.413a1.926 1.926 0 0 1-1.412.587h-12Zm7-14V2h-7v16h12V7h-4a.968.968 0 0 1-.712-.287.968.968 0 0 1-.287-.713Z" fill="#000"/></svg>'
23
+ ,'delete': '<svg width="21" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.242 19c-.55 0-1.02-.196-1.412-.587A1.926 1.926 0 0 1 3.242 17V4a.968.968 0 0 1-.712-.288A.968.968 0 0 1 2.242 3c0-.283.096-.52.288-.712A.968.968 0 0 1 3.242 2h4c0-.283.096-.52.288-.712A.968.968 0 0 1 8.242 1h4c.283 0 .521.096.713.288.191.191.287.429.287.712h4c.284 0 .521.096.713.288.191.191.287.429.287.712s-.096.52-.287.712a.968.968 0 0 1-.713.288v13c0 .55-.196 1.02-.587 1.413a1.926 1.926 0 0 1-1.413.587h-10Zm10-15h-10v13h10V4Zm-7 11c.284 0 .521-.096.713-.287A.968.968 0 0 0 9.242 14V7a.968.968 0 0 0-.287-.713A.968.968 0 0 0 8.242 6a.968.968 0 0 0-.712.287.968.968 0 0 0-.288.713v7c0 .283.096.52.288.713.191.191.429.287.712.287Zm4 0c.283 0 .521-.096.713-.287a.968.968 0 0 0 .287-.713V7a.967.967 0 0 0-.287-.713.968.968 0 0 0-.713-.287.968.968 0 0 0-.712.287.967.967 0 0 0-.288.713v7c0 .283.096.52.288.713.191.191.429.287.712.287Z" fill="#0072BF"/></svg>'
24
+ ,'update' : '<svg width="28" height="28" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.576 25.136c-1.543 0-2.989-.293-4.338-.878a11.298 11.298 0 0 1-3.533-2.386A11.302 11.302 0 0 1 4.32 18.34c-.585-1.348-.878-2.794-.878-4.338s.293-2.991.878-4.34a11.296 11.296 0 0 1 2.386-3.534 11.265 11.265 0 0 1 3.543-2.386 10.873 10.873 0 0 1 4.353-.878c1.64 0 3.192.345 4.657 1.036a11.353 11.353 0 0 1 3.804 2.903V4.592c0-.255.09-.474.272-.658a.895.895 0 0 1 .662-.275c.26 0 .481.091.664.274a.895.895 0 0 1 .275.656v4.423c0 .318-.111.588-.334.811a1.105 1.105 0 0 1-.811.335h-4.42a.893.893 0 0 1-.662-.277.909.909 0 0 1-.272-.66c0-.256.09-.476.272-.66a.893.893 0 0 1 .661-.276h2.487a10.062 10.062 0 0 0-3.238-2.595 8.762 8.762 0 0 0-4.015-.953c-2.585 0-4.78.899-6.583 2.696-1.804 1.797-2.706 3.987-2.706 6.57 0 2.572.9 4.759 2.698 6.559 1.798 1.8 3.986 2.7 6.565 2.7 2.151 0 4.06-.663 5.724-1.99 1.665-1.328 2.747-3.022 3.245-5.083.075-.258.215-.454.42-.59a.992.992 0 0 1 .69-.155.872.872 0 0 1 .634.383c.15.219.188.456.116.713-.578 2.506-1.871 4.566-3.878 6.178-2.008 1.612-4.325 2.418-6.952 2.418Zm.951-11.517 3.638 3.639a.938.938 0 0 1 .278.662.902.902 0 0 1-.278.67.906.906 0 0 1-1.33-.002l-3.844-3.872c-.115-.114-.2-.24-.255-.374a1.13 1.13 0 0 1-.082-.43V8.375c0-.255.09-.474.272-.658a.895.895 0 0 1 .662-.275c.26 0 .48.091.664.275a.899.899 0 0 1 .275.658v5.244Z" fill="#000"/></svg>'
25
+ ,'envelop' : '<svg width="28" height="28" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.279 25a2.15 2.15 0 0 1-1.574-.662 2.15 2.15 0 0 1-.662-1.574V5.236c0-.608.22-1.133.662-1.574A2.15 2.15 0 0 1 2.279 3h23.444c.608 0 1.133.22 1.574.662.441.441.662.966.662 1.574v17.528a2.15 2.15 0 0 1-.662 1.574 2.15 2.15 0 0 1-1.574.662H2.28ZM26.178 6.38 14.622 13.96a2.43 2.43 0 0 1-.31.138.907.907 0 0 1-.622 0 1.365 1.365 0 0 1-.281-.138L1.824 6.38v16.38c0 .134.043.243.129.33a.445.445 0 0 0 .329.128H25.72a.446.446 0 0 0 .33-.129.446.446 0 0 0 .128-.329V6.381ZM14 12.49l11.86-7.709H2.166l11.835 7.709ZM1.824 6.38v.28-1.27.03-.639.631-.041 1.29-.28V23.22 6.38Z" fill="#000"/></svg>'
26
+ ,'notification': '<svg width="28" height="28" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.877 23.917a.85.85 0 0 1-.877-.88c0-.254.083-.466.25-.636a.841.841 0 0 1 .627-.255h1.714V10.838c0-1.985.612-3.755 1.837-5.31 1.224-1.556 2.806-2.536 4.745-2.942V1.82c0-.509.175-.939.525-1.29.35-.353.779-.529 1.288-.529s.94.176 1.292.528c.353.352.53.782.53 1.29v.773c1.944.402 3.53 1.381 4.759 2.937 1.228 1.555 1.842 3.325 1.842 5.31v11.308h1.704c.24 0 .448.087.624.26a.864.864 0 0 1 .263.64.824.824 0 0 1-.259.626.892.892 0 0 1-.638.245H3.877ZM13.987 28a2.542 2.542 0 0 1-1.864-.777 2.54 2.54 0 0 1-.776-1.861h5.287c0 .725-.26 1.346-.78 1.863a2.553 2.553 0 0 1-1.866.775Zm-6.622-5.854h13.27V10.838c0-1.83-.65-3.39-1.95-4.678-1.301-1.29-2.868-1.934-4.701-1.934-1.833 0-3.394.644-4.684 1.934-1.29 1.289-1.935 2.848-1.935 4.678v11.308Z" fill="#000"/></svg>'
27
+ ,'close': '<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14 15.9881L3.89441 26.0772C3.61683 26.3543 3.28654 26.4919 2.90353 26.49C2.52056 26.4881 2.18706 26.3454 1.90303 26.0618C1.62929 25.7782 1.495 25.451 1.50014 25.0802C1.50529 24.7094 1.64473 24.3874 1.91847 24.1141L12.0086 14L1.91847 3.88591C1.65756 3.62547 1.5239 3.30662 1.51749 2.92938C1.51107 2.55217 1.64473 2.22178 1.91847 1.93822C2.19221 1.65465 2.51735 1.5087 2.89391 1.50036C3.27047 1.49202 3.60397 1.62963 3.89441 1.9132L14 12.0119L24.1152 1.9132C24.3864 1.64247 24.7135 1.50806 25.0965 1.50997C25.4794 1.5119 25.8161 1.65465 26.1066 1.93822C26.3739 2.22178 26.505 2.54897 26.4999 2.91977C26.4947 3.29058 26.3553 3.61262 26.0815 3.88591L15.9914 14L26.0815 24.1141C26.3424 24.3745 26.4761 24.6934 26.4825 25.0706C26.4889 25.4478 26.3553 25.7782 26.0815 26.0618C25.8078 26.3454 25.4826 26.4913 25.1061 26.4997C24.7295 26.508 24.3992 26.3672 24.1152 26.0772L14 15.9881Z" fill="black"/></svg>','undo' : '<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.71423 16.65C5.51933 16.65 5.3532 16.5816 5.21585 16.4449C5.07852 16.3082 5.00985 16.1428 5.00985 15.9488C5.00985 15.758 5.07852 15.5942 5.21585 15.4575C5.3532 15.3208 5.51933 15.2525 5.71423 15.2525H12.2324C13.2308 15.2525 14.0826 14.9117 14.788 14.23C15.4934 13.5484 15.8461 12.7152 15.8461 11.7303C15.8461 10.7455 15.4934 9.91385 14.788 9.23541C14.0826 8.55698 13.2308 8.21776 12.2324 8.21776H5.08507L7.3691 10.4913C7.51125 10.6328 7.58233 10.7982 7.58233 10.9874C7.58233 11.1766 7.51125 11.3419 7.3691 11.4835C7.22694 11.6198 7.06129 11.6877 6.87216 11.6871C6.68304 11.6864 6.52062 11.6186 6.38489 11.4835L3.00665 8.12077C2.91789 8.0356 2.85292 7.94242 2.81174 7.84125C2.77058 7.74009 2.75 7.63188 2.75 7.51662C2.75 7.40456 2.77058 7.29794 2.81174 7.19677C2.85292 7.09559 2.91789 7.00243 3.00665 6.91727L6.37235 3.56225C6.51451 3.42073 6.68064 3.34998 6.87073 3.34998C7.06081 3.34998 7.22694 3.42073 7.3691 3.56225C7.51125 3.70696 7.58072 3.87472 7.57751 4.06553C7.5743 4.25635 7.50483 4.41932 7.3691 4.55442L5.08507 6.82028H12.2324C13.6225 6.82028 14.8063 7.29572 15.7838 8.24661C16.7613 9.1975 17.25 10.3587 17.25 11.7303C17.25 13.1019 16.7613 14.2647 15.7838 15.2188C14.8063 16.1729 13.6225 16.65 12.2324 16.65H5.71423Z" fill="black"/></svg>'
28
+ ,'sign-in' : '<svg width="29" height="29" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.816 13.941c-1.606 0-2.976-.563-4.107-1.688C9.577 11.127 9.01 9.766 9.01 8.168c0-1.597.566-2.96 1.698-4.085 1.131-1.125 2.5-1.688 4.107-1.688 1.607 0 2.976.563 4.108 1.688 1.132 1.126 1.698 2.488 1.698 4.085 0 1.598-.566 2.96-1.698 4.085-1.131 1.126-2.5 1.688-4.108 1.688Zm-12.5 10.045v-1.163c0-.809.218-1.553.654-2.232a4.357 4.357 0 0 1 1.78-1.573 25.528 25.528 0 0 1 5.019-1.812 21.322 21.322 0 0 1 5.048-.61c1.687 0 3.37.203 5.05.61a25.45 25.45 0 0 1 5.018 1.811c.75.37 1.343.895 1.778 1.574.436.679.653 1.423.653 2.232v1.163c0 .67-.235 1.238-.706 1.707a2.343 2.343 0 0 1-1.716.702H4.739a2.343 2.343 0 0 1-1.716-.702 2.316 2.316 0 0 1-.707-1.707Zm2.39.033h20.22v-1.192c0-.35-.1-.673-.3-.968a2.305 2.305 0 0 0-.83-.727 22.066 22.066 0 0 0-4.444-1.615 19.148 19.148 0 0 0-9.081 0c-1.494.365-2.97.903-4.427 1.615-.358.19-.637.433-.837.729-.2.296-.301.617-.301.964v1.194Zm10.11-12.454c.94 0 1.744-.332 2.413-.998.669-.665 1.004-1.465 1.004-2.399 0-.934-.335-1.734-1.004-2.399a3.299 3.299 0 0 0-2.413-.998c-.939 0-1.743.333-2.412.998-.67.665-1.004 1.465-1.004 2.4 0 .933.335 1.733 1.004 2.398a3.299 3.299 0 0 0 2.412.998Z" fill="#000"/></svg>'
29
+ ,'hamburger' : '<svg width="32" height="22" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.811 21.289c-.362 0-.671-.128-.927-.384a1.266 1.266 0 0 1-.384-.929c0-.356.128-.663.384-.918.256-.256.565-.384.927-.384h28.387c.356 0 .662.128.918.384s.384.563.384.92c0 .362-.128.671-.384.927a1.253 1.253 0 0 1-.918.384H1.81Zm0-8.942c-.362 0-.671-.128-.927-.385a1.265 1.265 0 0 1-.384-.928c0-.357.128-.663.384-.919s.565-.384.927-.384h28.387c.356 0 .662.129.918.385s.384.563.384.92c0 .362-.128.671-.384.927a1.253 1.253 0 0 1-.918.384H1.81Zm0-8.943c-.362 0-.671-.128-.927-.384A1.266 1.266 0 0 1 .5 2.092c0-.357.128-.663.384-.92C1.14.918 1.449.79 1.81.79h28.387c.356 0 .662.128.918.384.256.257.384.563.384.92 0 .362-.128.672-.384.928a1.253 1.253 0 0 1-.918.383H1.81Z" fill="#000"/></svg>'
30
+ ,'expand' : '<svg width="29" height="29" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.448 6.664c-.288.01-.506-.093-.686-.426-.18-.332-.218-.628.04-.84.259-.212 2.023-.411 2.667-.5.644-.09 1.737-.31 2.304-.467.567-.157 1.021-.285 1.241-.045.22.24.38.507.264 1.235-.115.727-.783 4.466-.814 4.781-.031.315-.587.315-.812.166-.225-.15-.581-.207-.501-.615.08-.408.385-2.935.385-2.935s-.32.42-1.056 1.17c-1.059 1.08-1.406 1.476-2.3 2.301-.895.826-2.363 2.081-2.805 2.386-.443.306-.886.619-1.029.103-.143-.515.243-1.14.84-1.749.597-.608 1.597-1.524 2.7-2.613 1.266-1.248 2.372-2.375 2.372-2.375s-.883.143-1.5.256a8.543 8.543 0 0 1-1.31.159v.008ZM10.067 23.411c.289-.01.507.094.687.426.18.332.218.629-.04.84-.26.212-2.023.412-2.667.5-.644.09-1.738.311-2.305.468-.566.157-1.02.284-1.24.044-.22-.24-.38-.507-.264-1.234.115-.727.783-4.466.814-4.782.031-.315.587-.314.811-.165.225.149.582.206.502.614-.08.408-.385 2.936-.385 2.936s.32-.421 1.055-1.17c1.06-1.08 1.407-1.477 2.301-2.302.894-.826 2.362-2.08 2.805-2.386.443-.305.885-.619 1.028-.103.143.516-.243 1.141-.84 1.75-.596.607-1.596 1.524-2.699 2.613-1.267 1.248-2.372 2.374-2.372 2.374s.882-.143 1.499-.256a8.534 8.534 0 0 1 1.31-.159v-.008Z" fill="#000"/></svg>'
31
+ ,'collapse' : '<svg width="29" height="29" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M23.911 8.78c.288-.011.507.093.686.425.18.333.218.629-.04.84-.258.212-2.022.412-2.666.501-.644.09-1.738.31-2.305.467-.567.157-1.02.284-1.24.044-.22-.24-.38-.507-.265-1.234.116-.727.784-4.466.815-4.782.03-.315.586-.314.811-.165.225.149.582.206.502.614-.08.408-.386 2.936-.386 2.936s.32-.42 1.056-1.17c1.06-1.08 1.406-1.476 2.3-2.302.895-.825 2.363-2.08 2.806-2.386.442-.305.885-.618 1.028-.103.143.516-.243 1.141-.84 1.75-.596.608-1.597 1.524-2.7 2.613-1.266 1.248-2.371 2.374-2.371 2.374s.882-.143 1.499-.256a8.542 8.542 0 0 1 1.31-.158v-.009ZM5.366 21.033c-.288.01-.507-.094-.686-.426-.18-.333-.218-.629.04-.84.259-.212 2.023-.412 2.667-.501.644-.09 1.737-.31 2.304-.467.567-.157 1.021-.284 1.24-.044.22.24.38.507.265 1.234-.115.727-.783 4.466-.814 4.782-.031.315-.587.314-.812.165-.225-.149-.581-.206-.501-.614.08-.408.385-2.936.385-2.936s-.32.42-1.056 1.17c-1.059 1.08-1.406 1.476-2.3 2.302-.895.825-2.363 2.08-2.805 2.386-.443.305-.886.618-1.029.103-.143-.516.243-1.141.84-1.75.597-.608 1.597-1.524 2.7-2.613 1.266-1.248 2.372-2.374 2.372-2.374s-.883.143-1.5.256a8.544 8.544 0 0 1-1.31.158v.009Z" fill="#000"/></svg>'
32
+
33
+ );
34
+
35
+ /**
36
+ * List of all the icons config
37
+ */
38
+
39
+ $mtvh-icons : (
40
+ 'arrow-left' : ( width: $icon-size-scale-sm, height: $icon-size-scale-sm ),
41
+ 'arrow-right' : ( width: $icon-size-scale-sm, height: $icon-size-scale-sm ),
42
+ 'arrow-up' : ( width: $icon-size-scale-sm, height: $icon-size-scale-sm ),
43
+ 'arrow-down' : ( width: $icon-size-scale-sm, height: $icon-size-scale-sm ),
44
+ 'check' : ( width: $icon-size-scale-sm, height: $icon-size-scale-sm ),
45
+ 'filter' : ( width: $icon-size-scale-sm, height: $icon-size-scale-sm),
46
+ 'cancel' : ( width: $icon-size-scale-sm, height: $icon-size-scale-sm),
47
+ 'search' : ( width: $icon-size-scale-sm, height: $icon-size-scale-sm ),
48
+ 'undo' : ( width: $icon-size-scale-sm, height: $icon-size-scale-sm ),
49
+ 'spreadsheet' : ( width: $icon-size-scale-sm, height: $icon-size-scale-sm ),
50
+ 'word-doc': ( width: $icon-size-scale-sm, height: $icon-size-scale-sm),
51
+ 'video': ( width: $icon-size-scale-sm, height: $icon-size-scale-sm),
52
+ 'music': ( width: $icon-size-scale-sm, height: $icon-size-scale-sm),
53
+ 'generic-doc': ( width: $icon-size-scale-sm, height: $icon-size-scale-sm),
54
+ 'download': ( width: $icon-size-scale-sm, height: $icon-size-scale-sm),
55
+ 'upload': ( width: $icon-size-scale-sm, height: $icon-size-scale-sm),
56
+ 'delete': ( width: $icon-size-scale-sm, height: $icon-size-scale-sm),
57
+ 'error': ( width: $icon-size-scale-sm, height: $icon-size-scale-sm),
58
+ 'presentation': ( width: $icon-size-scale-sm, height: $icon-size-scale-sm),
59
+ 'notification': ( width: $icon-size-scale-md , height: $icon-size-scale-md ),
60
+ 'update' : ( width: $icon-size-scale-md, height: $icon-size-scale-md),
61
+ 'envelop' : ( width: $icon-size-scale-md, height: $icon-size-scale-md),
62
+ 'close': ( width: $icon-size-scale-md, height: $icon-size-scale-md ),
63
+ 'sign-in':( width: $icon-size-scale-md, height: $icon-size-scale-md ),
64
+ 'expand':( width: $icon-size-scale-md, height: $icon-size-scale-md ),
65
+ 'collapse':( width: $icon-size-scale-md, height: $icon-size-scale-md ),
66
+ 'hamburger' :( width: 32px, height: 22px ),
67
+ 'border-info' : ( width: $icon-size-scale-md, height: $icon-size-scale-md , svg-path: '#{$asset-icon-path}border-info.svg' ),
68
+ 'border-tick': ( width: $icon-size-scale-md, height: $icon-size-scale-md, svg-path: '#{$asset-icon-path}border-tick.svg' ),
69
+ 'border-cross': ( width: $icon-size-scale-md, height: $icon-size-scale-md, svg-path: '#{$asset-icon-path}border-cross.svg' ),
70
+ 'border-warning-sign': ( width: $icon-size-scale-md, height: $icon-size-scale-md, svg-path: '#{$asset-icon-path}border-warning-sign.svg' ),
71
+
72
+ 'credit-card': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl,svg-path: '#{$asset-icon-path}credit-card.svg'),
73
+ 'bank-notes': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}bank-notes.svg' ),
74
+ 'coins': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}coins.svg' ),
75
+ 'tools': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}tools.svg' ),
76
+ 'water': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}water.svg' ),
77
+ 'lightbulb': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}lightbulb.svg' ),
78
+ 'warning-sign': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}warning-sign.svg' ),
79
+ 'warning-sign-purple': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}warning-sign-purple.svg' ),
80
+ 'fire': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}fire.svg' ),
81
+ 'picture': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}picture.svg' ),
82
+ 'paint-roller': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}paint-roller.svg' ),
83
+
84
+ 'lighting-bolt': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}lighting-bolt.svg' ),
85
+ 'two-people': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}two-people.svg' ),
86
+ 'speech': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}speech.svg' ),
87
+
88
+
89
+ 'user': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}user.svg' ),
90
+ 'pen-red': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}pen-red.svg' ),
91
+ 'book': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}book.svg' ),
92
+ 'info': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}info.svg' ),
93
+ 'aerosol': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}aerosol.svg' ),
94
+
95
+ 'tick-list': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}tick-list.svg' ),
96
+ 'pen-and-paper': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}pen-and-paper.svg' ),
97
+ 'page-and-cog': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}page-and-cog.svg' ),
98
+ 'key': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}key.svg' ),
99
+ 'measure': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}measure.svg' ),
100
+ 'pet': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}pet.svg' ),
101
+ 'inspection': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}inspection.svg' ),
102
+ 'parking': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}parking.svg' ),
103
+ 'feedback-form': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}feedback-form.svg' ),
104
+ 'person-magnifying-glass': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}person-magnifying-glass.svg' ),
105
+ 'magnifying-glass': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}magnifying-glass.svg' ),
106
+ 'tick-list-with-cross': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}tick-list-with-cross.svg' ),
107
+
108
+ 'tools-dark': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}tools-dark.svg' ),
109
+ 'cog-dark': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}cog-dark.svg' ),
110
+ 'credit-card-dark': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}credit-card-dark.svg' ),
111
+ 'speech-dark': ( width: $icon-size-scale-xl, height: $icon-size-scale-xl, svg-path: '#{$asset-icon-path}speech-dark.svg' ),
112
+
113
+ );
114
+
@@ -0,0 +1,51 @@
1
+ :root {
2
+
3
+ --mtvh-white: #fff;
4
+ --mtvh-black: #000;
5
+
6
+ --mtvh-grey-01: #F7F7F7;
7
+ --mtvh-grey-02: #EAE9E9;
8
+ --mtvh-grey-03: #DADADA;
9
+ --mtvh-grey-04: #C7C7C7;
10
+ --mtvh-grey-05: #9A9A9A;
11
+ --mtvh-grey-06: #696969;
12
+
13
+ --mtvh-blue-01: #EEF9FF;
14
+ --mtvh-blue-02: #6DBDF5;
15
+ --mtvh-blue-03: #1791E8;
16
+ --mtvh-blue-04: #0072BF;
17
+ --mtvh-blue-05: #005792;
18
+ --mtvh-blue-06: #00385E;
19
+
20
+ --mtvh-yellow-01: #FFF7D6;
21
+ --mtvh-yellow-02: #F8D643;
22
+ --mtvh-yellow-03: #E8C426;
23
+ --mtvh-yellow-04: #D8B000;
24
+ --mtvh-yellow-05: #BF9C04;
25
+ --mtvh-yellow-06: #A18405;
26
+
27
+ --mtvh-green-01: #E7F7E3;
28
+ --mtvh-green-02: #82CC71;
29
+ --mtvh-green-03: #5EAF4B;
30
+ --mtvh-green-04: #23870B;
31
+ --mtvh-green-05: #156402;
32
+ --mtvh-green-06: #0F4902;
33
+
34
+ --mtvh-purple-01: #F6F4FF;
35
+ --mtvh-purple-02: #B49BDE;
36
+ --mtvh-purple-03: #9470D1;
37
+ --mtvh-purple-04: #895ED0;
38
+ --mtvh-purple-05: #5D2CAE;
39
+ --mtvh-purple-06: #380C80;
40
+
41
+ --mtvh-red-01: #FFF6F7;
42
+ --mtvh-red-02: #FF7C8C;
43
+ --mtvh-red-03: #FA3D54;
44
+ --mtvh-red-04: #DD080D;
45
+ --mtvh-red-05: #BE0509;
46
+ --mtvh-red-06: #970307;
47
+
48
+ --mtvh-stone-01: #F9F5F0;
49
+ --mtvh-stone-02: #F9F2EA;
50
+
51
+ }