carriera-intern 0.0.0

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/models/label-color.model.ts

@@ -0,0 +1,11 @@
+export interface LabelColor {
+  code?: string;
+  color?: string;
+  createdAt?: string;
+  hoverCode?: string;
+  name?: string;
+  updatedAt?: string;
+  colorId?: number;
+  count?: number;
+  id?: number;
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/pipes/input-clear-class.pipe.ts

@@ -0,0 +1,105 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { AbstractControl } from '@angular/forms';
+
+// confis
+import { ICaInput } from '../components/cai-custom-datetime-pickers/config';
+
+export enum DropdownTemplateTypeEnum {
+  PAYROLL_TRUCKS = 'payroll-trucks'
+}
+
+@Pipe({
+  name: 'inputClearClass',
+  standalone: true
+})
+export class InputClearClassPipe implements PipeTransform {
+  transform(
+    getSuperControl: AbstractControl<any, any> | null,
+    isFocusInput: boolean,
+    inputConfig: ICaInput,
+    incorrectValue: boolean,
+    selectedDropdownLabelColor: boolean,
+    template: string,
+    value: string
+  ): { [key: string]: boolean | undefined } {
+    return {
+      focus:
+        isFocusInput &&
+        getSuperControl?.value &&
+        !(inputConfig.blackInput && inputConfig.isDropdown),
+      'valid-focus-in':
+        (getSuperControl?.value &&
+          getSuperControl?.valid &&
+          isFocusInput &&
+          !inputConfig.customClass?.includes('repair-shop-open-hour') &&
+          !inputConfig.blackInput &&
+          !inputConfig.dropdownImageInput?.url &&
+          !inputConfig.isInvalidSearchInDropdown &&
+          !inputConfig.mergeDropdownBodyWithInput &&
+          !inputConfig.isDisabled) ||
+        (inputConfig.multipleInputValues?.options.length &&
+          isFocusInput &&
+          !inputConfig.isInvalidSearchInDropdown &&
+          !inputConfig.blackInput &&
+          !inputConfig.mergeDropdownBodyWithInput &&
+          !inputConfig.isDisabled &&
+          !inputConfig.dropdownLabel &&
+          template === DropdownTemplateTypeEnum.PAYROLL_TRUCKS),
+      'valid-focus-out':
+        getSuperControl?.value &&
+        getSuperControl?.valid &&
+        !isFocusInput &&
+        !inputConfig.customClass?.includes('repair-shop-open-hour') &&
+        !inputConfig.blackInput &&
+        !inputConfig.isDisabled,
+      'invalid-focus-in':
+        (getSuperControl?.value &&
+          getSuperControl?.invalid &&
+          isFocusInput &&
+          !inputConfig.mergeDropdownBodyWithInput &&
+          !inputConfig.blackInput &&
+          !inputConfig.isDisabled) ||
+        (inputConfig.isInvalidSearchInDropdown &&
+          inputConfig.isDropdown &&
+          isFocusInput &&
+          getSuperControl?.value &&
+          !inputConfig.mergeDropdownBodyWithInput &&
+          !inputConfig.blackInput &&
+          !inputConfig.isDisabled),
+      'invalid-focus-out':
+        getSuperControl?.value &&
+        getSuperControl?.invalid &&
+        !isFocusInput &&
+        !inputConfig.isDropdown &&
+        !inputConfig.blackInput &&
+        !(
+          !inputConfig.dropdownImageInput?.withText &&
+          inputConfig.dropdownImageInput?.url
+        ) &&
+        !inputConfig.isDisabled,
+      'incorrect-input': inputConfig.incorrectInput && getSuperControl?.value,
+      'incorrect-input-on':
+        inputConfig.incorrectInput && getSuperControl?.value && incorrectValue,
+      hidden:
+        getSuperControl?.value && isFocusInput && inputConfig.dropdownLabel,
+      'dropdown-on':
+        (getSuperControl?.value &&
+          inputConfig.isDropdown &&
+          !inputConfig.isDisabled &&
+          !inputConfig.blackInput &&
+          !inputConfig.multiSelectDropdownActive &&
+          !inputConfig.mergeDropdownBodyWithInput) ||
+        (inputConfig.dropdownImageInput?.url &&
+          !inputConfig.isDisabled &&
+          !inputConfig.blackInput &&
+          !inputConfig.multiSelectDropdownActive &&
+          !inputConfig.mergeDropdownBodyWithInput) ||
+        (!inputConfig.blackInput && selectedDropdownLabelColor) ||
+        (inputConfig.dropdownImageInput?.url &&
+          !inputConfig.blackInput &&
+          !inputConfig.mergeDropdownBodyWithInput) ||
+        template === DropdownTemplateTypeEnum.PAYROLL_TRUCKS,
+      'trash-can-svg': inputConfig.removeInput,
+    };
+  }
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/pipes/input-date-time-container-class.pipe.ts

@@ -0,0 +1,66 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { AbstractControl } from '@angular/forms';
+import { ICaInput } from '../components/cai-custom-datetime-pickers/config';
+
+@Pipe({
+    name: 'inputDateTimeContainerClass',
+    standalone: true,
+})
+export class InputDateTimeContainerClassPipe implements PipeTransform {
+    transform(
+        getSuperControl: AbstractControl<any, any> | null,
+        isFocusInput: boolean,
+        inputConfig: ICaInput,
+        value: string,
+        isDisabledInput?: boolean,
+        invalid?: boolean,
+        isTouchedInput?: boolean,
+    ): { [key: string]: boolean | undefined | null | string } {
+
+        const isDisabled = isDisabledInput ?? inputConfig.isDisabled;
+        return {
+            'datetime-transparent': inputConfig.transparentInput,
+            //'datetime-custom-empty-hover': !isFocusInput,
+            'datetime-custom-empty-focus': isFocusInput && !isTouchedInput && !value,
+            'datetime-custom-filled-hover':
+                value && !isFocusInput && !inputConfig.dropdownLabel,
+            'datetime-invalid-filled-focus-out':
+                value &&
+                invalid &&
+                //isTouchedInput &&
+                !isFocusInput &&
+                !inputConfig.blackInput &&
+                !isDisabled,
+            'datetime-invalid-empty-focus-out':
+                !value &&
+                invalid &&
+                isTouchedInput &&
+                !isFocusInput &&
+                !inputConfig.blackInput &&
+                !isDisabled &&
+                !inputConfig.dropdownLabel,
+            'datetime-invalid-focus-in':
+                invalid &&
+                isFocusInput &&
+                !inputConfig.blackInput &&
+                !isDisabled,
+            'datetime-valid-focus-in':
+                value &&
+                !invalid &&
+                isFocusInput &&
+                !isDisabled,
+            'datetime-valid-focus-out':
+                value &&
+                !invalid &&
+                !isFocusInput &&
+                !inputConfig.blackInput &&
+                !inputConfig.isDisabled,
+            'datetime-inactive-empty': isDisabled && !value,
+            'datetime-inactive-filled': isDisabled && value,
+            'datetime-input-remove-trash-can': inputConfig.removeInput,
+            'datetime-input-remove-background': inputConfig.isInputBackgroundRemoved,
+            'datetime-input-blue-text': inputConfig.isBlueText,
+            'datetime-required-label-table': inputConfig.requiredLabel,
+        };
+    }
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/pipes/input-dropdown-arrow-class.pipe.ts

@@ -0,0 +1,68 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { AbstractControl } from '@angular/forms';
+import { ICaInput } from '../components/cai-custom-datetime-pickers/config';
+
+@Pipe({
+  name: 'inputDropdownArrowClass',
+  standalone: true,
+})
+export class InputDropdownArrowClassPipe implements PipeTransform {
+  transform(
+    getSuperControl: AbstractControl<any, any> | null,
+    isFocusInput: boolean,
+    inputConfig: ICaInput,
+    isTouchedInput: boolean,
+    value: string
+  ): { [key: string]: boolean | undefined } {
+    return {
+      focus: isFocusInput,
+      'valid-focus-in':
+        (!inputConfig.dropdownLabel &&
+          (getSuperControl?.value || inputConfig.placeholder) &&
+          getSuperControl?.valid &&
+          isFocusInput &&
+          !inputConfig.isDisabled &&
+          !inputConfig.isInvalidSearchInDropdown) ||
+        ((inputConfig.dropdownImageInput?.url ||
+          inputConfig.dropdownImageInput?.nameInitialsInsteadUrl ||
+          inputConfig.placeholder) &&
+          isFocusInput &&
+          !inputConfig.isInvalidSearchInDropdown &&
+          !inputConfig.isDisabled),
+      'valid-focus-out':
+        (getSuperControl?.value &&
+          getSuperControl?.valid &&
+          !isFocusInput &&
+          !inputConfig.isDisabled) ||
+        (!inputConfig.dropdownImageInput?.withText &&
+          inputConfig.dropdownImageInput?.url &&
+          !isFocusInput &&
+          !inputConfig.isDisabled),
+      'invalid-focus-in':
+        (getSuperControl?.value &&
+          getSuperControl?.invalid &&
+          isFocusInput &&
+          !inputConfig.isDisabled) ||
+        (isFocusInput &&
+          getSuperControl?.value &&
+          inputConfig.isInvalidSearchInDropdown &&
+          inputConfig.isDropdown &&
+          !inputConfig.blackInput &&
+          !inputConfig.mergeDropdownBodyWithInput &&
+          !inputConfig.isDisabled),
+      'invalid-focus-out':
+        !getSuperControl?.value &&
+        getSuperControl?.invalid &&
+        (isTouchedInput || getSuperControl?.touched) &&
+        !isFocusInput &&
+        !inputConfig.isDisabled,
+      'invalid-search-in-dropdown-focus-in':
+        inputConfig.isInvalidSearchInDropdown &&
+        inputConfig.isDropdown &&
+        isFocusInput &&
+        getSuperControl?.value &&
+        getSuperControl?.invalid &&
+        !inputConfig.isDisabled,
+    };
+  }
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/pipes/input-placeholder-icon.class.pipe.ts

@@ -0,0 +1,68 @@
+import { Pipe, PipeTransform } from "@angular/core";
+import { AbstractControl } from "@angular/forms";
+import { ICaInput } from "../components/cai-custom-datetime-pickers/config";
+
+@Pipe({
+  name: "inputPlaceholderIconClass",
+  standalone: true,
+})
+export class InputPlaceholderIconClassPipe implements PipeTransform {
+  transform(
+    getSuperControl: AbstractControl<any, any> | null,
+    isFocusInput: boolean,
+    inputConfig: ICaInput,
+    selectedDropdownLabelColor: any | null,
+    isTouchedInput: boolean,
+    isEditInput: boolean,
+    value: string
+  ): { [key: string]: boolean | undefined } {
+    return {
+      "inactive-empty": !getSuperControl?.value && inputConfig.isDisabled,
+      "inactive-filled": getSuperControl?.value && inputConfig.isDisabled,
+      "default-svg-color":
+        !(inputConfig.dropdownLabel && isFocusInput) &&
+        !(inputConfig.dropdownLabel && selectedDropdownLabelColor),
+      focus: isFocusInput && !inputConfig.dropdownLabel,
+      "valid-focus-in":
+        getSuperControl?.value &&
+        getSuperControl?.valid &&
+        isFocusInput &&
+        !selectedDropdownLabelColor &&
+        !inputConfig.dropdownLabel &&
+        !inputConfig.blackInput &&
+        !inputConfig.commands?.active &&
+        !inputConfig.isDisabled,
+      "valid-focus-out":
+        getSuperControl?.value &&
+        getSuperControl?.valid &&
+        !isFocusInput &&
+        !selectedDropdownLabelColor &&
+        !inputConfig.dropdownLabel &&
+        !inputConfig.isDisabled,
+      "valid-focus-out-dropdown-label":
+        getSuperControl?.value &&
+        getSuperControl?.valid &&
+        !isFocusInput &&
+        selectedDropdownLabelColor &&
+        inputConfig.dropdownLabel &&
+        !inputConfig.isDisabled,
+      "invalid-focus-in":
+        getSuperControl?.value &&
+        getSuperControl?.invalid &&
+        isFocusInput &&
+        !selectedDropdownLabelColor &&
+        !inputConfig.dropdownLabel &&
+        !inputConfig.blackInput &&
+        !inputConfig.isDisabled,
+      "invalid-focus-out":
+        getSuperControl?.invalid &&
+        !isFocusInput &&
+        !selectedDropdownLabelColor &&
+        !inputConfig.dropdownLabel &&
+        (isTouchedInput || getSuperControl?.touched) &&
+        !inputConfig.isDisabled,
+      hidden: inputConfig.type === "password" && getSuperControl?.value,
+      'cursor-pointer': isEditInput
+    };
+  }
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/pipes/show-clear.pipe.ts

@@ -0,0 +1,20 @@
+import { Pipe, PipeTransform } from "@angular/core";
+import { ICaInput } from "../components/cai-custom-datetime-pickers/config";
+
+@Pipe({
+  name: "showClear",
+  standalone: true
+})
+export class ShowClearPipe implements PipeTransform {
+  transform(inputConfig: ICaInput, disabled?: boolean): boolean | undefined {
+    const isDisabled = disabled || inputConfig.isDisabled;
+    return (
+      (!inputConfig.hideClear &&
+        (!isDisabled || inputConfig.removeInput) &&
+        !inputConfig.customClass?.includes("details-pages") &&
+        !inputConfig.commands?.active &&
+        !inputConfig?.loadingSpinner?.isLoading) ||
+      inputConfig.incorrectInput
+    );
+  }
+}

package/projects/carriera-intern-components/src/app/components/input-datetime-picker/scss/ca-input.colors.scss

@@ -0,0 +1,287 @@
+//-------------------------------------------------- NEW PALLETE OF COLORS  --------------------------------------------------
+
+$input-transparent-color: transparent;
+$input-capslock-color: #ffb74d;
+
+//---------------------------- INACTIVE ----------------------------------------
+//Inactive State Empty
+$inactive-empty-input: #f7f7f7;
+$inactive-empty-label: #919191;
+$inactive-empty-placeholderIcon: #cccccc;
+$inactive-empty-placeholderIcon-pipe: rgba(204, 204, 204, 0.4);
+
+//Inactive State Filled
+$inactive-filled-input: #f7f7f7;
+$inactive-filled-label: #2f2f2f;
+$inactive-filled-content: #2f2f2f;
+$inactive-filled-placeholderIcon: #aaaaaa;
+$inactive-filled-placeholderIcon-pipe: rgb(170, 170, 170, 0.4);
+$inactive-filled-placeholderText: #aaaaaa;
+
+// Selection
+$inactive-filled-content-background-selection: rgb(47, 47, 47, 0.2);
+
+// Password
+$inactive-password: #cccccc;
+
+//------------------------------ DEFAULT --------------------------------------
+//Default Empty
+$default-input: #eeeeee;
+$default-label: #2f2f2f;
+$default-content: #2f2f2f;
+$default-placeholderIcon: #919191;
+$default-placeholderIcon-yellow: #ffa726;
+$default-placeholderIcon-green: #4db6a2;
+$default-placeholderIcon-purple: #ba68c8;
+$default-placeholderIcon-orange: #F89B2E;
+$default-placeholderIcon-red: #E66767;
+$default-placeholderIcon-pipe: rgb(145, 145, 145, 0.4);
+$default-arrow: #919191;
+$default-path-clear: #eeeeee;
+$default-rect-clear: #919191;
+
+// Counter
+$default-counter-content: #424242;
+$default-counter-background: rgb(66, 66, 66, 0.2);
+
+// Selection
+$default-content-background-selection: rgb(47, 47, 47, 0.2);
+$default-label-background-selection: rgb(47, 47, 47, 0.2);
+
+//Default Hover
+$default-on-input-hover: #dadada;
+$default-on-arrow-hover: #424242;
+$default-on-rect-clear-hover: #424242;
+
+// Password
+$default-password: #919191;
+
+//Focus
+$default-focus-input: #1d1d1d;
+$default-focus-label: #2f2f2f;
+$default-focus-content: #ffffff;
+$default-focus-placeholder: rgb(255, 255, 255, 0.4);
+$default-focus-placeholderIcon: #cccccc;
+$default-focus-placehilderIcon-pipe: rgb(204, 204, 204, 0.4);
+$default-focus-placeholderText: #919191;
+$default-focus-arrow: #cccccc;
+$default-focus-path-clear: #1d1d1d;
+$default-focus-rect-clear: #aaaaaa;
+$default-focus-input-blue-commands: #0B49D1;
+
+// Commands
+$focus-commands-path: #1d1d1d;
+$focus-commands-rect: #cccccc;
+
+// Selection
+$default-focus-content-selection: rgb(255, 255, 255, 0.2);
+
+//Focus Hover
+$default-focus-on-arrow-hover: #ffffff;
+$default-focus-on-rect-clear: #ffffff;
+$default-focus-commands-rect-hover: #ffffff;
+$default-focus-commands-rect-hover-blue-commands: #6692F1;
+
+// Removed Background
+$default-removed-background-text: #6c6c6c;
+$default-removed-background-arrow: #919191;
+$default-removed-background-input-focus: #2f2f2f;
+$default-removed-background-input-focus-text: #ffffff;
+
+//------------------------------ VALID --------------------------------------
+//Valid
+$valid-input: #e2ecf9;
+$valid-label: #2f2f2f;
+$valid-content: #2f2f2f;
+$valid-placeholderIcon: #6f9ee0;
+$valid-placeholderIcon-pipe: rgb(111, 158, 224, 0.4);
+$valid-placholderText: #919191;
+$valid-checkmark: #6f9ee0;
+$valid-path-clear: #c5d8f3;
+$valid-rect-clear: #6f9ee0;
+$valid-arrow: #6f9ee0;
+
+$valid-pen-path: #c5d8f3;
+$valid-pen-rect: #6f9ee0;
+
+// MultiSelect
+$valid-multiselect-item-path-clear: #ffffff;
+$valid-multiselect-item-rect-clear: #6f9ee0;
+
+// Selection
+$valid-content-background-selection: rgb(47, 47, 47, 0.2);
+
+// Password
+$valid-password: #6f9ee0;
+
+//Valid Hover
+$valid-input-hover: #c5d8f3;
+$valid-on-rect-clear-hover: #3074d3;
+$valid-on-pen-rect-hover: #3074d3;
+$valid-on-arrow-hover: #3074d3;
+$valid-on-password-hover: #3074d3;
+$valid-on-multiselect-item-hover: #ffffff;
+
+// Multiselect
+$valid-multiselect-item-on-rect-clear-hover: #3074d3;
+
+//Valid Focus
+$valid-focus-input: #255bb9;
+$valid-focus-content: #ffffff;
+$valid-focus-placeholderIcon: #98b9ea;
+$valid-focus-placeholderIcon-pipe: #c5d8f3;
+$valid-focus-placeholderText: #c5d8f3;
+$valid-focus-placeholder-native: #6f9ee0;
+$valid-focus-placehilder-image: #98b9ea;
+$valid-focus-path-clear: #255bb9;
+$valid-focus-rect-clear: #c5d8f3;
+$valid-focus-arrow: #c5d8f3;
+
+// Multiselect
+$valid-focus-multiselect-item: #3074d3;
+$valid-focus-multiselect-item-path-clear: #6f9ee0;
+$valid-focus-multiselect-item-rect-clear: #e2ecf9;
+
+// Selection
+$valid-focus-content-background-selection: rgb(255, 255, 255, 0.2);
+
+// Password
+$valid-focus-password: #98b9ea;
+
+//Valid Focus Hover
+$valid-focus-on-rect-clear-hover: #ffffff;
+$valid-focus-on-arrow-hover: #ffffff;
+$valid-focus-on-password-hover: #ffffff;
+$valid-focus-multiselect-item-rect-clear-hover: #ffffff;
+
+// Multiselect
+$valid-focus-on-multiselect-item: #6f9ee0;
+
+//------------------------------- INVALID -------------------------------------
+
+//Invalid
+$invalid-input: #fae3e3;
+$invalid-label: #2f2f2f;
+$invalid-content: #2f2f2f;
+$invalid-placeholderIcon: #e57373;
+$invalid-placeholderIcon-pipe: rgb(229, 115, 115, 0.4);
+$invalid-placeholderText: #919191;
+$invalid-danger-mark: #e57373;
+$invalid-message: #ef5350;
+$invalid-path-clear: #f5c7c7;
+$invalid-rect-clear: #e57373;
+$invalid-arrow: #e57373;
+
+$invalid-pen-path: #f5c7c7;
+$invalid-pen-rect: #e57373;
+
+// Selection
+$invalid-content-background-selection: rgb(47, 47, 47, 0.2);
+$invalid-message-background-selection: rgb(239, 83, 80, 0.2);
+
+// Password
+$invalid-password: #e57373;
+
+//Invalid Hover
+$invalid-input-hover: #f5c7c7;
+$invalid-on-rect-clear-hover: #ef5350;
+$invalid-on-pen-rect-hover: #ef5350;
+$invalid-on-arrow-hover: #ef5350;
+$invalid-on-password-hover: #ef5350;
+
+//Invalid Focus
+$invalid-focus-input: #e22e22;
+$invalid-focus-content: #ffffff;
+$invalid-focus-placeholderIcon: #ffb0a8;
+$invalid-focus-placeholderIcon-pipe: #f5c7c7;
+$invalid-focus-placeholderText: #f5c7c7;
+$invalid-focus-path-clear: #e22e22;
+$invalid-focus-rect-clear: #f5c7c7;
+$invalid-focus-arrow: #f5c7c7;
+
+// Selection
+$invalid-focus-content-background-selection: rgb(255, 255, 255, 0.2);
+
+// Password
+$invalid-focus-password: #ffb0a8;
+
+// Commands
+$invalid-focus-commands-path: #e22e22;
+$invalid-focus-commands-rect: #f5c7c7;
+
+//Invalid Focus Hover
+$invalid-focus-on-rect-clear-hover: #ffffff;
+$invalid-focus-on-arrow-hover: #ffffff;
+$invalid-focus-on-commands-rect-hover: #ffffff;
+$invalid-focus-on-password-hover: #ffffff;
+
+//------------------------------- Requiered Star -------------------------------
+$input-required-star: #ef5350;
+
+//------------------------------- Font Weight Label -------------------------------
+$input-label-font-weight-600: 600;
+
+//------------------------------- SPECIFIC CASES -------------------------------
+
+// Label
+$default-focus-in-input-label: #ffffff;
+
+// Input
+$default-content-blue: #255bb9;
+
+//-------------------------------------- Trash Can (Clear) --------------------------------------
+// Default
+$default-trash-can: #aaaaaa;
+$default-trash-can-hover: #919191;
+// Valid
+$valid-trash-can: #6f9ee0;
+$valid-trash-can-hover: #3074d3;
+$valid-focus-trash-can: #c5d8f3;
+$valid-focus-trash-can-hover: #ffffff;
+// Invalid
+$invalid-trash-can: #e57373;
+$invalid-trash-can-hover: #ef5350;
+$invalid-focus-trash-can: #f5c7c7;
+$invalid-focus-trash-can-hover: #ffffff;
+
+//-------------------------------------- Input Counter (Clear) --------------------------------------
+$input-counter-color: #424242;
+$input-counter-background-color: rgb(66, 66, 66, 0.2);
+
+//----------------------- DROPDOWN INPUT IMAGE --------------
+// Trucks
+$input-semitruck-path-fill: #26a690;
+$input-semisleepertruck-path-fill: #ffa726;
+$input-boxtruck-path-fill: #ef5350;
+$input-cargovantruck-path-fill: #38bdeb;
+$input-towtruck-path-fill: #ab47bc;
+$input-carhaulertruck-path-fill: #f276ef;
+$input-spottertruck-path-fill: #8d6e63;
+$input-bus-path-fill: #ff7043;
+$input-truck-fill: #919191;
+
+// Trailers
+$input-reefertrailer-path-fill: #3074d3;
+$input-dryvantrailer-path-fill: #38bdeb;
+$input-sidekittrailer-path-fill: #ab47bc;
+$input-conestogatrailer-path-fill: #008496;
+$input-dumpertrailer-path-fill: #8d6e63;
+$input-containertrailer-path-fill: #ffa726;
+$input-tankertrailer-path-fill: #26a690;
+$input-pneumatictankertrailer-path-fill: #56ab62;
+$input-carhaulerstingertrailer-path-fill: #f276ef;
+$input-carhaulertrailer-path-fill: #fd4d96;
+$input-flatbedtrailer-path-fill: #ff9800;
+$input-lowboyrgntrailer-path-fill: #f76629;
+$input-chassistrailer-path-fill: #ef5350;
+$input-stepdecktrailer-path-fill: #d80300;
+$input-trailer-fill: #919191;
+
+$input-clear-dispatch-hover: #91919166;
+
+//----------------------- DROPDOWN INPUT IMAGE --------------
+$datetime-dark-default: #424242;
+$datetime-dark-label-default: #ffffff;
+
+$unset-color: #ffffff66;
+$dark-valid-focus-out-filled: #3b73ed33