@mtvh/mtvh-design-system 0.0.27 → 0.0.29

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 (22) hide show
  1. package/assets/scss/components/_all.scss +2 -0
  2. package/assets/scss/components/_card-list.scss +2 -5
  3. package/assets/scss/components/_content-block.scss +7 -1
  4. package/assets/scss/components/_form.scss +5 -4
  5. package/assets/scss/components/_good-to-know.scss +62 -0
  6. package/assets/scss/components/_pagination.scss +53 -1
  7. package/assets/scss/components/_space-selection.scss +66 -0
  8. package/assets/scss/config/_icon-list.scss +64 -46
  9. package/assets/scss/config/_palette.scss +1 -0
  10. package/assets/scss/config/_variables.scss +46 -3
  11. package/assets/scss/core/iconography/_icon.scss +15 -1
  12. package/assets/scss/core/typography/_typography.scss +20 -9
  13. package/assets/scss/forms/_credit-card-form.scss +16 -0
  14. package/assets/scss/forms/_mtvh-address.scss +21 -0
  15. package/assets/scss/forms/{_mtvho_contact_email.scss → _mtvho-contact-email.scss} +1 -1
  16. package/assets/scss/forms/{_mtvho_contact_phone.scss → _mtvho-contact-phone.scss} +1 -1
  17. package/assets/scss/forms/_stripe.scss +15 -0
  18. package/assets/scss/mixins/_butttons.scss +8 -13
  19. package/assets/scss/mixins/_form.scss +2 -2
  20. package/assets/scss/mixins/_icon.scss +27 -0
  21. package/dist/mtvh.min.css +6 -4
  22. package/package.json +1 -1
package/assets/scss/components/_all.scss CHANGED
@@ -14,3 +14,5 @@
14
14
  @import "_pagination";
15
15
  @import "_payment";
16
16
  @import "_card-list";
17
+ @import "_space-selection";
18
+ @import "_good-to-know";
package/assets/scss/components/_card-list.scss CHANGED
@@ -1,5 +1,4 @@
1
1
  .card-list {
2
-
3
2
  &-item {
4
3
  display: flex;
5
4
  flex-direction: row;
@@ -24,7 +23,8 @@
24
23
  }
25
24
  }
26
25
 
