npm - @syncfusion/blazor-themes - Versions diffs - 26.1.42 → 26.2.5 - Mend

@syncfusion/blazor-themes 26.1.42 → 26.2.5

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 (308) hide show

package/SCSS-Themes/buttons/button/bds-dark.scss CHANGED Viewed

@@ -2732,7 +2732,7 @@ $btn-warning-focus-box-shadow: $warning-shadow-focus !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2765,7 +2765,7 @@ $btn-warning-focus-box-shadow: $warning-shadow-focus !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/bds.scss CHANGED Viewed

@@ -2732,7 +2732,7 @@ $btn-warning-focus-box-shadow: $warning-shadow-focus !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2765,7 +2765,7 @@ $btn-warning-focus-box-shadow: $warning-shadow-focus !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/bootstrap-dark.scss CHANGED Viewed

@@ -2666,7 +2666,7 @@ $btn-focus-box-shadow: none !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2699,7 +2699,7 @@ $btn-focus-box-shadow: none !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/bootstrap.scss CHANGED Viewed

@@ -2621,7 +2621,7 @@ $btn-focus-box-shadow: none !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2654,7 +2654,7 @@ $btn-focus-box-shadow: none !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/bootstrap4.scss CHANGED Viewed

@@ -2669,7 +2669,7 @@ $btn-focus-box-shadow: none !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2702,7 +2702,7 @@ $btn-focus-box-shadow: none !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/bootstrap5-dark.scss CHANGED Viewed

@@ -2677,7 +2677,7 @@ $btn-warning-focus-box-shadow: $warning-shadow-focus !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2710,7 +2710,7 @@ $btn-warning-focus-box-shadow: $warning-shadow-focus !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/bootstrap5.scss CHANGED Viewed

@@ -2677,7 +2677,7 @@ $btn-warning-focus-box-shadow: $warning-shadow-focus !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2710,7 +2710,7 @@ $btn-warning-focus-box-shadow: $warning-shadow-focus !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/fabric-dark.scss CHANGED Viewed

@@ -2624,7 +2624,7 @@ $btn-focus-box-shadow: none !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2657,7 +2657,7 @@ $btn-focus-box-shadow: none !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/fabric.scss CHANGED Viewed

@@ -2621,7 +2621,7 @@ $btn-focus-box-shadow: none !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2654,7 +2654,7 @@ $btn-focus-box-shadow: none !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/fluent-dark.scss CHANGED Viewed

@@ -2677,7 +2677,7 @@ $btn-warning-focus-box-shadow: $shadow-none !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2710,7 +2710,7 @@ $btn-warning-focus-box-shadow: $shadow-none !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/fluent.scss CHANGED Viewed

@@ -2677,7 +2677,7 @@ $btn-warning-focus-box-shadow: $shadow-none !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2710,7 +2710,7 @@ $btn-warning-focus-box-shadow: $shadow-none !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/fluent2-dark.scss CHANGED Viewed

@@ -2691,7 +2691,7 @@ $btn-keyboard-focus-border-color: $shadow-color !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2724,7 +2724,7 @@ $btn-keyboard-focus-border-color: $shadow-color !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/fluent2.scss CHANGED Viewed

@@ -2691,7 +2691,7 @@ $btn-keyboard-focus-border-color: $shadow-color !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2724,7 +2724,7 @@ $btn-keyboard-focus-border-color: $shadow-color !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/highcontrast.scss CHANGED Viewed

@@ -2644,7 +2644,7 @@ $btn-focus-box-shadow: none !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2677,7 +2677,7 @@ $btn-focus-box-shadow: none !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/material-dark.scss CHANGED Viewed

@@ -2667,7 +2667,7 @@ $btn-focus-box-shadow: none !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2700,7 +2700,7 @@ $btn-focus-box-shadow: none !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/material.scss CHANGED Viewed

@@ -2623,7 +2623,7 @@ $btn-focus-box-shadow: none !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2656,7 +2656,7 @@ $btn-focus-box-shadow: none !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/material3-dark.scss CHANGED Viewed

@@ -2693,7 +2693,7 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2726,7 +2726,7 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/material3.scss CHANGED Viewed

@@ -2693,7 +2693,7 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2726,7 +2726,7 @@ $btn-keyboard-focus-box-shadow: $shadow-focus-ring1 !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/tailwind-dark.scss CHANGED Viewed

@@ -2670,7 +2670,7 @@ $btn-focus-box-shadow: $shadow-focus-ring2 !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2703,7 +2703,7 @@ $btn-focus-box-shadow: $shadow-focus-ring2 !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/button/tailwind.scss CHANGED Viewed

