@annalib/anna-core 25.2.13 → 25.2.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@annalib/anna-core",
-  "version": "25.2.13",
+  "version": "25.2.15",
   "peerDependencies": {
     "@angular-slider/ngx-slider": "^16.0.1",
     "@angular/common": "^16.2.12",

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

@@ -1,7 +1,7 @@
 @import "./colors", "./fonts";
 
 #dropdown-trigger {
-    height: 1.875rem;
+    height: 1.5rem;
     background: white;
     border-radius: 2px;
     border: 1px solid $lightGray-8;
@@ -22,7 +22,7 @@
 .placeholder {
     color: $gray74;
     width: 100%;
-    @include fonts(Roboto, 14px, normal, normal, normal, normal, normal);
+    @include fonts(Roboto, var(--dropdown-text-fs), normal, normal, normal, normal, normal);
 }
 
 // #dropdown-trigger:disabled .placeholder {
@@ -38,7 +38,7 @@
 .search-bar {
     margin: 0 7px 8px 7px;
     border: 1px solid $pinkSwan;
-    height: 1.875rem;
+    height: 24px;
     border-radius: 2px;
     input {
         outline: none;
@@ -46,10 +46,11 @@
         position: relative;
         bottom: 4px;
         width: calc(100% - 29px);
+        font-size: var(--dropdown-text-fs);
     }
 
     .search-icon {
-        font-size: 1.125rem;
+        font-size: var(--multi-select-dropdown-checkbox-fs);
         color: $lightGray-7;
         margin: 5px;
     }
@@ -71,7 +72,7 @@ li {
     list-style-type: none;
     cursor: pointer;
     padding-inline: 10px;
-    @include fonts(Roboto, 14px, normal, normal, normal, 2.14, normal);
+    @include fonts(Roboto, var(--dropdown-text-fs), normal, normal, normal, 2.14, normal);
     color: #4a4a4a;
     @extend .ellipsify;
     width: 100%;
@@ -104,7 +105,7 @@ li.active {
 
 span.selected-item {
     background: transparent;
-    @include fonts(Roboto, 14px, normal, normal, normal, normal, normal);
+    @include fonts(Roboto, var(--dropdown-text-fs), normal, normal, normal, normal, normal);
     color: #4a4a4a;
     @extend .ellipsify;
     width: calc(100% - 22px);

package/src/lib/anna-common-scss/_easy-filter.scss

@@ -13,9 +13,9 @@ $intelli-filter-default-map: (
 
 @mixin intelli-filter-default($padding: 5px 8px) {
     button.intelli-filter {
-        @include fonts(Roboto, 0.75rem, normal, 500, normal, normal, 0.6px);
+        @include fonts(Roboto, var(--easy-filter-text-fs), normal, 500, normal, normal, 0.6px);
         border-radius: 0.75rem;
-        height: 1.5rem;
+        height: 1.25rem;
         margin-right: 8px;
         display: inline-flex;
         align-items: center;
@@ -70,7 +70,7 @@ $only-enabled-default-map: (
 }
 
 $intelli-filter-icon-default-map: (
-    "icon-font-size": 14.5px,
+    "icon-font-size": var(--easy-filter-icon-fs),
     "icon-margin-right": 4px,
     "active-icon-color": white,
 );
@@ -124,14 +124,14 @@ $intelli-filter-icon-default-map: (
 }
 
 .filter-label {
-    @include fonts(Roboto, 0.875rem, normal, normal, normal, normal, normal);
+    @include fonts(Roboto, var(--easy-filter-label-fs), normal, normal, normal, normal, normal);
     color: $charcoal;
-    margin-bottom: 4px;
+    margin-bottom: 0px;
 }
 
 .filter-divider {
     width: 0.5px;
     margin-right: 8px;
-    height: 24px;
+    height: 20px;
     background: #111;
 }

package/src/lib/anna-common-scss/_edit-filter-popup.scss

@@ -10,7 +10,7 @@ $gap-between-headers-col: 1.5625rem !default;
     display: flex;
     flex-wrap: nowrap;
     justify-content: space-between;
-    height: 3.25rem;
+    height: 46px;
 }
 
 .filter-view {
@@ -21,13 +21,19 @@ $gap-between-headers-col: 1.5625rem !default;
 .header {
     margin-bottom: 0;
     color: c.$darkCharcoal;
-    @include f.fonts(Roboto, 0.75rem, normal, normal, normal, normal, normal);
+    @include f.fonts(Roboto, var(--primary-filter-label-fs), normal, normal, normal, normal, normal);
+}
+
+.popup-dropdown-label {
+    margin-bottom: 0;
+    color: c.$darkCharcoal;
+    @include f.fonts(Roboto, var(--dropdown-label-fs), normal, normal, normal, normal, normal);
 }
 
 .selected-value {
     margin-bottom: 0;
     color: c.$grey;
-    @include f.fonts(Roboto, 0.875rem, normal, bold, normal, 1.14, normal);
+    @include f.fonts(Roboto, var(--primary-filter-value-fs), normal, bold, normal, normal, normal);
 }
 
 @mixin filter-popup-modal-header() {

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

@@ -240,7 +240,7 @@ div.radio-container {
 
 .search-icon {
     margin: 0 4px 0 0;
-    font-size: $fs-18;
+    font-size: var(--filter-search-icon-fs);
     color: $lightGray-7;
 }
 
@@ -255,13 +255,13 @@ div.radio-container {
 
 .data {
     margin: 0 13px 0px 8px;
-    @include fonts(Roboto, $fs-14, normal, normal, normal, 1.86, "");
+    @include fonts(Roboto, var(--filter-checkbox-label-fs), normal, normal, normal, 1.86, "");
     color: $charcoal;
 }
 
 .search-input {
     margin: 1px 0 1px 4px;
-    @include fonts(Roboto, $fs-14, normal, normal, normal, normal, normal);
+    @include fonts(Roboto, var(--filter-search-fs), normal, normal, normal, normal, normal);
     color: $lightGray-6;
     width: calc(100% - 38px);
     margin-left: 2px;
@@ -342,7 +342,7 @@ section.min-maxContainer {
     width: 100%;
     input {
         width: 30%;
-        height: $fs-30;
+        height: 1.5rem;
         border: 1px solid lightgray;
         color: gray;
     }
@@ -353,6 +353,7 @@ section.min-maxContainer {
         position: relative;
         top: $fs-5;
         color: $lightDimGray;
+        font-size: var(--page-message-content-fs);
     }
 }
 
@@ -382,12 +383,12 @@ section.min-maxContainer {
         margin-top: $fs-6;
         width: 9px;
         height: 18px;
-        margin-right: $fs-19;
+        margin-right: 0.875rem;
         i {
             color: black;
             cursor: pointer;
             max-height: 9px;
-            font-size: 25px;
+            font-size: 20px;
             width: 10px;
             &:before {
                 width: 0;
@@ -417,6 +418,7 @@ section.min-maxContainer {
         margin-top: 0.125rem;
         margin-left: $fs-12;
         font-weight: 700;
+        font-size: var(--dropdown-label-fs);
     }
 }
 
@@ -433,7 +435,7 @@ section.min-maxContainer {
     width: 94%;
     text-align: center;
     border: none;
-    font-size: 14px;
+    font-size: var(--filter-clear-select-btn-fs);
     background: none;
     text-decoration: underline;
     color: $primary-color;
@@ -496,7 +498,7 @@ span.mdi-filter-variant.active {
 }
 
 p.filter-tab {
-    @include fonts(Roboto, 14px, normal, normal, normal, 1.29, normal);
+    @include fonts(Roboto, var(--filter-tab-fs), normal, normal, normal, 1.29, normal);
     color: #1b88ff;
     border-radius: 5px;
     background-color: #f4f4f4;
@@ -505,6 +507,7 @@ p.filter-tab {
     overflow: hidden;
     text-align: center;
     text-overflow: ellipsis;
+    padding-block: 3px;
 }
 
 p.filter-tab.active {
@@ -515,7 +518,7 @@ p.filter-tab.active {
 button.filter-text-btn {
     background: white;
     text-decoration: underline;
-    @include fonts(Roboto, 14px, normal, normal, normal, normal, normal);
+    @include fonts(Roboto, var(--filter-clear-select-btn-fs), normal, normal, normal, normal, normal);
     border: none;
     color: #268bff;
     &:disabled {
@@ -695,7 +698,7 @@ input.error-border {
 
 .no-data-case {
     padding-left: 0.4375rem !important;
-    font-size: 0.875rem !important;
+    font-size: var(--filter-checkbox-label-fs) !important;
     margin-top: 10px !important;
     cursor: pointer;
 }

package/src/lib/anna-common-scss/_generic-table-common.scss

@@ -50,7 +50,7 @@
     text-decoration: underline;
     color: #268bff;
     line-height: 1 !important;
-    font-size: 14px !important;
+    font-size: var(--reset-all-filter-fs) !important;
     letter-spacing: normal !important;
     font-weight: normal !important;