27
- label, .label {
26
+ label,
27
+ .label {
28
28
  flex: 1 100px;
29
29
  display: flex;
30
30
 
@@ -51,9 +51,6 @@
51
51
 
52
52
  button {
53
53
  align-self: flex-start;
54
- @include media-breakpoint-up(sm) {
55
- align-self: start;
56
- }
57
54
  }
58
55
 
59
56
  .invali-feedback {
package/assets/scss/components/_content-block.scss CHANGED
@@ -3,7 +3,7 @@
3
3
  position: relative;
4
4
  padding: $mtvh-spacing-6 $mtvh-spacing-5 $mtvh-spacing-5 $mtvh-spacing-5;
5
5
  @include media-breakpoint-up(md) {
6
- padding: $mtvh-spacing-6;
6
+ padding: $mtvh-spacing-6 $mtvh-spacing-6 $mtvh-spacing-5 $mtvh-spacing-6;
7
7
  }
8
8
 
9
9
  &:last-of-type {
@@ -126,6 +126,9 @@
126
126
  &-bg {
127
127
  --#{$prefix}content-block-bg: var(--mtvh-white);
128
128
  background-color: var(--#{$prefix}content-block-bg);
129
+ a {
130
+ color: var(--#{$prefix}content-block-bg-link-color, var(--#{$prefix}blue-04));
131
+ }
129
132
  }
130
133
 
131
134
  &-icon {
@@ -227,5 +230,8 @@
227
230
  @each $state, $variable in $content-block-theme-colors {
228
231
  .mtvh-content-block-bg--#{$state} {
229
232
  --#{$prefix}content-block-bg: #{$variable};
233
+ @if ($state == "grey-02" or $state == "yellow-02") {
234
+ --#{$prefix}content-block-bg-link-color: var(--#{$prefix}black);
235
+ }
230
236
  }
231
237
  }
package/assets/scss/components/_form.scss CHANGED
@@ -6,17 +6,19 @@
6
6
  @import "../forms/form-date-input";
7
7
  @import "../forms/input-group";
8
8
  @import "../forms/validation";
9
+ @import "../forms/stripe";
10
+ @import "../forms/credit-card-form";
9
11
 
10
12
  .formio-form {
11
13
  @import "../forms/formio";
12
- @import "../forms/mtvho_contact_phone";
13
- @import "../forms/mtvho_contact_email";
14
+ @import "../forms/mtvho-contact-phone";
15
+ @import "../forms/mtvho-contact-email";
16
+ @import "../forms/mtvh-address";
14
17
  }
15
18
 
16
19
  .mtvh-form,
17
20
  .mtvh-formio,
18
21
  formio {
19
-
20
22
  --#{$prefix}form-group-padding-y: #{$mtvh-spacing-6};
21
23
  @include media-breakpoint-up("lg") {
22
24
  --#{$prefix}form-group-padding-y: #{$mtvh-spacing-7};
@@ -110,7 +112,6 @@ formio {
110
112
  margin: 0;
111
113
  padding-left: 0;
112
114
  padding-right: 0;
113
-
114
115
  }
115
116
  &--md {
116
117
  --#{$prefix}form-control-input-width: #{$input-width-size-l};
package/assets/scss/components/_good-to-know.scss ADDED
@@ -0,0 +1,62 @@
1
+ .mtvh-good-to-know-block {
2
+ $spacing-unit: $mtvh-spacing-5;
3
+
4
+ --mtvh-btn-close-focus-outline-color: var(--mtvh-dark-outline-color);
5
+ --mtvh-btn-close-hover-bg-color: var(--mtvh-btn-close-warning-hover-bg);
6
+
7
+ @extend .mtvh-content-block;
8
+ @extend .mtvh-content-block-bg;
9
+ @extend .mtvh-content-block-bg--yellow-02;
10
+
11
+ padding: unset;
12
+ margin: unset;
13
+
14
+ .list-group-item {
15
+ display: flex;
16
+ border: none;
17
+ margin: unset;
18
+ padding: unset;
19
+ }
20
+
21
+ .list-group-item > .content {
22
+ flex: 1;
23
+ padding-bottom: $spacing-unit;
24
+ margin-left: $spacing-unit;
25
+ margin-top: $spacing-unit;
26
+ margin-right: $spacing-unit;
27
+ border-bottom: 1px solid var(--mtvh-yellow-03);
28
+
29
+ h3,
30
+ h4,
31
+ h5,
32
+ h6 {
33
+ font-family: $font-family-sans-serif;
34
+ font-size: $font-size-base;
35
+ font-weight: $mtvh-font-weight-bold;
36
+ line-height: $line-height-base;
37
+ margin: unset;
38
+ }
39
+
40
+ p {
41
+ font-family: $font-family-sans-serif;
42
+ font-size: $font-size-base;
43
+ line-height: $line-height-base;
44
+ }
45
+
46
+ a {
47
+ display: flex;
48
+ flex-direction: column;
49
+ font-weight: $mtvh-font-weight-normal;
50
+ }
51
+ }
52
+
53
+ .list-group-item.dismissable > .content {
54
+ margin-right: unset;
55
+ }
56
+
57
+ .list-group-item:last-child > .content {
58
+ border: none;
59
+ padding: unset;
60
+ margin-bottom: $spacing-unit;
61
+ }
62
+ }
package/assets/scss/components/_pagination.scss CHANGED
@@ -1,18 +1,70 @@
1
1
  .pagination {
2
+ $size: 44px;
3
+ margin: 0;
4
+
5
+ @include media-breakpoint-down("lg") {
6
+ justify-content: center;
7
+ }
2
8
  .page-link {
9
+ border-radius: $border-radius-sm;
10
+ min-width: $size;
11
+ height: $size;
12
+ display: block;
13
+ text-align: center;
14
+
3
15
  &:has(.mtvh-icon) {
4
- --#{$prefix}pagination-padding-x: 8px;
16
+ --#{$prefix}pagination-padding-x: 12px;
5
17
  .mtvh-icon:before,
6
18
  .mtvh-icon:after {
7
19
  margin-right: 0;
8
20
  margin-left: 0;
9
21
  }
10
22
  }
23
+
24
+ &:active:not(:disabled):not(.disabled) {
25
+ color: var(--#{$prefix}blue-05);
26
+ background-color: var(--#{$prefix}grey-03);
27
+ }
11
28
  @include field-focus();
29
+ &:focus {
30
+ color: var(--#{$prefix}blue-05);
31
+ }
12
32
  }
13
33
 
14
34
  .page-item {
15
35
  margin-right: 4px;
16
36
  margin-bottom: 0;
37
+
38
+ &:last-child {
39
+ margin-right: 0;
40
+ }
41
+ &.active {
42
+ font-weight: $font-weight-bold;
43
+ }
44
+
45
+ &-ellipsis {
46
+ align-self: center;
47
+ text-align: center;
48
+ padding: var(--#{$prefix}pagination-padding-y);
49
+ min-width: $size;
50
+ height: $size;
51
+ }
52
+ }
53
+ }
54
+ .pagination-container {
55
+ text-align: center;
56
+ select.form-control {
57
+ width: $input-width-size-sm;
58
+ margin-left: $mtvh-spacing-3;
59
+ margin-right: $mtvh-spacing-3;
60
+ }
61
+ }
62
+
63
+ .pagination-select {
64
+ align-items: center;
65
+ display: flex;
66
+ @include media-breakpoint-down("lg") {
67
+ margin-top: $mtvh-spacing-7;
68
+ justify-content: center;
17
69
  }
18
70
  }
package/assets/scss/components/_space-selection.scss ADDED
@@ -0,0 +1,66 @@
1
+ fieldset.space-selection {
2
+ input {
3
+ @extend .btn-check;
4
+ }
5
+
6
+ input + label {
7
+ display: flex;
8
+ align-items: center;
9
+ padding: $mtvh-spacing-3 $mtvh-spacing-6;
10
+ border: 1px solid var(--mtvh-grey-06);
11
+ border-radius: 0.5rem;
12
+ background-color: var(--mtvh-grey-02);
13
+ width: 100%;
14
+ min-height: 4.3rem;
15
+ font-size: $font-size-sm;
16
+
17
+ .form-text {
18
+ margin: unset;
19
+ font-size: $font-size-xs;
20
+ color: var(--mtvh-grey-06);
21
+ }
22
+
23
+ div {
24
+ flex-direction: column;
25
+ }
26
+ }
27
+
28
+ input:checked + label {
29
+ background-color: $form-check-input-checked-bg-color;
30
+ color: $form-check-input-checked-color;
31
+
32
+ .form-text {
33
+ color: var(--mtvh-white);
34
+ }
35
+
36
+ .mtvh-icon {
37
+ color: var(--mtvh-white);
38
+ }
39
+ }
40
+
41
+ input:focus + label {
42
+ @include focus-style();
43
+ color: var(--mtvh-white);
44
+ }
45
+
46
+ .form-check {
47
+ padding-left: unset;
48
+ }
49
+
50
+ h2,
51
+ h3,
52
+ h4,
53
+ h5,
54
+ h6 {
55
+ font-size: $font-size-xs;
56
+ font-family: $font-family-sans-serif;
57
+ margin-bottom: $mtvh-spacing-3;
58
+ font-weight: $mtvh-font-weight-bold;
59
+ }
60
+
61
+ legend {
62
+ font-family: $font-family-sans-serif;
63
+ font-size: $font-size-md;
64
+ font-weight: $mtvh-font-weight-bold;
65
+ }
66
+ }
package/assets/scss/config/_icon-list.scss CHANGED
@@ -77,7 +77,13 @@ $icons: (
77
77
  "space-shared-facility":
78
78
  '<svg width="28" height="28" viewBox="0 0 28 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.85976 20.5C4.64684 20.5 4.45487 20.4145 4.28385 20.2436C4.11283 20.0727 4.02732 19.8609 4.02732 19.6083V18.3344H3.51425C2.68052 18.3344 1.96971 18.0407 1.38183 17.4532C0.793943 16.8659 0.5 16.1406 0.5 15.2771V8.78026C0.5 7.88854 0.809976 7.16667 1.42993 6.61465C2.04988 6.06263 2.74466 5.78662 3.51425 5.78662V3.55732C3.51425 2.69384 3.81001 1.96847 4.40153 1.38121C4.99284 0.793736 5.72321 0.5 6.59264 0.5H21.4074C22.2768 0.5 23.0072 0.793736 23.5985 1.38121C24.19 1.96847 24.4857 2.69384 24.4857 3.55732V5.78662C25.2767 5.78662 25.9768 6.06794 26.5861 6.63057C27.1954 7.19321 27.5 7.90977 27.5 8.78026V15.2771C27.5 16.1406 27.2061 16.8659 26.6182 17.4532C26.0303 18.0407 25.3195 18.3344 24.4857 18.3344H23.9727V19.6083C23.9727 19.8609 23.8975 20.0727 23.7473 20.2436C23.5972 20.4145 23.3948 20.5 23.1402 20.5C22.9271 20.5 22.7347 20.4145 22.563 20.2436C22.3912 20.0727 22.3052 19.8609 22.3052 19.6083V18.3344H5.75891V19.6083C5.75891 19.8631 5.67276 20.0754 5.50045 20.2452C5.32815 20.4151 5.11458 20.5 4.85976 20.5ZM3.51425 16.6147H24.4742C24.8453 16.6147 25.1538 16.4864 25.3996 16.2299C25.6455 15.9737 25.7684 15.6561 25.7684 15.2771V8.79013C25.7684 8.42261 25.6455 8.11677 25.3996 7.87261C25.1538 7.62845 24.8492 7.50637 24.4857 7.50637C24.1042 7.50637 23.7843 7.62845 23.5263 7.87261C23.2681 8.11677 23.139 8.41932 23.139 8.78026V13.5573H4.86105V8.78026C4.86105 8.41932 4.73203 8.11677 4.474 7.87261C4.21576 7.62845 3.89584 7.50637 3.51425 7.50637C3.15083 7.50637 2.8462 7.62845 2.60036 7.87261C2.35451 8.11677 2.23159 8.41932 2.23159 8.78026V15.2771C2.23159 15.6561 2.35451 15.9737 2.60036 16.2299C2.8462 16.4864 3.15083 16.6147 3.51425 16.6147ZM6.59264 11.8376H21.4074V8.78026C21.4074 8.29108 21.5249 7.8397 21.7601 7.42611C21.9953 7.01253 22.3266 6.68163 22.7542 6.43344V3.55732C22.7542 3.17834 22.625 2.86072 22.3668 2.60446C22.1088 2.34798 21.789 2.21975 21.4074 2.21975H6.59264C6.21105 2.21975 5.89113 2.34798 5.63289 2.60446C5.37486 2.86072 5.24584 3.17834 5.24584 3.55732V6.43344C5.6734 6.68163 6.00475 7.01253 6.23991 7.42611C6.47506 7.8397 6.59264 8.29108 6.59264 8.78026V11.8376Z" fill="black"/></svg>',
79
79
  "printer":
80
- '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"><path fill="#000" d="M5.928 19c-.532 0-.987-.19-1.365-.567a1.859 1.859 0 0 1-.568-1.364v-2.112H1.933c-.532 0-.987-.189-1.365-.567A1.859 1.859 0 0 1 0 13.026v-4.12c0-.824.286-1.52.857-2.086a2.846 2.846 0 0 1 2.081-.85h14.124c.825 0 1.52.283 2.087.85.567.566.851 1.262.851 2.086v4.12c0 .53-.19.986-.568 1.364a1.862 1.862 0 0 1-1.365.567h-2.062v2.112c0 .53-.19.986-.568 1.364a1.862 1.862 0 0 1-1.365.567H5.928Zm-3.995-5.974h2.062v-.078c0-.53.19-.985.568-1.364a1.862 1.862 0 0 1 1.365-.567h8.144c.532 0 .987.19 1.365.568.379.378.568.832.568 1.363v.078h2.062v-4.12a.97.97 0 0 0-.29-.716.978.978 0 0 0-.718-.289H2.94a.978.978 0 0 0-.718.289.97.97 0 0 0-.29.716v4.12Zm12.14-7.056V2.931H5.927V5.97H3.995V2.931c0-.53.19-.986.568-1.364A1.862 1.862 0 0 1 5.928 1h8.144c.532 0 .987.19 1.365.567.379.378.568.833.568 1.364V5.97h-1.933Zm1.984 4.416a.932.932 0 0 0 .683-.283.93.93 0 0 0 .283-.682.93.93 0 0 0-.283-.683.931.931 0 0 0-.683-.283.931.931 0 0 0-.683.283.93.93 0 0 0-.284.683.93.93 0 0 0 .284.682.932.932 0 0 0 .683.283Zm-1.985 6.683v-4.12H5.928v4.12h8.144Z"/></svg>'
80
+ '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"><path fill="#000" d="M5.928 19c-.532 0-.987-.19-1.365-.567a1.859 1.859 0 0 1-.568-1.364v-2.112H1.933c-.532 0-.987-.189-1.365-.567A1.859 1.859 0 0 1 0 13.026v-4.12c0-.824.286-1.52.857-2.086a2.846 2.846 0 0 1 2.081-.85h14.124c.825 0 1.52.283 2.087.85.567.566.851 1.262.851 2.086v4.12c0 .53-.19.986-.568 1.364a1.862 1.862 0 0 1-1.365.567h-2.062v2.112c0 .53-.19.986-.568 1.364a1.862 1.862 0 0 1-1.365.567H5.928Zm-3.995-5.974h2.062v-.078c0-.53.19-.985.568-1.364a1.862 1.862 0 0 1 1.365-.567h8.144c.532 0 .987.19 1.365.568.379.378.568.832.568 1.363v.078h2.062v-4.12a.97.97 0 0 0-.29-.716.978.978 0 0 0-.718-.289H2.94a.978.978 0 0 0-.718.289.97.97 0 0 0-.29.716v4.12Zm12.14-7.056V2.931H5.927V5.97H3.995V2.931c0-.53.19-.986.568-1.364A1.862 1.862 0 0 1 5.928 1h8.144c.532 0 .987.19 1.365.567.379.378.568.833.568 1.364V5.97h-1.933Zm1.984 4.416a.932.932 0 0 0 .683-.283.93.93 0 0 0 .283-.682.93.93 0 0 0-.283-.683.931.931 0 0 0-.683-.283.931.931 0 0 0-.683.283.93.93 0 0 0-.284.683.93.93 0 0 0 .284.682.932.932 0 0 0 .683.283Zm-1.985 6.683v-4.12H5.928v4.12h8.144Z"/></svg>',
81
+ "space-sub-block":
82
+ '<svg width="28" height="28" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.52481 12C1.24033 12 0.998404 11.8987 0.799042 11.6961C0.599681 11.4933 0.5 11.2474 0.5 10.9582V1.0416C0.5 0.752457 0.599681 0.506571 0.799042 0.303943C0.998404 0.101314 1.24033 0 1.52481 0H5.88428C6.16876 0 6.41069 0.101314 6.61005 0.303943C6.80941 0.506571 6.90909 0.752457 6.90909 1.0416V2.74286H12.4752C12.7597 2.74286 13.0016 2.84417 13.201 3.0468C13.4003 3.24943 13.5 3.49531 13.5 3.78446V10.9582C13.5 11.2474 13.4003 11.4933 13.201 11.6961C13.0016 11.8987 12.7597 12 12.4752 12H1.52481ZM1.51182 10.9714H5.89727V9.25714H1.51182V10.9714ZM1.51182 8.22857H5.89727V6.51429H1.51182V8.22857ZM1.51182 5.48571H5.89727V3.77143H1.51182V5.48571ZM1.51182 2.74286H5.89727V1.02857H1.51182V2.74286ZM6.90909 10.9714H12.4882V3.77143H6.90909V10.9714ZM8.89427 6.51429C8.75091 6.51429 8.63071 6.46497 8.53367 6.36634C8.43674 6.26771 8.38828 6.14548 8.38828 5.99966C8.38828 5.85394 8.43674 5.73183 8.53367 5.63331C8.63071 5.53491 8.75091 5.48571 8.89427 5.48571H10.3733C10.5167 5.48571 10.6368 5.53503 10.7337 5.63366C10.8308 5.73217 10.8793 5.85434 10.8793 6.00017C10.8793 6.146 10.8308 6.26811 10.7337 6.36651C10.6368 6.46503 10.5167 6.51429 10.3733 6.51429H8.89427ZM8.89427 9.25714C8.75091 9.25714 8.63071 9.20783 8.53367 9.1092C8.43674 9.01057 8.38828 8.88834 8.38828 8.74251C8.38828 8.5968 8.43674 8.47468 8.53367 8.37617C8.63071 8.27777 8.75091 8.22857 8.89427 8.22857H10.3733C10.5167 8.22857 10.6368 8.27788 10.7337 8.37651C10.8308 8.47503 10.8793 8.5972 10.8793 8.74303C10.8793 8.88886 10.8308 9.01097 10.7337 9.10937C10.6368 9.20789 10.5167 9.25714 10.3733 9.25714H8.89427Z" fill="#9A9A9A"/></svg>',
83
+ "cheveron-up":
84
+ '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 44 44"><path fill="#000" d="m22.01 18.23-8.413 9.46a.875.875 0 0 1-.621.31c-.244.014-.466-.088-.665-.308a1.11 1.11 0 0 1-.31-.723c-.009-.262.087-.512.285-.75l8.636-9.711c.17-.177.34-.309.513-.397.173-.088.364-.132.575-.132.21 0 .403.044.577.133.173.089.34.222.497.399l8.627 9.705c.188.211.285.456.289.732.005.277-.093.525-.291.744-.2.22-.415.33-.646.33-.231 0-.445-.11-.64-.331l-8.413-9.46Z"/></svg>',
85
+ "cheveron-down":
86
+ '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 44 44"><path fill="#000" d="m21.99 25.77 8.413-9.46a.875.875 0 0 1 .621-.31c.244-.014.466.088.665.308s.302.46.31.723c.009.262-.086.512-.285.75l-8.636 9.711c-.17.177-.34.309-.513.397a1.247 1.247 0 0 1-.575.132c-.21 0-.403-.044-.577-.133a1.73 1.73 0 0 1-.497-.399l-8.627-9.705a1.096 1.096 0 0 1-.289-.732 1.051 1.051 0 0 1 .291-.744c.2-.22.415-.33.646-.33.231 0 .445.11.64.331l8.413 9.46Z"/></svg>'
81
87
  );
82
88
 
83
89
  /**
@@ -383,227 +389,227 @@ $mtvh-icons: (
383
389
  height: $icon-size-scale-xl,
384
390
  svg-path: "#{$asset-icon-path}tick-list-with-cross.svg",
385
391
  ),
386
- 'call': (
392
+ "call": (
387
393
  width: $icon-size-scale-xl,
388
394
  height: $icon-size-scale-xl,
389
395
  svg-path: "#{$asset-icon-path}call.svg",
390
396
  ),
391
- 'phone-with-speech': (
397
+ "phone-with-speech": (
392
398
  width: $icon-size-scale-xl,
393
399
  height: $icon-size-scale-xl,
394
400
  svg-path: "#{$asset-icon-path}phone-with-speech.svg",
395
401
  ),
396
- 'ringing': (
402
+ "ringing": (
397
403
  width: $icon-size-scale-xl,
398
404
  height: $icon-size-scale-xl,
399
405
  svg-path: "#{$asset-icon-path}ringing.svg",
400
406
  ),
401
- 'location-pointer': (
407
+ "location-pointer": (
402
408
  width: $icon-size-scale-xl,
403
409
  height: $icon-size-scale-xl,
404
410
  svg-path: "#{$asset-icon-path}location-pointer.svg",
405
411
  ),
406
- 'signposts': (
412
+ "signposts": (
407
413
  width: $icon-size-scale-xl,
408
414
  height: $icon-size-scale-xl,
409
415
  svg-path: "#{$asset-icon-path}signposts.svg",
410
416
  ),
411
- 'map-with-pointer': (
417
+ "map-with-pointer": (
412
418
  width: $icon-size-scale-xl,
413
419
  height: $icon-size-scale-xl,
414
420
  svg-path: "#{$asset-icon-path}map-with-pointer.svg",
415
421
  ),
416
- 'checkmark': (
422
+ "checkmark": (
417
423
  width: $icon-size-scale-xl,
418
424
  height: $icon-size-scale-xl,
419
425
  svg-path: "#{$asset-icon-path}checkmark.svg",
420
426
  ),
421
- 'heart': (
427
+ "heart": (
422
428
  width: $icon-size-scale-xl,
423
429
  height: $icon-size-scale-xl,
424
430
  svg-path: "#{$asset-icon-path}heart.svg",
425
431
  ),
426
- 'star': (
432
+ "star": (
427
433
  width: $icon-size-scale-xl,
428
434
  height: $icon-size-scale-xl,
429
435
  svg-path: "#{$asset-icon-path}star.svg",
430
436
  ),
431
- 'clipboard': (
437
+ "clipboard": (
432
438
  width: $icon-size-scale-xl,
433
439
  height: $icon-size-scale-xl,
434
440
  svg-path: "#{$asset-icon-path}clipboard.svg",
435
441
  ),
436
- 'clipboard-alt': (
442
+ "clipboard-alt": (
437
443
  width: $icon-size-scale-xl,
438
444
  height: $icon-size-scale-xl,
439
445
  svg-path: "#{$asset-icon-path}clipboard-alt.svg",
440
446
  ),
441
- 'hanging-picture': (
447
+ "hanging-picture": (
442
448
  width: $icon-size-scale-xl,
443
449
  height: $icon-size-scale-xl,
444
450
  svg-path: "#{$asset-icon-path}hanging-picture.svg",
445
451
  ),
446
- 'envelop-closed': (
452
+ "envelop-closed": (
447
453
  width: $icon-size-scale-xl,
448
454
  height: $icon-size-scale-xl,
449
455
  svg-path: "#{$asset-icon-path}envelop-closed.svg",
450
456
  ),
451
- 'envelop-open': (
457
+ "envelop-open": (
452
458
  width: $icon-size-scale-xl,
453
459
  height: $icon-size-scale-xl,
454
460
  svg-path: "#{$asset-icon-path}envelop-open.svg",
455
461
  ),
456
- 'envelop-with-letter': (
462
+ "envelop-with-letter": (
457
463
  width: $icon-size-scale-xl,
458
464
  height: $icon-size-scale-xl,
459
465
  svg-path: "#{$asset-icon-path}envelop-with-letter.svg",
460
466
  ),
461
- 'pie-chart': (
467
+ "pie-chart": (
462
468
  width: $icon-size-scale-xl,
463
469
  height: $icon-size-scale-xl,
464
470
  svg-path: "#{$asset-icon-path}pie-chart.svg",
465
471
  ),
466
- 'frame': (
472
+ "frame": (
467
473
  width: $icon-size-scale-xl,
468
474
  height: $icon-size-scale-xl,
469
475
  svg-path: "#{$asset-icon-path}frame.svg",
470
476
  ),
471
- 'flower': (
477
+ "flower": (
472
478
  width: $icon-size-scale-xl,
473
479
  height: $icon-size-scale-xl,
474
480
  svg-path: "#{$asset-icon-path}flower.svg",
475
481
  ),
476
- 'chart-with-up-arrow': (
482
+ "chart-with-up-arrow": (
477
483
  width: $icon-size-scale-xl,
478
484
  height: $icon-size-scale-xl,
479
485
  svg-path: "#{$asset-icon-path}chart-with-up-arrow.svg",
480
486
  ),
481
- 'chart-with-down-arrow': (
487
+ "chart-with-down-arrow": (
482
488
  width: $icon-size-scale-xl,
483
489
  height: $icon-size-scale-xl,
484
490
  svg-path: "#{$asset-icon-path}chart-with-down-arrow.svg",
485
491
  ),
486
- 'tree': (
492
+ "tree": (
487
493
  width: $icon-size-scale-xl,
488
494
  height: $icon-size-scale-xl,
489
495
  svg-path: "#{$asset-icon-path}tree.svg",
490
496
  ),
491
- 'leaf': (
497
+ "leaf": (
492
498
  width: $icon-size-scale-xl,
493
499
  height: $icon-size-scale-xl,
494
500
  svg-path: "#{$asset-icon-path}leaf.svg",
495
501
  ),
496
- 'cup': (
502
+ "cup": (
497
503
  width: $icon-size-scale-xl,
498
504
  height: $icon-size-scale-xl,
499
505
  svg-path: "#{$asset-icon-path}cup.svg",
500
506
  ),
501
- 'jigsaw': (
507
+ "jigsaw": (
502
508
  width: $icon-size-scale-xl,
503
509
  height: $icon-size-scale-xl,
504
510
  svg-path: "#{$asset-icon-path}jigsaw.svg",
505
511
  ),
506
- 'hourglass': (
512
+ "hourglass": (
507
513
  width: $icon-size-scale-xl,
508
514
  height: $icon-size-scale-xl,
509
515
  svg-path: "#{$asset-icon-path}hourglass.svg",
510
516
  ),
511
- 'recycle': (
517
+ "recycle": (
512
518
  width: $icon-size-scale-xl,
513
519
  height: $icon-size-scale-xl,
514
520
  svg-path: "#{$asset-icon-path}recycle.svg",
515
521
  ),
516
- 'shield': (
522
+ "shield": (
517
523
  width: $icon-size-scale-xl,
518
524
  height: $icon-size-scale-xl,
519
525
  svg-path: "#{$asset-icon-path}shield.svg",
520
526
  ),
521
- 'presentation-board': (
527
+ "presentation-board": (
522
528
  width: $icon-size-scale-xl,
523
529
  height: $icon-size-scale-xl,
524
530
  svg-path: "#{$asset-icon-path}presentation-board.svg",
525
531
  ),
526
- 'printer-colour': (
532
+ "printer-colour": (
527
533
  width: $icon-size-scale-xl,
528
534
  height: $icon-size-scale-xl,
529
535
  svg-path: "#{$asset-icon-path}printer.svg",
530
536
  ),
531
- 'padlock': (
537
+ "padlock": (
532
538
  width: $icon-size-scale-xl,
533
539
  height: $icon-size-scale-xl,
534
540
  svg-path: "#{$asset-icon-path}padlock.svg",
535
541
  ),
536
- 'house': (
542
+ "house": (
537
543
  width: $icon-size-scale-xl,
538
544
  height: $icon-size-scale-xl,
539
545
  svg-path: "#{$asset-icon-path}house.svg",
540
546
  ),
541
- 'keys': (
547
+ "keys": (
542
548
  width: $icon-size-scale-xl,
543
549
  height: $icon-size-scale-xl,
544
550
  svg-path: "#{$asset-icon-path}keys.svg",
545
551
  ),
546
- 'shield-with-tick': (
552
+ "shield-with-tick": (
547
553
  width: $icon-size-scale-xl,
548
554
  height: $icon-size-scale-xl,
549
555
  svg-path: "#{$asset-icon-path}shield-with-tick.svg",
550
556
  ),
551
- 'wallet-with-notes': (
557
+ "wallet-with-notes": (
552
558
  width: $icon-size-scale-xl,
553
559
  height: $icon-size-scale-xl,
554
560
  svg-path: "#{$asset-icon-path}wallet-with-notes.svg",
555
561
  ),
556
- 'page': (
562
+ "page": (
557
563
  width: $icon-size-scale-xl,
558
564
  height: $icon-size-scale-xl,
559
565
  svg-path: "#{$asset-icon-path}page.svg",
560
566
  ),
561
- 'box-open': (
567
+ "box-open": (
562
568
  width: $icon-size-scale-xl,
563
569
  height: $icon-size-scale-xl,
564
570
  svg-path: "#{$asset-icon-path}box-open.svg",
565
571
  ),
566
- 'alarm-clock': (
572
+ "alarm-clock": (
567
573
  width: $icon-size-scale-xl,
568
574
  height: $icon-size-scale-xl,
569
575
  svg-path: "#{$asset-icon-path}alarm-clock.svg",
570
576
  ),
571
- 'calculator': (
577
+ "calculator": (
572
578
  width: $icon-size-scale-xl,
573
579
  height: $icon-size-scale-xl,
574
580
  svg-path: "#{$asset-icon-path}calculator.svg",
575
581
  ),
576
- 'cog-purple': (
582
+ "cog-purple": (
577
583
  width: $icon-size-scale-xl,
578
584
  height: $icon-size-scale-xl,
579
585
  svg-path: "#{$asset-icon-path}cog-purple.svg",
580
586
  ),
581
- 'stopwatch': (
587
+ "stopwatch": (
582
588
  width: $icon-size-scale-xl,
583
589
  height: $icon-size-scale-xl,
584
590
  svg-path: "#{$asset-icon-path}stopwatch.svg",
585
591
  ),
586
- 'bell': (
592
+ "bell": (
587
593
  width: $icon-size-scale-xl,
588
594
  height: $icon-size-scale-xl,
589
595
  svg-path: "#{$asset-icon-path}bell.svg",
590
596
  ),
591
- 'clock': (
597
+ "clock": (
592
598
  width: $icon-size-scale-xl,
593
599
  height: $icon-size-scale-xl,
594
600
  svg-path: "#{$asset-icon-path}clock.svg",
595
601
  ),
596
- 'speech-bubbles': (
602
+ "speech-bubbles": (
597
603
  width: $icon-size-scale-xl,
598
604
  height: $icon-size-scale-xl,
599
605
  svg-path: "#{$asset-icon-path}speech-bubbles.svg",
600
606
  ),
601
- 'calendar': (
607
+ "calendar": (
602
608
  width: $icon-size-scale-xl,
603
609
  height: $icon-size-scale-xl,
604
610
  svg-path: "#{$asset-icon-path}calendar.svg",
605
611
  ),
606
- 'line-graph': (
612
+ "line-graph": (
607
613
  width: $icon-size-scale-xl,
608
614
  height: $icon-size-scale-xl,
609
615
  svg-path: "#{$asset-icon-path}line-graph.svg",
@@ -673,6 +679,14 @@ $mtvh-icons: (
673
679
  height: $icon-size-scale-lg,
674
680
  svg-path: "#{$asset-icon-path}mastercard.svg",
675
681
  ),
682
+ "cheveron-up": (
683
+ width: $icon-size-scale-lg,
684
+ height: $icon-size-scale-lg
685
+ ),
686
+ "cheveron-down": (
687
+ width: $icon-size-scale-lg,
688
+ height: $icon-size-scale-lg
689
+ ),
676
690
  "space-building": (
677
691
  width: $icon-size-scale-md,
678
692
  height: $icon-size-scale-md,
@@ -697,4 +711,8 @@ $mtvh-icons: (
697
711
  width: $icon-size-scale-md,
698
712
  height: $icon-size-scale-md,
699
713
  ),
714
+ "space-sub-block": (
715
+ width: $icon-size-scale-md,
716
+ height: $icon-size-scale-md,
717
+ ),
700
718
  );
package/assets/scss/config/_palette.scss CHANGED
@@ -46,4 +46,5 @@
46
46
 
47
47
  --mtvh-stone-01: #f9f5f0;
48
48
  --mtvh-stone-02: #f9f2ea;
49
+ --mtvh-stone-03: #dbaa79;
49
50
  }