@annalib/anna-core 37.0.24 → 37.1.0

package/src/lib/anna-common-scss/_icons.scss

@@ -1,3 +1,3 @@
-::ng-deep.anna-automation-activated-icon.mdi.mdi-cog-refresh {
-    color: #8bac2a;
-}
+::ng-deep.anna-automation-activated-icon.mdi.mdi-cog-refresh {
+    color: #8bac2a;
+}

package/src/lib/anna-common-scss/_legend.scss

@@ -1,11 +1,11 @@
-$dot-width: 0.625rem;
-$dot-height: 0.625rem;
-$dot-radius: 50%;
-
-@mixin dot($color) {
-    display: inline-block;
-    border-radius: $dot-radius;
-    height: $dot-height;
-    width: $dot-width;
-    background-color: $color;
-}
+$dot-width: 0.625rem;
+$dot-height: 0.625rem;
+$dot-radius: 50%;
+
+@mixin dot($color) {
+    display: inline-block;
+    border-radius: $dot-radius;
+    height: $dot-height;
+    width: $dot-width;
+    background-color: $color;
+}

package/src/lib/anna-common-scss/_mat-button-toggle.scss

@@ -1,68 +1,68 @@
-@use "colors" as *;
-
-:root {
-    --mat-standard-button-toggle-selected-state-text-color: white;
-    --mat-standard-button-toggle-selected-state-background-color: var(--primary-blue-color);
-}
-
-:host ::ng-deep.mat-mdc-button > .mat-icon {
-    font-size: 24px !important;
-    height: 24px !important;
-    width: 24px !important;
-}
-
-:host ::ng-deep .mat-button-toggle-appearance-standard .mat-button-toggle-label-content {
-    line-height: 23px;
-    width: 42px;
-    padding: 0 10px;
-    height: 22px;
-}
-
-:host ::ng-deep .mat-button-toggle-appearance-standard.mat-button-toggle-checked {
-    background-color: $primary-color;
-    color: white !important;
-
-    .mat-pseudo-checkbox {
-        display: none;
-    }
-    .mat-button-toggle-checkbox-wrapper {
-        width: 0;
-    }
-    .mat-button-toggle-button:has(.mat-button-toggle-checkbox-wrapper) {
-        padding-left: 0;
-    }
-}
-
-:host ::ng-deep .mat-button-toggle-group-appearance-standard {
-    border-radius: 2px;
-    border: none !important;
-    & .mat-button-toggle-appearance-standard + .mat-button-toggle-appearance-standard {
-        border-left: none !important;
-    }
-}
-
-::ng-deep .mat-button-toggle-disabled.mat-button-toggle-checked {
-    background: rgba($color: #bdbdbd, $alpha: 1) !important;
-
-    button {
-        color: #fff;
-        opacity: 1;
-    }
-}
-
-::ng-deep .mat-button-toggle-appearance-standard {
-    opacity: 1;
-    border: solid 1px #b3b3b3;
-    button {
-        opacity: 1;
-        border: 1px solid #bdbdbd;
-    }
-}
-
-::ng-deep .mat-button-toggle-appearance-standard.mat-button-toggle-checked {
-    opacity: 1;
-}
-
-:host ::ng-deep mat-button-toggle-group mat-button-toggle:not(.mat-button-toggle-disabled) button {
-    border: none !important;
-}
+@use "colors" as *;
+
+:root {
+    --mat-standard-button-toggle-selected-state-text-color: white;
+    --mat-standard-button-toggle-selected-state-background-color: var(--primary-blue-color);
+}
+
+:host ::ng-deep.mat-mdc-button > .mat-icon {
+    font-size: 24px !important;
+    height: 24px !important;
+    width: 24px !important;
+}
+
+:host ::ng-deep .mat-button-toggle-appearance-standard .mat-button-toggle-label-content {
+    line-height: 23px;
+    width: 42px;
+    padding: 0 10px;
+    height: 22px;
+}
+
+:host ::ng-deep .mat-button-toggle-appearance-standard.mat-button-toggle-checked {
+    background-color: $primary-color;
+    color: white !important;
+
+    .mat-pseudo-checkbox {
+        display: none;
+    }
+    .mat-button-toggle-checkbox-wrapper {
+        width: 0;
+    }
+    .mat-button-toggle-button:has(.mat-button-toggle-checkbox-wrapper) {
+        padding-left: 0;
+    }
+}
+
+:host ::ng-deep .mat-button-toggle-group-appearance-standard {
+    border-radius: 2px;
+    border: none !important;
+    & .mat-button-toggle-appearance-standard + .mat-button-toggle-appearance-standard {
+        border-left: none !important;
+    }
+}
+
+::ng-deep .mat-button-toggle-disabled.mat-button-toggle-checked {
+    background: rgba($color: #bdbdbd, $alpha: 1) !important;
+
+    button {
+        color: #fff;
+        opacity: 1;
+    }
+}
+
+::ng-deep .mat-button-toggle-appearance-standard {
+    opacity: 1;
+    border: solid 1px #b3b3b3;
+    button {
+        opacity: 1;
+        border: 1px solid #bdbdbd;
+    }
+}
+
+::ng-deep .mat-button-toggle-appearance-standard.mat-button-toggle-checked {
+    opacity: 1;
+}
+
+:host ::ng-deep mat-button-toggle-group mat-button-toggle:not(.mat-button-toggle-disabled) button {
+    border: none !important;
+}

package/src/lib/anna-common-scss/_mat-menu.scss

@@ -1,17 +1,17 @@
-@mixin mat-menu-styling() {
-    &.mat-elevation-z8 {
-        box-shadow: var(--dropdown-box-shadow);
-    }
-
-    button.mat-mdc-menu-item:hover {
-        background-color: var(--dropdown-hover-color);
-    }
-
-    & .mat-mdc-menu-content.mdc-list {
-        background-color: var(--body-color);
-    }
-
-    & .mat-mdc-menu-content {
-        padding: 0;
-    }
-}
+@mixin mat-menu-styling() {
+    &.mat-elevation-z8 {
+        box-shadow: var(--dropdown-box-shadow);
+    }
+
+    button.mat-mdc-menu-item:hover {
+        background-color: var(--dropdown-hover-color);
+    }
+
+    & .mat-mdc-menu-content.mdc-list {
+        background-color: var(--body-color);
+    }
+
+    & .mat-mdc-menu-content {
+        padding: 0;
+    }
+}

package/src/lib/anna-common-scss/_mixins.scss

@@ -1,187 +1,187 @@
-@mixin button-social-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
-    padding: $padding-y $padding-x;
-    font-size: $font-size;
-    line-height: $line-height;
-    border: 0;
-    @include border-radius($border-radius);
-
-    &::before {
-        width: ($padding-y * 2) + ($font-size * $line-height);
-        height: ($padding-y * 2) + ($font-size * $line-height);
-        padding: $padding-y 0;
-        font-size: $font-size;
-        line-height: $line-height;
-        @include border-radius($border-radius);
-    }
-
-    span {
-        margin-left: ($padding-y * 2) + ($font-size * $line-height);
-    }
-
-    &.icon {
-        width: ($padding-y * 2) + ($font-size * $line-height);
-        height: ($padding-y * 2) + ($font-size * $line-height);
-    }
-}
-
-@mixin avatar($width, $status-width) {
-    position: relative;
-    display: inline-block;
-    width: $width;
-
-    .img-avatar {
-        width: $width;
-        height: $width;
-    }
-
-    .avatar-status {
-        position: absolute;
-        right: 0;
-        bottom: 0;
-        display: block;
-        width: $status-width;
-        height: $status-width;
-        border: 1px solid #fff;
-        border-radius: 50em;
-    }
-}
-
-@mixin borders($borders) {
-    @each $border in $borders {
-        $direction: nth($border, 1);
-        @if $direction == "all" {
-            $size: map-get(map-get($borders, $direction), size);
-            $style: map-get(map-get($borders, $direction), style);
-            $color: map-get(map-get($borders, $direction), color);
-            border: $size $style $color;
-        } @else if $direction == "top" {
-            $size: map-get(map-get($borders, $direction), size);
-            $style: map-get(map-get($borders, $direction), style);
-            $color: map-get(map-get($borders, $direction), color);
-            border-top: $size $style $color;
-        } @else if $direction == "right" {
-            $size: map-get(map-get($borders, $direction), size);
-            $style: map-get(map-get($borders, $direction), style);
-            $color: map-get(map-get($borders, $direction), color);
-            border-right: $size $style $color;
-        } @else if $direction == "bottom" {
-            $size: map-get(map-get($borders, $direction), size);
-            $style: map-get(map-get($borders, $direction), style);
-            $color: map-get(map-get($borders, $direction), color);
-            border-bottom: $size $style $color;
-        } @else if $direction == "left" {
-            $size: map-get(map-get($borders, $direction), size);
-            $style: map-get(map-get($borders, $direction), style);
-            $color: map-get(map-get($borders, $direction), color);
-            border-left: $size $style $color;
-        }
-    }
-}
-
-@mixin sidebar-width($borders, $width) {
-    $sidebar-width: $width;
-
-    @each $border in $borders {
-        $direction: nth($border, 1);
-        @if $direction == "all" {
-            $size: map-get(map-get($borders, $direction), size);
-            $sidebar-width: ($sidebar-width - (2 * $size));
-        } @else if $direction == "right" {
-            $size: map-get(map-get($borders, $direction), size);
-            $sidebar-width: $sidebar-width - $size;
-        } @else if $direction == "left" {
-            $size: map-get(map-get($borders, $direction), size);
-            $sidebar-width: $sidebar-width - $size;
-        }
-        width: $sidebar-width;
-    }
-}
-
-@mixin bg-variant($parent, $color) {
-    #{"" + $parent} {
-        @include border-radius(
-            $card-border-radius-inner $card-border-radius-inner $card-border-radius-inner $card-border-radius-inner
-        );
-        color: #fff !important;
-        background-color: $color !important;
-    }
-    a#{"" + $parent} {
-        @include hover-focus {
-            background-color: darken($color, 10%);
-        }
-    }
-}
-
-@mixin card-accent-variant($color) {
-    border-top-width: 2px;
-    border-top-color: $color;
-}
-
-@mixin tabs-style($color) {
-    display: inline-block;
-    margin-right: 20px;
-    font-size: 16px;
-    color: $color;
-}
-
-@mixin fit-content() {
-    width: fit-content !important;
-    width: -moz-max-content !important;
-}
-
-@mixin fit-content-height() {
-    height: fit-content !important;
-    height: -moz-max-content !important;
-}
-
-@mixin label($fontSize, $fontWeight, $fontStyle, $letterSpacing, $color) {
-    font-family: Roboto;
-    font-size: $fontSize;
-    font-weight: normal;
-    font-stretch: normal;
-    font-style: $fontStyle;
-    line-height: normal;
-    letter-spacing: $letterSpacing;
-    color: $color;
-}
-
-@mixin modal-btn($background-color) {
-    width: 100%;
-    background-color: $background-color;
-    color: white;
-    border-radius: initial;
-}
-
-@mixin OrderListingTableStyling {
-    width: 100%;
-    tr {
-        border: 1px solid #d4d4d4;
-        border-top: none;
-        th {
-            color: #4a4a4a;
-            font-size: 11px;
-            font-weight: 500;
-            letter-spacing: 0.3px;
-            vertical-align: middle;
-            text-align: left;
-            // position: sticky;
-            // // z-index: 101 !important;
-            // top: 0px;
-            padding: unset;
-            height: 30px;
-            // line-height: 30px;
-            border-top: 1px solid #d4d4d4;
-        }
-        &.header-row th {
-            background-color: #ededed;
-        }
-        td {
-            font-size: 12px;
-            padding: 2px 0px 3px;
-            vertical-align: middle;
-            text-align: left;
-            color: #000000;
-            letter-spacing: 0px;
-        }
-    }
-}
+@mixin button-social-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
+    padding: $padding-y $padding-x;
+    font-size: $font-size;
+    line-height: $line-height;
+    border: 0;
+    @include border-radius($border-radius);
+
+    &::before {
+        width: ($padding-y * 2) + ($font-size * $line-height);
+        height: ($padding-y * 2) + ($font-size * $line-height);
+        padding: $padding-y 0;
+        font-size: $font-size;
+        line-height: $line-height;
+        @include border-radius($border-radius);
+    }
+
+    span {
+        margin-left: ($padding-y * 2) + ($font-size * $line-height);
+    }
+
+    &.icon {
+        width: ($padding-y * 2) + ($font-size * $line-height);
+        height: ($padding-y * 2) + ($font-size * $line-height);
+    }
+}
+
+@mixin avatar($width, $status-width) {
+    position: relative;
+    display: inline-block;
+    width: $width;
+
+    .img-avatar {
+        width: $width;
+        height: $width;
+    }
+
+    .avatar-status {
+        position: absolute;
+        right: 0;
+        bottom: 0;
+        display: block;
+        width: $status-width;
+        height: $status-width;
+        border: 1px solid #fff;
+        border-radius: 50em;
+    }
+}
+
+@mixin borders($borders) {
+    @each $border in $borders {
+        $direction: nth($border, 1);
+        @if $direction == "all" {
+            $size: map-get(map-get($borders, $direction), size);
+            $style: map-get(map-get($borders, $direction), style);
+            $color: map-get(map-get($borders, $direction), color);
+            border: $size $style $color;
+        } @else if $direction == "top" {
+            $size: map-get(map-get($borders, $direction), size);
+            $style: map-get(map-get($borders, $direction), style);
+            $color: map-get(map-get($borders, $direction), color);
+            border-top: $size $style $color;
+        } @else if $direction == "right" {
+            $size: map-get(map-get($borders, $direction), size);
+            $style: map-get(map-get($borders, $direction), style);
+            $color: map-get(map-get($borders, $direction), color);
+            border-right: $size $style $color;
+        } @else if $direction == "bottom" {
+            $size: map-get(map-get($borders, $direction), size);
+            $style: map-get(map-get($borders, $direction), style);
+            $color: map-get(map-get($borders, $direction), color);
+            border-bottom: $size $style $color;
+        } @else if $direction == "left" {
+            $size: map-get(map-get($borders, $direction), size);
+            $style: map-get(map-get($borders, $direction), style);
+            $color: map-get(map-get($borders, $direction), color);
+            border-left: $size $style $color;
+        }
+    }
+}
+
+@mixin sidebar-width($borders, $width) {
+    $sidebar-width: $width;
+
+    @each $border in $borders {
+        $direction: nth($border, 1);
+        @if $direction == "all" {
+            $size: map-get(map-get($borders, $direction), size);
+            $sidebar-width: ($sidebar-width - (2 * $size));
+        } @else if $direction == "right" {
+            $size: map-get(map-get($borders, $direction), size);
+            $sidebar-width: $sidebar-width - $size;
+        } @else if $direction == "left" {
+            $size: map-get(map-get($borders, $direction), size);
+            $sidebar-width: $sidebar-width - $size;
+        }
+        width: $sidebar-width;
+    }
+}
+
+@mixin bg-variant($parent, $color) {
+    #{"" + $parent} {
+        @include border-radius(
+            $card-border-radius-inner $card-border-radius-inner $card-border-radius-inner $card-border-radius-inner
+        );
+        color: #fff !important;
+        background-color: $color !important;
+    }
+    a#{"" + $parent} {
+        @include hover-focus {
+            background-color: darken($color, 10%);
+        }
+    }
+}
+
+@mixin card-accent-variant($color) {
+    border-top-width: 2px;
+    border-top-color: $color;
+}
+
+@mixin tabs-style($color) {
+    display: inline-block;
+    margin-right: 20px;
+    font-size: 16px;
+    color: $color;
+}
+
+@mixin fit-content() {
+    width: fit-content !important;
+    width: -moz-max-content !important;
+}
+
+@mixin fit-content-height() {
+    height: fit-content !important;
+    height: -moz-max-content !important;
+}
+
+@mixin label($fontSize, $fontWeight, $fontStyle, $letterSpacing, $color) {
+    font-family: Roboto;
+    font-size: $fontSize;
+    font-weight: normal;
+    font-stretch: normal;
+    font-style: $fontStyle;
+    line-height: normal;
+    letter-spacing: $letterSpacing;
+    color: $color;
+}
+
+@mixin modal-btn($background-color) {
+    width: 100%;
+    background-color: $background-color;
+    color: white;
+    border-radius: initial;
+}
+
+@mixin OrderListingTableStyling {
+    width: 100%;
+    tr {
+        border: 1px solid #d4d4d4;
+        border-top: none;
+        th {
+            color: #4a4a4a;
+            font-size: 11px;
+            font-weight: 500;
+            letter-spacing: 0.3px;
+            vertical-align: middle;
+            text-align: left;
+            // position: sticky;
+            // // z-index: 101 !important;
+            // top: 0px;
+            padding: unset;
+            height: 30px;
+            // line-height: 30px;
+            border-top: 1px solid #d4d4d4;
+        }
+        &.header-row th {
+            background-color: #ededed;
+        }
+        td {
+            font-size: 12px;
+            padding: 2px 0px 3px;
+            vertical-align: middle;
+            text-align: left;
+            color: #000000;
+            letter-spacing: 0px;
+        }
+    }
+}