@@ -2670,7 +2670,7 @@ $btn-focus-box-shadow: $shadow-focus-ring2 !default;
           @if $skin-name == 'fluent2' {
             background: transparent;
             border-color: $secondary-border-color-hover;
-            color: $secondary-text-color-hover;
+            color: $secondary-outline-button-text-color-pressed;
           }
           @if $skin-name == 'bootstrap5' {
@@ -2703,7 +2703,7 @@ $btn-focus-box-shadow: $shadow-focus-ring2 !default;
           @include outline-active;
           @if $skin-name == 'fluent2' {
             background: transparent;
-            color: $secondary-text-color-selected;
+            color: $secondary-outline-button-text-color-pressed;
             outline: 2px solid;
             outline-offset: -2px;
           }

package/SCSS-Themes/buttons/speed-dial/bds-dark.scss CHANGED Viewed

@@ -220,6 +220,7 @@ $sd-active-font-color: $secondary-text-color !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/bds.scss CHANGED Viewed

@@ -220,6 +220,7 @@ $sd-active-font-color: $secondary-text-color !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/bootstrap-dark.scss CHANGED Viewed

@@ -219,6 +219,7 @@ $sd-active-font-color: $grey-light-font !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/bootstrap.scss CHANGED Viewed

@@ -219,6 +219,7 @@ $sd-active-font-color: #000000 !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/bootstrap4.scss CHANGED Viewed

@@ -219,6 +219,7 @@ $sd-active-font-color: $secondary !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/bootstrap5-dark.scss CHANGED Viewed

@@ -220,6 +220,7 @@ $sd-active-font-color: $content-text-color-focus !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/bootstrap5.scss CHANGED Viewed

@@ -220,6 +220,7 @@ $sd-active-font-color: $content-text-color-focus !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/fabric-dark.scss CHANGED Viewed

@@ -219,6 +219,7 @@ $sd-active-font-color: $neutral-light-fontalt !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/fabric.scss CHANGED Viewed

@@ -219,6 +219,7 @@ $sd-active-font-color: $neutral-light-fontalt !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/fluent-dark.scss CHANGED Viewed

@@ -220,6 +220,7 @@ $sd-active-font-color: $secondary-text-color-pressed !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/fluent.scss CHANGED Viewed

@@ -220,6 +220,7 @@ $sd-active-font-color: $secondary-text-color-pressed !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/fluent2-dark.scss CHANGED Viewed

@@ -220,6 +220,7 @@ $sd-active-font-color: $secondary-text-color-pressed !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/fluent2.scss CHANGED Viewed

@@ -220,6 +220,7 @@ $sd-active-font-color: $secondary-text-color-pressed !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/highcontrast.scss CHANGED Viewed

@@ -220,6 +220,7 @@ $sd-active-font-color: $selection-font !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/material-dark.scss CHANGED Viewed

@@ -219,6 +219,7 @@ $sd-active-font-color: $grey-dark-font !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/material.scss CHANGED Viewed

@@ -219,6 +219,7 @@ $sd-active-font-color: $base-font !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/material3-dark.scss CHANGED Viewed

@@ -220,6 +220,7 @@ $sd-active-font-color: $sd-font-color !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/material3.scss CHANGED Viewed

@@ -220,6 +220,7 @@ $sd-active-font-color: $sd-font-color !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/tailwind-dark.scss CHANGED Viewed

@@ -220,6 +220,7 @@ $sd-active-font-color: $secondary-text-color !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/buttons/speed-dial/tailwind.scss CHANGED Viewed

@@ -220,6 +220,7 @@ $sd-active-font-color: $secondary-text-color !default;
           font-size: 12px;
           line-height: 16px;
           padding: 8px 16px;
+          box-sizing: content-box;
         }
       }
     }

package/SCSS-Themes/dropdowns/list-box/bds-dark.scss CHANGED Viewed

@@ -194,19 +194,6 @@ $listbox-ej2-filterselect-bigger-height: calc(100% - 106px) !default;
       text-align: center;
     }
-    &:not(.e-list-template) .e-list-item,
-    .e-list-nrt,
-    .e-selectall-parent {
-      height: $listbox-item-height;
-      line-height: $listbox-item-line-height;
-      padding: $listbox-item-padding;
-      position: relative;
-      @if $skin-name == 'fluent2' {
-        font-size: 14px;
-        border-radius: 4px !important; /* stylelint-disable-line declaration-no-important */
-      }
-    }
     .e-list-parent {
       height: 100%;
       min-height: $listbox-item-height;
@@ -708,6 +695,23 @@ $listbox-ej2-filterselect-bigger-height: calc(100% - 106px) !default;
   }
 }
+.e-listbox-wrapper,
+.e-listbox-container,
+.e-listboxtool-wrapper .e-listbox-wrapper {
+  &:not(.e-list-template) .e-list-item,
+  .e-list-nrt,
+  .e-selectall-parent {
+    height: $listbox-item-height;
+    line-height: $listbox-item-line-height;
+    padding: $listbox-item-padding;
+    position: relative;
+    @if $skin-name == 'fluent2' {
+      font-size: 14px;
+      border-radius: 4px !important; /* stylelint-disable-line declaration-no-important */
+    }
+  }
+}
 @mixin avatar {
   height: $listbox-template-avatar-size;

package/SCSS-Themes/dropdowns/list-box/bds.scss CHANGED Viewed

@@ -194,19 +194,6 @@ $listbox-ej2-filterselect-bigger-height: calc(100% - 106px) !default;
       text-align: center;
     }
-    &:not(.e-list-template) .e-list-item,
-    .e-list-nrt,
-    .e-selectall-parent {
-      height: $listbox-item-height;
-      line-height: $listbox-item-line-height;
-      padding: $listbox-item-padding;
-      position: relative;
-      @if $skin-name == 'fluent2' {
-        font-size: 14px;
-        border-radius: 4px !important; /* stylelint-disable-line declaration-no-important */
-      }
-    }
     .e-list-parent {
       height: 100%;
       min-height: $listbox-item-height;
@@ -708,6 +695,23 @@ $listbox-ej2-filterselect-bigger-height: calc(100% - 106px) !default;
   }
 }
+.e-listbox-wrapper,
+.e-listbox-container,
+.e-listboxtool-wrapper .e-listbox-wrapper {
+  &:not(.e-list-template) .e-list-item,
+  .e-list-nrt,
+  .e-selectall-parent {
+    height: $listbox-item-height;
+    line-height: $listbox-item-line-height;
+    padding: $listbox-item-padding;
+    position: relative;
+    @if $skin-name == 'fluent2' {
+      font-size: 14px;
+      border-radius: 4px !important; /* stylelint-disable-line declaration-no-important */
+    }
+  }
+}
 @mixin avatar {
   height: $listbox-template-avatar-size;