@colijnit/transaction 12.1.26 → 12.1.28

package/lib/component/{relation-address → relation/relation-address}/relation-address.component.d.ts

@@ -1,26 +1,26 @@
 import { EventEmitter, OnInit } from "@angular/core";
 import { Address } from "@colijnit/transactionapi/build/model/address.bo";
 import { Country } from "@colijnit/transactionapi/build/model/country.bo";
-import { TransactionConnectorService } from "../../service/transaction-connector.service";
-import { DictionaryService } from "../../service/dictionary.service";
+import { TransactionConnectorService } from "../../../service/transaction-connector.service";
+import { DictionaryService } from "../../../service/dictionary.service";
 import { FormMasterService } from "@colijnit/corecomponents_v12";
-export declare class RelationAddressComponent implements OnInit {
+import { RelationBaseComponent } from "../relation-base.component";
+export declare class RelationAddressComponent extends RelationBaseComponent implements OnInit {
     private _dictionary;
     private _connector;
     private _formMasterService;
-    label: string;
     address: Address;
+    label: string;
     showButtons: boolean;
     saveClick: EventEmitter<Address>;
     cancelClick: EventEmitter<void>;
     showClass(): boolean;
     countries: Country[];
     fields: Object;
-    constructor(_dictionary: DictionaryService, _connector: TransactionConnectorService, _formMasterService: FormMasterService);
     postalCodeCheckErrorMessage: string;
     private _prevPostalCodeForCheck;
     private _prevHouseNoForCheck;
-    private _address;
+    constructor(_dictionary: DictionaryService, _connector: TransactionConnectorService, _formMasterService: FormMasterService);
     ngOnInit(): Promise<void>;
     submitForm(): void;
     checkForPostalCodeCheckError(): Promise<void>;

package/lib/component/{relation-address → relation/relation-address}/style/_layout.scss

@@ -1,5 +1,3 @@
-@import "../../../style/mixin";
-
 @include export-module('co-relation-address-layout') {
   .co-relation-address {
     font-family: $tp-relation-address-font-family;

package/lib/component/{relation-address → relation/relation-address}/style/_theme.scss

@@ -1,6 +1,3 @@
-@import "../../../style/mixin";
-@import "./material-definition";
-
 @include export-module('co-relation-address-theme') {
   .co-relation-address {
   }

package/lib/component/relation/relation-address/style/material.scss

@@ -0,0 +1,5 @@
+@import "../../../../style/mixin";
+@import "./material-definition";
+@import "./layout";
+@import "./theme";
+@import "~@colijnit/corecomponents_v12/lib/components/input-combo-box/style/material.scss";

package/lib/component/{relation-address-select → relation/relation-address-select}/relation-address-select.component.d.ts

@@ -1,9 +1,10 @@
 import { ElementRef, EventEmitter } from "@angular/core";
 import { Address } from "@colijnit/transactionapi/build/model/address.bo";
-import { Icon } from "../../enum/icon.enum";
+import { Icon } from "../../../enum/icon.enum";
 import { FormMasterService } from "@colijnit/corecomponents_v12";
-import { BusinessObjectFactory } from "../../factory/business-object-factory";
-export declare class RelationAddressSelectComponent {
+import { BusinessObjectFactory } from "../../../factory/business-object-factory";
+import { RelationBaseComponent } from "../relation-base.component";
+export declare class RelationAddressSelectComponent extends RelationBaseComponent {
     private _formMasterService;
     private _boFactory;
     readonly icons: typeof Icon;

package/lib/component/{relation-address-select → relation/relation-address-select}/style/_layout.scss

@@ -1,5 +1,3 @@
-@import "../../../style/mixin";
-
 @include export-module('co-relation-address-select-layout') {
   .co-relation-address-select {
     .relation-address-content {

package/lib/component/{relation-address-select → relation/relation-address-select}/style/_theme.scss

@@ -1,5 +1,3 @@
-@import "../../../style/mixin";
-
 @include export-module('co-relation-address-select-theme') {
   .co-relation-address-select {
   }

package/lib/component/{relation-address-select → relation/relation-address-select}/style/material.scss

@@ -1,3 +1,4 @@
+@import "../../../../style/mixin";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/{relation-address-tile → relation/relation-address-tile}/relation-address-tile.component.d.ts

@@ -1,6 +1,6 @@
 import { EventEmitter } from "@angular/core";
 import { Address } from "@colijnit/transactionapi/build/model/address.bo";
-import { Icon } from "../../enum/icon.enum";
+import { Icon } from "../../../enum/icon.enum";
 export declare class RelationAddressTileComponent {
     readonly icons: typeof Icon;
     showClass(): boolean;

package/lib/component/{relation-address-tile → relation/relation-address-tile}/style/_layout.scss

@@ -1,5 +1,3 @@
-@import "../../../style/mixin";
-
 @include export-module('co-relation-address-tile-layout') {
   .co-relation-address-tile {
     display: flex;

package/lib/component/{relation-address-tile → relation/relation-address-tile}/style/_theme.scss

@@ -1,5 +1,3 @@
-@import "../../../style/mixin";
-
 @include export-module('co-relation-address-tile-theme') {
   .co-relation-address-tile {
     .relation-address-create, .relation-address-change {

package/lib/component/relation/relation-address-tile/style/material.scss

@@ -0,0 +1,5 @@
+@import "../../../../style/mixin";
+@import "./material-definition";
+@import "./layout";
+@import "./theme";
+@import "../../../tile/style/material";

package/lib/component/relation/relation-addresses/relation-addresses.component.d.ts

@@ -0,0 +1,23 @@
+import { EventEmitter } from "@angular/core";
+import { Address } from "@colijnit/transactionapi/build/model/address.bo";
+import { Icon } from "../../../enum/icon.enum";
+import { AddressType } from "@colijnit/transactionapi/build/enum/address-type.enum";
+import { BusinessObjectFactory } from "../../../factory/business-object-factory";
+import { RelationBaseComponent } from "../relation-base.component";
+export declare class RelationAddressesComponent extends RelationBaseComponent {
+    private _boFactory;
+    readonly icons: typeof Icon;
+    addresses: Address[];
+    type: AddressType;
+    selectedAddressIdx: number;
+    selectedAddressChange: EventEmitter<number>;
+    selectedAddressNawNrChange: EventEmitter<number>;
+    showClass(): boolean;
+    showEditAddressDialog: boolean;
+    addressToEdit: Address;
+    constructor(_boFactory: BusinessObjectFactory);
+    saveAddress(address: Address): void;
+    showNewAddressDialog(): void;
+    setIndexAddress(idx: number): void;
+    editAddress(addr: Address): void;
+}

package/lib/component/relation/relation-addresses/relation-addresses.module.d.ts

@@ -0,0 +1,2 @@
+export declare class RelationAddressesModule {
+}

package/lib/component/relation/relation-addresses/style/_layout.scss

@@ -0,0 +1,19 @@
+@include export-module('cc-relation-addresses-layout') {
+  .co-relation-addresses {
+    .co-carousel-3d {
+      max-width: $tp-relation-addresses-carousel-max-width;
+      height: 175px;
+    }
+    .relation-address-new {
+      cursor: pointer;
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      font-weight: bold;
+      .relation-address-icon {
+        height: 20px;
+        width: 20px;
+      }
+    }
+  }
+}

package/lib/component/relation/relation-addresses/style/_material-definition.scss

@@ -0,0 +1 @@
+$tp-relation-addresses-carousel-max-width: 500px !default;

package/lib/component/relation/relation-addresses/style/_theme.scss

@@ -0,0 +1,4 @@
+@include export-module('cc-relation-addresses-theme') {
+  .co-relation-addresses {
+  }
+}

package/lib/component/relation/relation-addresses/style/material.scss

@@ -0,0 +1,4 @@
+@import "../../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";

package/lib/component/relation/relation-base.component.d.ts

@@ -0,0 +1,11 @@
+import { EventEmitter } from "@angular/core";
+import { RelationAnyType } from "@colijnit/transactionapi/build/model/relation-any-type";
+import { CustomerFullObject } from "@colijnit/transactionapi/build/model/customer-full-object.bo";
+export declare abstract class RelationBaseComponent {
+    set relation(value: RelationAnyType);
+    get relation(): RelationAnyType;
+    relationChange: EventEmitter<RelationAnyType>;
+    get relationAsCustomer(): CustomerFullObject;
+    private _relation;
+    protected relationSet(): void;
+}

package/lib/component/relation/relation-contact-details/relation-contact-details.component.d.ts

@@ -0,0 +1,11 @@
+import { RelationBaseComponent } from "../relation-base.component";
+import { ContactOption } from "@colijnit/transactionapi/build/model/contact-option.bo";
+export declare class RelationContactDetailsComponent extends RelationBaseComponent {
+    showClass(): boolean;
+    emailAddress: ContactOption;
+    phoneNumber: ContactOption;
+    inviteToAccount: boolean;
+    preparePrimaryEmail(): void;
+    preparePrimaryPhone(): void;
+    protected relationSet(): void;
+}

package/lib/component/relation/relation-contact-details/relation-contact-details.module.d.ts

@@ -0,0 +1,2 @@
+export declare class RelationContactDetailsModule {
+}

package/lib/component/relation/relation-contact-details/style/_layout.scss

@@ -0,0 +1,6 @@
+@import "../../../style/mixin";
+
+@include export-module('cc-relation-contact-details-layout') {
+  .co-relation-contact-details {
+  }
+}

package/lib/component/relation/relation-contact-details/style/_theme.scss

@@ -0,0 +1,6 @@
+@import "../../../style/mixin";
+
+@include export-module('cc-relation-contact-details-theme') {
+  .co-relation-contact-details {
+  }
+}

package/lib/component/relation/relation-contact-details/style/material.scss

@@ -0,0 +1,4 @@
+@import "../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";

package/lib/component/relation/relation-general/relation-general.component.d.ts

@@ -0,0 +1,25 @@
+import { RelationNameKind } from "@colijnit/transactionapi/build/enum/relation-name-kind.enum";
+import { GenderType } from "@colijnit/transactionapi/build/enum/gender-type.enum";
+import { RelationListObject } from "@colijnit/transactionapi/build/model/relation-list-object.bo";
+import { TransactionService } from "../../../service/transaction.service";
+import { RelationBaseComponent } from "../relation-base.component";
+export declare class RelationGeneralComponent extends RelationBaseComponent {
+    private _service;
+    readonly relType: typeof RelationNameKind;
+    readonly genderType: typeof GenderType;
+    showClass(): boolean;
+    relationSuggestions: RelationListObject[];
+    showSuggestionsSidebar: boolean;
+    dateOfBirth: Date;
+    constructor(_service: TransactionService);
+    firstNameChange(firstName: string): void;
+    familyNameChange(familyName: string): void;
+    changeGenderType(value: GenderType): void;
+    checkVisibilitySuggestions(): void;
+    showSidebar(): void;
+    hideSidebar(): void;
+    onRelationSuggestionClick(relationSuggested: RelationListObject): Promise<void>;
+    protected relationSet(): void;
+    private _relationNameChangeHandler;
+    private _relationNameChangedHandlerFn;
+}

package/lib/component/relation/relation-general/relation-general.module.d.ts

@@ -0,0 +1,2 @@
+export declare class RelationGeneralModule {
+}

package/lib/component/relation/relation-general/style/_layout.scss

@@ -0,0 +1,37 @@
+@include export-module('cc-relation-general-layout') {
+  .co-relation-general {
+    .collapseable {
+      display: flex;
+      flex-direction: column;
+      row-gap: $tp-relation-general-row-gap;
+    }
+    .default-data-row {
+      display: flex;
+      column-gap: $tp-relation-general-column-gap;
+      .default-width {
+        width: $tp-radio-button-width;
+      }
+      .form-input {
+        width: 100%;
+      }
+      .checkout-prefix-name {
+        width: 20%;
+      }
+    }
+    .suggestions-sidebar {
+      position: fixed;
+      top: 0;
+      right: 0;
+      display: flex;
+      flex-direction: column;
+      width: $tp-checkout-relation-suggestion-list-sidebar-width;
+      height: 100%;
+      background: $tp-checkout-relation-suggestion-list-sidebar-background-color;
+      box-shadow: $tp-checkout-relation-suggestion-list-sidebar-boxshadow;
+    }
+    .relation-sidebar-header {
+      padding: $tp-checkout-relation-suggestion-list-label-padding;
+      margin: $tp-checkout-relation-suggestion-list-label-margin;
+    }
+  }
+}

package/lib/component/relation/relation-general/style/_material-definition.scss

@@ -0,0 +1,2 @@
+$tp-relation-general-row-gap: 10px !default;
+$tp-relation-general-column-gap: 10px !default;

package/lib/component/relation/relation-general/style/_theme.scss

@@ -0,0 +1,4 @@
+@include export-module('cc-relation-general-theme') {
+  .co-relation-general {
+  }
+}

package/lib/component/relation/relation-general/style/material.scss

@@ -0,0 +1,5 @@
+@import "../../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";
+@import "../../relation-suggestions-list/style/material";

package/lib/component/relation/relation-preferences/relation-preferences.component.d.ts

@@ -0,0 +1,14 @@
+import { OnInit } from "@angular/core";
+import { RelationPrivacySetting } from "@colijnit/transactionapi/build/model/relation-privacy-setting.bo";
+import { TransactionService } from "../../../service/transaction.service";
+import { RelationBaseComponent } from "../relation-base.component";
+export declare class RelationPreferencesComponent extends RelationBaseComponent implements OnInit {
+    private _service;
+    showClass(): boolean;
+    privacySettings: RelationPrivacySetting[];
+    constructor(_service: TransactionService);
+    ngOnInit(): Promise<void>;
+    isShared(relationPrivacySetting: RelationPrivacySetting): boolean;
+    changePrivacySetting(relationPrivacySetting: RelationPrivacySetting, value: boolean): void;
+    private _loadPrivacySettings;
+}

package/lib/component/relation/relation-preferences/relation-preferences.module.d.ts

@@ -0,0 +1,2 @@
+export declare class RelationPreferencesModule {
+}

package/lib/component/relation/relation-preferences/style/_layout.scss

@@ -0,0 +1,17 @@
+@include export-module('cc-relation-preferences-layout') {
+  .co-relation-preferences {
+    .two-column-grid {
+      display: grid;
+      grid-template-areas: "firstcolumn secondcolumn";
+      row-gap: $tp-checkout-relation-row-gap;
+      .first-column {
+        grid-area: firstcolumn;
+        grid-row: auto;
+      }
+      .second-column {
+        grid-area: secondcolumn;
+        grid-row: auto;
+      }
+    }
+  }
+}

package/lib/component/relation/relation-preferences/style/_theme.scss

@@ -0,0 +1,4 @@
+@include export-module('cc-relation-preferences-theme') {
+  .co-relation-preferences {
+  }
+}

package/lib/component/relation/relation-preferences/style/material.scss

@@ -0,0 +1,4 @@
+@import "../../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";

package/lib/component/{checkout/checkout-relation-suggestions-list/checkout-relation-suggestions-list.component.d.ts → relation/relation-suggestions-list/relation-suggestions-list.component.d.ts}

@@ -1,6 +1,6 @@
 import { EventEmitter } from "@angular/core";
 import { RelationListObject } from "@colijnit/transactionapi/build/model/relation-list-object.bo";
-export declare class CheckOutRelationSuggestionsListComponent {
+export declare class RelationSuggestionsListComponent {
     suggestions: RelationListObject[];
     suggestionSelected: EventEmitter<RelationListObject>;
     showClass(): boolean;

package/lib/component/relation/relation-suggestions-list/relation-suggestions-list.module.d.ts

@@ -0,0 +1,2 @@
+export declare class RelationSuggestionsListModule {
+}

package/lib/component/relation/relation-suggestions-list/style/_layout.scss

@@ -0,0 +1,6 @@
+@include export-module('cc-relation-suggestions-list-layout') {
+  .co-relation-suggestions-list {
+    overflow: auto;
+    z-index: 10;
+  }
+}

package/lib/component/relation/relation-suggestions-list/style/_theme.scss

@@ -0,0 +1,4 @@
+@include export-module('cc-relation-suggestions-list-theme') {
+  .co-relation-suggestions-list {
+  }
+}

package/lib/component/relation/relation-suggestions-list/style/material.scss

@@ -0,0 +1,5 @@
+@import "../../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";
+@import "../../relation-suggestions-list-item/style/material";

package/lib/component/{checkout/checkout-relation-suggestions-list-item/checkout-relation-suggestions-list-item.component.d.ts → relation/relation-suggestions-list-item/relation-suggestions-list-item.component.d.ts}

@@ -1,6 +1,6 @@
 import { EventEmitter } from "@angular/core";
 import { RelationListObject } from "@colijnit/transactionapi/build/model/relation-list-object.bo";
-export declare class CheckOutRelationSuggestionsListItemComponent {
+export declare class RelationSuggestionsListItemComponent {
     suggestion: RelationListObject;
     selectionSelected: EventEmitter<RelationListObject>;
     showClass(): boolean;

package/lib/component/relation/relation-suggestions-list-item/relation-suggestions-list-item.module.d.ts

@@ -0,0 +1,2 @@
+export declare class RelationSuggestionsListItemModule {
+}

package/lib/component/relation/relation-suggestions-list-item/style/_layout.scss

@@ -0,0 +1,32 @@
+@include export-module('cc-relation-suggestions-list-item-layout') {
+  .co-relation-suggestions-list-item {
+    cursor: pointer;
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    flex-shrink: 0;
+    padding: $tp-relation-suggestions-list-item-padding;
+    background-color: $tp-relation-suggestions-list-item-background-color;
+    border: 1px solid $tp-relation-suggestions-list-item-border-color;
+    border-radius: 5px;
+    margin: 5px;
+    max-width: $tp-relation-suggestions-list-item-max-width;
+
+    .name {
+      font-weight: $tp-relation-suggestions-list-item-name-fontweight;
+      font-size: $tp-relation-suggestions-list-item-name-fontsize;
+    }
+
+    .email, .address, .phone {
+      color: $tp-color-text-grey;
+      font-size: $tp-relation-suggestions-list-item-fontsize;
+    }
+
+    &:hover {
+      background-color: $tp-relation-suggestions-list-item-hover-color;
+      co-button.popup {
+        visibility: visible;
+      }
+    }
+  }
+}

package/lib/component/relation/relation-suggestions-list-item/style/_material-definition.scss

@@ -0,0 +1,8 @@
+$tp-relation-suggestions-list-item-padding: 11px !default;
+$tp-relation-suggestions-list-item-background-color: $tp-color-light !default;
+$tp-relation-suggestions-list-item-border-color: $tp-color-light-accent !default;
+$tp-relation-suggestions-list-item-max-width: 250px !default;
+$tp-relation-suggestions-list-item-hover-color: $tp-color-hover !default;
+$tp-relation-suggestions-list-item-name-fontsize: $tp-font-size !default;
+$tp-relation-suggestions-list-item-fontsize: $tp-font-size !default;
+$tp-relation-suggestions-list-item-name-fontweight: bold !default;

package/lib/component/relation/relation-suggestions-list-item/style/_theme.scss

@@ -0,0 +1,4 @@
+@include export-module('cc-relation-suggestions-list-item-theme') {
+  .co-relation-suggestions-list-item {
+  }
+}

package/lib/component/relation/relation-suggestions-list-item/style/material.scss

@@ -0,0 +1,4 @@
+@import "../../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";

package/lib/component/relation/relation-type/relation-type.component.d.ts

@@ -0,0 +1,10 @@
+import { EventEmitter } from "@angular/core";
+import { RelationNameKind } from "@colijnit/transactionapi/build/enum/relation-name-kind.enum";
+import { RelationAnyType } from "@colijnit/transactionapi/build/model/relation-any-type";
+export declare class RelationTypeComponent {
+    readonly relType: typeof RelationNameKind;
+    relation: RelationAnyType;
+    relationChange: EventEmitter<RelationAnyType>;
+    showClass(): boolean;
+    handleChangeRelationType(type: RelationNameKind): void;
+}

package/lib/component/relation/relation-type/relation-type.module.d.ts

@@ -0,0 +1,2 @@
+export declare class RelationTypeModule {
+}

package/lib/component/relation/relation-type/style/_layout.scss

@@ -0,0 +1,11 @@
+@include export-module('cc-relation-type-layout') {
+  .co-relation-type {
+    .default-data-row {
+      display: flex;
+      column-gap: 10px;
+      .default-width {
+        width: $tp-radio-button-width;
+      }
+    }
+  }
+}

package/lib/component/relation/relation-type/style/_theme.scss

@@ -0,0 +1,4 @@
+@include export-module('cc-relation-type-theme') {
+  .co-relation-type {
+  }
+}

package/lib/component/relation/relation-type/style/material.scss

@@ -0,0 +1,4 @@
+@import "../../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";

package/lib/component/transaction-grid/transaction-lines-grid/transaction-lines-grid.component.d.ts

@@ -2,10 +2,13 @@ import { TransactionLineInfo } from "@colijnit/transactionapi/build/model/transa
 import { TransactionService } from "../../../service/transaction.service";
 import { TransactionGridBaseComponent } from "../../core/base/transaction-grid-base.component";
 import { TransactionImageService } from "../../../service/transaction-image.service";
+import { DialogService } from "../../../service/dialog.service";
 export declare class TransactionLinesGridComponent extends TransactionGridBaseComponent {
     protected imageService: TransactionImageService;
     private _service;
+    private _dialogService;
     showClass(): boolean;
-    constructor(imageService: TransactionImageService, _service: TransactionService);
+    constructor(imageService: TransactionImageService, _service: TransactionService, _dialogService: DialogService);
     changeLineAmount(row: TransactionLineInfo, amount: number): void;
+    openCommissionCodeDialog(row: TransactionLineInfo): void;
 }

package/lib/component/transaction-header/style/material.scss

@@ -2,6 +2,6 @@
 @import "./material-definition";
 @import "./layout";
 @import "./theme";
-@import "../../transaction-header-relation/style/material";
-@import "../../transaction-header-contact/style/material";
-@import "../../transaction-header-delivery/style/material";
+@import "../transaction-header-relation/style/material";
+@import "../transaction-header-order/style/material";
+@import "../transaction-header-delivery/style/material";

package/lib/component/transaction-header/transaction-header-delivery/style/_layout.scss

@@ -3,6 +3,10 @@
 @include export-module('co-transaction-header-delivery-layout') {
   .co-transaction-header-delivery {
     display: flex;
+    .co-carousel-3d {
+      max-width: 100%;
+      height: 175px;
+    }
     .transaction-header-block-header {
       co-icon {
         position: relative;
@@ -11,9 +15,13 @@
       }
     }
     .header-delivery-method {
+      cursor: pointer;
       display: flex;
       column-gap: 10px;
       align-items: center;
+      width: 100%;
+      border: $tp-transaction-header-delivery-delivery-method-border;
+      border-radius: $tp-transaction-header-delivery-delivery-method-border-radius;
     }
     .planning-request-button {
       border: $tp-transaction-header-delivery-planning-request-button-border;
@@ -40,5 +48,10 @@
       flex-direction: column;
       align-items: center;
     }
+    .co-dialog:not(.is-mobile) {
+      .co-dialog-wrapper {
+        min-width: 500px;
+      }
+    }
   }
 }

package/lib/component/transaction-header/transaction-header-delivery/style/_material-definition.scss

@@ -4,4 +4,8 @@ $tp-transaction-header-delivery-planning-request-button-border: 1px solid !defau
 $tp-transaction-header-delivery-planning-request-button-border-color: $tp-color-border !default;
 $tp-transaction-header-delivery-planning-request-button-border-radius: 5px !default;
 $tp-transaction-header-delivery-definitive-button-color: $tp-color-active-light !default;
+$tp-transaction-header-delivery-delivery-method-background-color: #f5f5fa !default;
+$tp-transaction-header-delivery-delivery-method-border: 1px solid !default;
+$tp-transaction-header-delivery-delivery-method-border-color: $tp-color-border !default;
+$tp-transaction-header-delivery-delivery-method-border-radius: 10px !default;
 $tp-transaction-header-delivery-delivery-truck-color: $tp-color-font !default;