package/src/lib/anna-common-scss/_modal.scss

@@ -1,37 +1,37 @@
-.modal-header {
-    height: 72px;
-    background-color: #3f4961;
-    background-position: center center;
-    background-size: cover;
-    font-weight: 300;
-    border-top-left-radius: 5px;
-    border-top-right-radius: 5px;
-}
-
-.modal-title {
-    color: #ffffff;
-    font-size: 18px;
-    font-weight: 400 !important;
-    position: absolute;
-    top: 40px;
-    text-align: left;
-}
-
-.modal-dialog {
-    font-family: Roboto !important;
-    top: 100px !important;
-    margin: 0 auto;
-}
-
-.modal-content {
-    border-radius: 7px;
-    width: fit-content;
-    min-width: 100%;
-}
-
-.modal-body {
-    padding: 24px;
-}
-.fade {
-    transition: none !important;
-}
+.modal-header {
+    height: 72px;
+    background-color: #3f4961;
+    background-position: center center;
+    background-size: cover;
+    font-weight: 300;
+    border-top-left-radius: 5px;
+    border-top-right-radius: 5px;
+}
+
+.modal-title {
+    color: #ffffff;
+    font-size: 18px;
+    font-weight: 400 !important;
+    position: absolute;
+    top: 40px;
+    text-align: left;
+}
+
+.modal-dialog {
+    font-family: Roboto !important;
+    top: 100px !important;
+    margin: 0 auto;
+}
+
+.modal-content {
+    border-radius: 7px;
+    width: fit-content;
+    min-width: 100%;
+}
+
+.modal-body {
+    padding: 24px;
+}
+.fade {
+    transition: none !important;
+}