@colijnit/transaction 255.1.11 → 255.1.12

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 (27) hide show
  1. package/bundles/colijnit-transaction.umd.js +8 -6
  2. package/bundles/colijnit-transaction.umd.js.map +1 -1
  3. package/colijnit-transaction.metadata.json +1 -1
  4. package/esm2015/lib/component/transaction-header/transaction-header-delivery/transaction-header-delivery.component.js +13 -18
  5. package/esm2015/lib/component/transaction-header/transaction-header-order/transaction-header-order.component.js +4 -13
  6. package/esm2015/lib/component/transaction-header/transaction-header-payment/transaction-header-payment.component.js +3 -14
  7. package/esm2015/lib/component/transaction-header/transaction-header-relation/transaction-header-relation.component.js +3 -6
  8. package/esm2015/lib/enum/icon.enum.js +2 -1
  9. package/esm2015/lib/model/icon-svg.js +2 -1
  10. package/esm2015/lib/transaction-version.js +3 -3
  11. package/fesm2015/colijnit-transaction.js +23 -49
  12. package/fesm2015/colijnit-transaction.js.map +1 -1
  13. package/lib/component/core/base/components/transaction-header-block/style/_material-definition.scss +1 -1
  14. package/lib/component/transaction-header/transaction-header/style/_layout.scss +1 -0
  15. package/lib/component/transaction-header/transaction-header-delivery/style/_layout.scss +4 -0
  16. package/lib/component/transaction-header/transaction-header-delivery/style/_material-definition.scss +7 -7
  17. package/lib/component/transaction-header/transaction-header-order/style/_layout.scss +7 -2
  18. package/lib/component/transaction-header/transaction-header-order/style/_material-definition.scss +4 -4
  19. package/lib/component/transaction-header/transaction-header-payment/style/_layout.scss +6 -1
  20. package/lib/component/transaction-header/transaction-header-payment/style/_material-definition.scss +3 -3
  21. package/lib/component/transaction-header/transaction-header-popup/style/_material-definition.scss +5 -5
  22. package/lib/component/transaction-header/transaction-header-relation/style/_layout.scss +2 -0
  23. package/lib/component/transaction-header-fields/transaction-header-deliverydate-definitive-button/style/_layout.scss +1 -0
  24. package/lib/component/transaction-header-fields/transaction-header-deliverydate-definitive-button/style/_material-definition.scss +2 -2
  25. package/lib/component/transaction-internal/style/_material-definition.scss +1 -1
  26. package/lib/enum/icon.enum.d.ts +1 -0
  27. package/package.json +1 -1
@@ -11,7 +11,7 @@ $tp-transaction-header-block-content-divider-background: $tp-color-border !defau
11
11
  $tp-transaction-header-block-content-column-gap: 10px !default;
12
12
  $tp-transaction-header-block-content-row-gap: 10px !default;
13
13
 
14
- $tp-transaction-header-block-width: 200px !default;
14
+ $tp-transaction-header-block-width: auto !default;
15
15
  $tp-transaction-header-block-margin: 0 !default;
16
16
  $tp-transaction-header-block-padding: 4px 15px !default;
17
17
  $tp-transaction-header-block-border: none !default;
@@ -32,6 +32,7 @@
32
32
  > * {
33
33
  max-height: $tp-co-transaction-header-not-expanded-height;
34
34
  transition: .25s ease-in-out;
35
+ flex: 1;
35
36
  }
36
37
  }
37
38
  }
@@ -3,6 +3,7 @@
3
3
  @include export-module('co-transaction-header-delivery-layout') {
4
4
  .co-transaction-header-delivery {
5
5
  display: flex;
6
+ justify-content: flex-end;
6
7
  .co-carousel-3d {
7
8
  max-width: 100%;
8
9
  height: 175px;
@@ -53,6 +54,9 @@
53
54
  column-gap: 10px;
54
55
  align-items: center;
55
56
  }
57
+ .transaction-header-block-content {
58
+ cursor: pointer;
59
+ }
56
60
  .header-delivery-deliverydate {
57
61
  .co-input-date {
58
62
  height: $tp-transaction-header-delivery-date-input-field-height;
@@ -1,13 +1,13 @@
1
1
  $tp-transaction-header-delivery-button-width: 17px !default;
2
- $tp-transaction-header-delivery-planning-request-button-size: $tp-default-button-height !default;
3
- $tp-transaction-header-delivery-planning-request-button-icon-size: 16px;
2
+ $tp-transaction-header-delivery-planning-request-button-size: 34px !default;
3
+ $tp-transaction-header-delivery-planning-request-button-icon-size: 20px;
4
4
  $tp-transaction-header-delivery-planning-request-button-color: $tp-color-active !default;
5
5
  $tp-transaction-header-delivery-planning-request-button-border: 1px solid !default;
6
- $tp-transaction-header-delivery-planning-request-button-border-width: 1px !default;
6
+ $tp-transaction-header-delivery-planning-request-button-border-width: 0 !default;
7
7
  $tp-transaction-header-delivery-planning-request-button-border-style: solid !default;
8
8
  $tp-transaction-header-delivery-planning-request-button-border-color: $tp-color-border !default;
9
9
  $tp-transaction-header-delivery-planning-request-button-border-radius: $tp-default-border-radius !default;
10
- $tp-transaction-header-delivery-planning-request-button-background: #fff !default;
10
+ $tp-transaction-header-delivery-planning-request-button-background: #f5f5fc !default;
11
11
  $tp-transaction-header-delivery-planning-request-button-padding: 5px !default;
12
12
  $tp-transaction-header-delivery-planning-request-button-check-height: 8px !default;
13
13
  $tp-transaction-header-delivery-planning-request-button-check-width: 4px !default;
@@ -17,11 +17,11 @@ $tp-transaction-header-delivery-planning-request-button-check-border-right: 4px
17
17
  $tp-transaction-header-delivery-planning-request-button-check-border-top: 1px !default;
18
18
  $tp-transaction-header-delivery-definitive-button-color: $tp-color-active-light !default;
19
19
  $tp-transaction-header-delivery-delivery-method-font-size: $tp-font-size !default;
20
- $tp-transaction-header-delivery-delivery-method-background-color: $tp-default-background !default;
21
- $tp-transaction-header-delivery-delivery-method-height: 30px !default;
20
+ $tp-transaction-header-delivery-delivery-method-background-color: #f5f5fc !default;
21
+ $tp-transaction-header-delivery-delivery-method-height: 34px !default;
22
22
  $tp-transaction-header-delivery-delivery-method-min-width: 130px !default;
23
23
  $tp-transaction-header-delivery-delivery-method-border: 1px solid !default;
24
- $tp-transaction-header-delivery-delivery-method-border-color: $tp-color-border !default;
24
+ $tp-transaction-header-delivery-delivery-method-border-color: transparent !default;
25
25
  $tp-transaction-header-delivery-delivery-method-border-radius: $tp-default-border-radius !default;
26
26
  $tp-transaction-header-delivery-delivery-truck-color: $tp-color-font !default;
27
27
  $tp-transaction-header-delivery-delivery-method-padding: 5px 10px !default;
@@ -3,6 +3,7 @@
3
3
  @include export-module('co-transaction-header-order-layout') {
4
4
  .co-transaction-header-order {
5
5
  display: flex;
6
+ justify-content: flex-end;
6
7
  .transaction-header-order-dialog {
7
8
  .co-transaction-header-block {
8
9
  padding: 4px 0;
@@ -34,12 +35,13 @@
34
35
  display: flex;
35
36
  column-gap: $tp-transaction-header-order-discount-column-gap;
36
37
  align-items: center;
37
- justify-content: space-between;
38
+ justify-content: center;
38
39
  font-size: $tp-transaction-header-order-discount-font-size;
39
40
  border-style: $tp-transaction-header-order-discount-border-style;
40
41
  border-width: $tp-transaction-header-order-discount-border-width;
41
42
  border-radius: $tp-transaction-header-order-discount-border-radius;
42
43
  padding: $tp-transaction-header-order-discount-padding;
44
+ background: #f5f5fc;
43
45
  height: 100%;
44
46
  .header-discount-icon {
45
47
  width: $tp-transaction-header-order-discount-icon-size;
@@ -57,7 +59,10 @@
57
59
  flex-direction: column;
58
60
  align-items: center;
59
61
  }
60
-
62
+ .transaction-header-block-content {
63
+ justify-content: flex-start;
64
+ cursor: pointer;
65
+ }
61
66
  .transaction-header-order-definitive {
62
67
  .co-input-checkbox {
63
68
  font-size: $tp-font-size;
@@ -5,15 +5,15 @@ $tp-transaction-header-order-discount-font-size: $tp-font-size !default;
5
5
  $tp-transaction-header-order-discount-font-weight: 600 !default;
6
6
  $tp-transaction-header-order-discount-font-color: $tp-color-discount-value !default;
7
7
  $tp-transaction-header-order-discount-background-color: $tp-default-background !default;
8
- $tp-transaction-header-order-discount-width: 100% !default;
9
- $tp-transaction-header-order-discount-height: $tp-default-button-height !default;
8
+ $tp-transaction-header-order-discount-width: 34px !default;
9
+ $tp-transaction-header-order-discount-height: 34px !default;
10
10
  $tp-transaction-header-order-discount-border-style: solid !default;
11
- $tp-transaction-header-order-discount-border-width: 1px !default;
11
+ $tp-transaction-header-order-discount-border-width: 0px !default;
12
12
  $tp-transaction-header-order-discount-border-color: $tp-color-border !default;
13
13
  $tp-transaction-header-order-discount-border-radius: $tp-default-border-radius !default;
14
14
  $tp-transaction-header-order-discount-padding: 0px 10px !default;
15
15
  $tp-transaction-header-order-discount-icon-color: $tp-color-font !default;
16
- $tp-transaction-header-order-discount-icon-size: 16px !default;
16
+ $tp-transaction-header-order-discount-icon-size: 20px !default;
17
17
  $tp-transaction-header-order-discount-column-gap: 8px !default;
18
18
  $tp-transaction-header-order-default-row-gap: $tp-default-row-gap !default;
19
19
  $tp-transaction-header-order-default-column-gap: $tp-default-column-gap !default;
@@ -27,6 +27,9 @@
27
27
  }
28
28
  }
29
29
  }
30
+ .transaction-header-block-content {
31
+ cursor: pointer;
32
+ }
30
33
  .transaction-header-deposit {
31
34
  .co-input-text {
32
35
  height: auto;
@@ -69,7 +72,7 @@
69
72
  display: flex;
70
73
  align-items: center;
71
74
  gap: $tp-co-transaction-header-payment-button-wrapper-gap;
72
- justify-content: space-between;
75
+ justify-content: center;
73
76
  border-style: solid;
74
77
  border-width: $tp-co-transaction-header-payment-button-wrapper-border-width;
75
78
  border-radius: $tp-co-transaction-header-payment-button-wrapper-border-radius;
@@ -77,6 +80,8 @@
77
80
  border-color: $tp-co-transaction-header-payment-button-wrapper-border-color;
78
81
  background: $tp-co-transaction-header-payment-button-wrapper-background;
79
82
  cursor: pointer;
83
+ width: $tp-co-transaction-header-payment-button-wrapper-height;
84
+ background: #f5f5fc;
80
85
  height: $tp-co-transaction-header-payment-button-wrapper-height;
81
86
  .header-order-icon {
82
87
  width: $tp-co-transaction-header-payment-button-wrapper-icon-size;
@@ -8,10 +8,10 @@ $tp-co-transaction-header-downpayment-amount-weight: bold !default;
8
8
 
9
9
  $tp-co-transaction-header-payment-button-wrapper-gap: 8px !default;
10
10
  $tp-co-transaction-header-payment-button-wrapper-padding: 0px 10px !default;
11
- $tp-co-transaction-header-payment-button-wrapper-height: 30px !default;
12
- $tp-co-transaction-header-payment-button-wrapper-border-width: 1px !default;
11
+ $tp-co-transaction-header-payment-button-wrapper-height: 34px !default;
12
+ $tp-co-transaction-header-payment-button-wrapper-border-width: 0 !default;
13
13
  $tp-co-transaction-header-payment-button-wrapper-border-color: $tp-color-light-accent !default;
14
14
  $tp-co-transaction-header-payment-button-wrapper-border-radius: 5px !default;
15
15
  $tp-co-transaction-header-payment-button-wrapper-background: $tp-color-light !default;
16
- $tp-co-transaction-header-payment-button-wrapper-icon-size: 16px !default;
16
+ $tp-co-transaction-header-payment-button-wrapper-icon-size: 20px !default;
17
17
 
@@ -75,9 +75,9 @@ $tp-transaction-header-popup-business-rule-applied-icon-color: red !default;
75
75
  $tp-transaction-header-popup-business-rule-applied-font-size: $tp-font-size !default;
76
76
  $tp-transaction-header-popup-business-rule-applied-font-weight: normal !default;
77
77
 
78
- $tp-co-transaction-header-relation-content-gap: 10px !default;
79
- $tp-co-transaction-header-relation-content-padding: 0 0 0 48px !default;
80
- $tp-co-transaction-header-relation-content-empty: -48px !default;
78
+ $tp-co-transaction-header-relation-content-gap: 30px !default;
79
+ $tp-co-transaction-header-relation-content-padding: 0 0 0 0 !default;
80
+ $tp-co-transaction-header-relation-content-empty: 0 !default;
81
81
  $tp-co-transaction-header-relation-content-padding-empty: 0 !default;
82
82
  $tp-co-transaction-header-relation-content-icon-left: 0 !default;
83
83
  $tp-co-transaction-header-relation-content-icon-top: 0 !default;
@@ -85,8 +85,8 @@ $tp-co-transaction-header-relation-content-icon-avatar-size: 38px !default;
85
85
  $tp-co-transaction-header-relation-content-icon-avatar-background: $tp-default-background-accent !default;
86
86
  $tp-co-transaction-header-relation-content-icon-avatar-text-color: $tp-color-font !default;
87
87
  $tp-co-transaction-header-relation-content-line-height: 16px !default;
88
- $tp-co-transaction-header-relation-content-margin: 4px 0 0 0 !default;
89
- $tp-co-transaction-header-relation-label-margin: 4px 0 0 0 !default;
88
+ $tp-co-transaction-header-relation-content-margin: 2px 0 0 0 !default;
89
+ $tp-co-transaction-header-relation-label-margin: 0 0 0 0 !default;
90
90
  $tp-co-transaction-header-relation-content-max-width: 120px !default;
91
91
  $tp-co-transaction-header-relation-content-name-margin: 0 0 10px 0 !default;
92
92
  $tp-co-transaction-header-relation-content-email-margin: 0 0 10px 0 !default;
@@ -3,6 +3,7 @@
3
3
  @include export-module('co-transaction-header-relation-layout') {
4
4
  .co-transaction-header-relation {
5
5
  display: flex;
6
+ cursor: pointer;
6
7
  .transaction-header-relation-dialog {
7
8
  .co-transaction-header-block {
8
9
  padding: 4px 0;
@@ -77,6 +78,7 @@
77
78
  gap: $tp-co-transaction-header-relation-content-gap;
78
79
  padding: $tp-co-transaction-header-relation-content-padding;
79
80
  position: relative;
81
+ cursor: pointer;
80
82
  }
81
83
  .no-relation-yet {
82
84
  position: relative;
@@ -10,6 +10,7 @@
10
10
  display: flex;
11
11
  align-items: center;
12
12
  justify-content: center;
13
+ background: #f5f5fc;
13
14
  co-icon {
14
15
  height: $tp-transaction-header-deliverydate-definitive-button-icon-size;
15
16
  width: $tp-transaction-header-deliverydate-definitive-button-icon-size;
@@ -1,7 +1,7 @@
1
- $tp-transaction-header-deliverydate-definitive-button-size: 30px !default;
1
+ $tp-transaction-header-deliverydate-definitive-button-size: 34px !default;
2
2
  $tp-transaction-header-deliverydate-definitive-button-padding: 0 !default;
3
3
  $tp-transaction-header-deliverydate-definitive-button-border-style: solid !default;
4
- $tp-transaction-header-deliverydate-definitive-button-border-width: 1px !default;
4
+ $tp-transaction-header-deliverydate-definitive-button-border-width: 0 !default;
5
5
  $tp-transaction-header-deliverydate-definitive-button-border-color: $tp-color-border !default;
6
6
  $tp-transaction-header-deliverydate-definitive-button-border-radius: 5px !default;
7
7
  $tp-transaction-header-deliverydate-definitive-button-icon-size: 16px !default;
@@ -3,5 +3,5 @@ $tp-transaction-totals-margin: 15px 0 !default;
3
3
  $tp-transaction-padding: 25px !default;
4
4
  $tp-transaction-padding: 20px !default;
5
5
  $tp-transaction-transaction-lines-header-padding: 0 0 15px 0 !default;
6
- $tp-transaction-transaction-lines-header-column-gap: 20px !default;
6
+ $tp-transaction-transaction-lines-header-column-gap: 10px !default;
7
7
  $tp-transaction-transaction-lines-wrapper-padding: 0 !default;
@@ -93,6 +93,7 @@ export declare enum Icon {
93
93
  RegularBoxOpenCircleCheck = "regular_box_open_circle_check",
94
94
  RegularCartFlatbedBoxesCircleCheck = "regular_cart_flatbed_boxes_circle_check",
95
95
  RegularCartShoppingCircleQuestion = "regular_cart_shopping_circle_question",
96
+ RegularEuroSignMinus = "regular_euro_sign_minus",
96
97
  RegularIndustryClock = "regular_industry_clock",
97
98
  RegularIndustryTag = "regular_industry_tag",
98
99
  RegularReceiptSlash = "regular_receipt_slash",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@colijnit/transaction",
3
- "version": "255.1.11",
3
+ "version": "255.1.12",
4
4
  "description": "Colijn IT transaction module for Angular 12",
5
5
  "repository": "npm/npm",
6
6
  "author": "Colijn IT",