npm - @syncfusion/blazor-themes - Versions diffs - 31.1.20 → 31.1.21 - Mend

@syncfusion/blazor-themes 31.1.20 → 31.1.21

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

package/SCSS-Themes/navigations/treeview/bootstrap5-dark.scss CHANGED Viewed

@@ -11,7 +11,7 @@ $treeview-font-size: $text-sm !default;
 $treeview-icon-font-size: $text-xl !default;
 $treeview-image-font-size: $text-xl !default;
 $treeview-item-height: 36px !default;
-$treeview-text-height: 34px !default;
+$treeview-text-height: 22px !default;
 $treeview-input-height: 30px !default;
 $treeview-root-ul-padding: 0 0 0 12px !default;
 $treeview-rtl-root-ul-padding: 0 12px 0 0 !default;
@@ -23,7 +23,7 @@ $treeview-icon-size: 20px !default;
 $treeview-icon-margin: 0 4px 0 -24px !default;
 $treeview-rtl-icon-margin: 0 -20px 0 0 !default;
 $treeview-icon-padding: 0px !default;
-$treeview-text-padding: 0 8px !default;
+$treeview-text-padding: 7px 8px !default;
 $treeview-text-margin: 0 !default;
 $treeview-image-size: 20px !default;
 $treeview-image-margin: 0 0 0 8px !default;
@@ -33,12 +33,12 @@ $treeview-navigable-icon-image-anchor-margin: 0 8px 0 0 !default;
 $treeview-navigable-icon-image-anchor-margin-reverse: 0 0 0 8px !default;
 $treeview-navigable-rtl-margin-reverse: 0 12px 0 0 !default;
 $treeview-rtl-image-margin: 0 8px 0 0 !default;
-$treeview-image-text-padding: 0 8px !default;
+$treeview-image-text-padding: 7px 8px !default;
 $treeview-icon-image-margin: 0 0 0 8px !default;
 $treeview-rtl-icon-image-margin: 0 8px 0 0 !default;
 $treeview-check-margin: 0 0 0 12px !default;
 $treeview-rtl-check-margin: 0 12px 0 0 !default;
-$treeview-check-text-padding: 0 8px !default;
+$treeview-check-text-padding: 7px 8px !default;
 $treeview-check-image-margin: 0 0 0 8px !default;
 $treeview-rtl-check-image-margin: 0 8px 0 0 !default;
 $treeview-drop-count-border-size: 1px !default;
@@ -377,6 +377,10 @@ $treeview-item-active-check-color: $primary !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -494,10 +498,6 @@ $treeview-item-active-check-color: $primary !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }
@@ -1547,8 +1547,7 @@ $treeview-item-active-check-color: $primary !default;
       }
       @if $skin-name == 'highcontrast' {
-        padding-top: 11px;
-        padding-bottom: 11px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'material' or $skin-name == 'material-dark' {
@@ -1557,8 +1556,7 @@ $treeview-item-active-check-color: $primary !default;
       }
       @if $skin-name == 'FluentUI' {
-        padding-top: 10px;
-        padding-bottom: 10px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'bootstrap4' {

package/SCSS-Themes/navigations/treeview/bootstrap5-lite.scss CHANGED Viewed

@@ -11,7 +11,7 @@ $treeview-font-size: $text-sm !default;
 $treeview-icon-font-size: $text-xl !default;
 $treeview-image-font-size: $text-xl !default;
 $treeview-item-height: 36px !default;
-$treeview-text-height: 34px !default;
+$treeview-text-height: 22px !default;
 $treeview-input-height: 30px !default;
 $treeview-root-ul-padding: 0 0 0 12px !default;
 $treeview-rtl-root-ul-padding: 0 12px 0 0 !default;
@@ -23,7 +23,7 @@ $treeview-icon-size: 20px !default;
 $treeview-icon-margin: 0 4px 0 -24px !default;
 $treeview-rtl-icon-margin: 0 -20px 0 0 !default;
 $treeview-icon-padding: 0px !default;
-$treeview-text-padding: 0 8px !default;
+$treeview-text-padding: 7px 8px !default;
 $treeview-text-margin: 0 !default;
 $treeview-image-size: 20px !default;
 $treeview-image-margin: 0 0 0 8px !default;
@@ -33,12 +33,12 @@ $treeview-navigable-icon-image-anchor-margin: 0 8px 0 0 !default;
 $treeview-navigable-icon-image-anchor-margin-reverse: 0 0 0 8px !default;
 $treeview-navigable-rtl-margin-reverse: 0 12px 0 0 !default;
 $treeview-rtl-image-margin: 0 8px 0 0 !default;
-$treeview-image-text-padding: 0 8px !default;
+$treeview-image-text-padding: 7px 8px !default;
 $treeview-icon-image-margin: 0 0 0 8px !default;
 $treeview-rtl-icon-image-margin: 0 8px 0 0 !default;
 $treeview-check-margin: 0 0 0 12px !default;
 $treeview-rtl-check-margin: 0 12px 0 0 !default;
-$treeview-check-text-padding: 0 8px !default;
+$treeview-check-text-padding: 7px 8px !default;
 $treeview-check-image-margin: 0 0 0 8px !default;
 $treeview-rtl-check-image-margin: 0 8px 0 0 !default;
 $treeview-drop-count-border-size: 1px !default;
@@ -377,6 +377,10 @@ $treeview-item-active-check-color: $primary !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -494,10 +498,6 @@ $treeview-item-active-check-color: $primary !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }

package/SCSS-Themes/navigations/treeview/bootstrap5.3-dark-lite.scss CHANGED Viewed

@@ -32,7 +32,7 @@ $treeview-navigable-icon-image-anchor-margin: 0 8px 0 0 !default;
 $treeview-navigable-icon-image-anchor-margin-reverse: 0 0 0 8px !default;
 $treeview-navigable-rtl-margin-reverse: 0 12px 0 0 !default;
 $treeview-rtl-image-margin: 0 8px 0 0 !default;
-$treeview-image-text-padding: 0 12px !default;
+$treeview-image-text-padding: 7px 12px !default;
 $treeview-icon-image-margin: 0 0 0 8px !default;
 $treeview-rtl-icon-image-margin: 0 8px 0 0 !default;
 $treeview-check-margin: 0 0 0 8px !default;
@@ -375,6 +375,10 @@ $treeview-item-active-check-color: $primary !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -492,10 +496,6 @@ $treeview-item-active-check-color: $primary !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }

package/SCSS-Themes/navigations/treeview/bootstrap5.3-dark.scss CHANGED Viewed

@@ -32,7 +32,7 @@ $treeview-navigable-icon-image-anchor-margin: 0 8px 0 0 !default;
 $treeview-navigable-icon-image-anchor-margin-reverse: 0 0 0 8px !default;
 $treeview-navigable-rtl-margin-reverse: 0 12px 0 0 !default;
 $treeview-rtl-image-margin: 0 8px 0 0 !default;
-$treeview-image-text-padding: 0 12px !default;
+$treeview-image-text-padding: 7px 12px !default;
 $treeview-icon-image-margin: 0 0 0 8px !default;
 $treeview-rtl-icon-image-margin: 0 8px 0 0 !default;
 $treeview-check-margin: 0 0 0 8px !default;
@@ -375,6 +375,10 @@ $treeview-item-active-check-color: $primary !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -492,10 +496,6 @@ $treeview-item-active-check-color: $primary !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }
@@ -1545,8 +1545,7 @@ $treeview-item-active-check-color: $primary !default;
       }
       @if $skin-name == 'highcontrast' {
-        padding-top: 11px;
-        padding-bottom: 11px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'material' or $skin-name == 'material-dark' {
@@ -1555,8 +1554,7 @@ $treeview-item-active-check-color: $primary !default;
       }
       @if $skin-name == 'FluentUI' {
-        padding-top: 10px;
-        padding-bottom: 10px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'bootstrap4' {

package/SCSS-Themes/navigations/treeview/bootstrap5.3-lite.scss CHANGED Viewed

@@ -32,7 +32,7 @@ $treeview-navigable-icon-image-anchor-margin: 0 8px 0 0 !default;
 $treeview-navigable-icon-image-anchor-margin-reverse: 0 0 0 8px !default;
 $treeview-navigable-rtl-margin-reverse: 0 12px 0 0 !default;
 $treeview-rtl-image-margin: 0 8px 0 0 !default;
-$treeview-image-text-padding: 0 12px !default;
+$treeview-image-text-padding: 7px 12px !default;
 $treeview-icon-image-margin: 0 0 0 8px !default;
 $treeview-rtl-icon-image-margin: 0 8px 0 0 !default;
 $treeview-check-margin: 0 0 0 8px !default;
@@ -375,6 +375,10 @@ $treeview-item-active-check-color: $primary !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -492,10 +496,6 @@ $treeview-item-active-check-color: $primary !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }

package/SCSS-Themes/navigations/treeview/bootstrap5.3.scss CHANGED Viewed

@@ -32,7 +32,7 @@ $treeview-navigable-icon-image-anchor-margin: 0 8px 0 0 !default;
 $treeview-navigable-icon-image-anchor-margin-reverse: 0 0 0 8px !default;
 $treeview-navigable-rtl-margin-reverse: 0 12px 0 0 !default;
 $treeview-rtl-image-margin: 0 8px 0 0 !default;
-$treeview-image-text-padding: 0 12px !default;
+$treeview-image-text-padding: 7px 12px !default;
 $treeview-icon-image-margin: 0 0 0 8px !default;
 $treeview-rtl-icon-image-margin: 0 8px 0 0 !default;
 $treeview-check-margin: 0 0 0 8px !default;
@@ -375,6 +375,10 @@ $treeview-item-active-check-color: $primary !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -492,10 +496,6 @@ $treeview-item-active-check-color: $primary !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }
@@ -1545,8 +1545,7 @@ $treeview-item-active-check-color: $primary !default;
       }
       @if $skin-name == 'highcontrast' {
-        padding-top: 11px;
-        padding-bottom: 11px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'material' or $skin-name == 'material-dark' {
@@ -1555,8 +1554,7 @@ $treeview-item-active-check-color: $primary !default;
       }
       @if $skin-name == 'FluentUI' {
-        padding-top: 10px;
-        padding-bottom: 10px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'bootstrap4' {

package/SCSS-Themes/navigations/treeview/bootstrap5.scss CHANGED Viewed

@@ -11,7 +11,7 @@ $treeview-font-size: $text-sm !default;
 $treeview-icon-font-size: $text-xl !default;
 $treeview-image-font-size: $text-xl !default;
 $treeview-item-height: 36px !default;
-$treeview-text-height: 34px !default;
+$treeview-text-height: 22px !default;
 $treeview-input-height: 30px !default;
 $treeview-root-ul-padding: 0 0 0 12px !default;
 $treeview-rtl-root-ul-padding: 0 12px 0 0 !default;
@@ -23,7 +23,7 @@ $treeview-icon-size: 20px !default;
 $treeview-icon-margin: 0 4px 0 -24px !default;
 $treeview-rtl-icon-margin: 0 -20px 0 0 !default;
 $treeview-icon-padding: 0px !default;
-$treeview-text-padding: 0 8px !default;
+$treeview-text-padding: 7px 8px !default;
 $treeview-text-margin: 0 !default;
 $treeview-image-size: 20px !default;
 $treeview-image-margin: 0 0 0 8px !default;
@@ -33,12 +33,12 @@ $treeview-navigable-icon-image-anchor-margin: 0 8px 0 0 !default;
 $treeview-navigable-icon-image-anchor-margin-reverse: 0 0 0 8px !default;
 $treeview-navigable-rtl-margin-reverse: 0 12px 0 0 !default;
 $treeview-rtl-image-margin: 0 8px 0 0 !default;
-$treeview-image-text-padding: 0 8px !default;
+$treeview-image-text-padding: 7px 8px !default;
 $treeview-icon-image-margin: 0 0 0 8px !default;
 $treeview-rtl-icon-image-margin: 0 8px 0 0 !default;
 $treeview-check-margin: 0 0 0 12px !default;
 $treeview-rtl-check-margin: 0 12px 0 0 !default;
-$treeview-check-text-padding: 0 8px !default;
+$treeview-check-text-padding: 7px 8px !default;
 $treeview-check-image-margin: 0 0 0 8px !default;
 $treeview-rtl-check-image-margin: 0 8px 0 0 !default;
 $treeview-drop-count-border-size: 1px !default;
@@ -377,6 +377,10 @@ $treeview-item-active-check-color: $primary !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -494,10 +498,6 @@ $treeview-item-active-check-color: $primary !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }
@@ -1547,8 +1547,7 @@ $treeview-item-active-check-color: $primary !default;
       }
       @if $skin-name == 'highcontrast' {
-        padding-top: 11px;
-        padding-bottom: 11px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'material' or $skin-name == 'material-dark' {
@@ -1557,8 +1556,7 @@ $treeview-item-active-check-color: $primary !default;
       }
       @if $skin-name == 'FluentUI' {
-        padding-top: 10px;
-        padding-bottom: 10px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'bootstrap4' {

package/SCSS-Themes/navigations/treeview/fabric-dark-lite.scss CHANGED Viewed

@@ -371,6 +371,10 @@ $ripple-width: 32px !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -488,10 +492,6 @@ $ripple-width: 32px !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }

package/SCSS-Themes/navigations/treeview/fabric-dark.scss CHANGED Viewed

@@ -371,6 +371,10 @@ $ripple-width: 32px !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -488,10 +492,6 @@ $ripple-width: 32px !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }
@@ -1541,8 +1541,7 @@ $ripple-width: 32px !default;
       }
       @if $skin-name == 'highcontrast' {
-        padding-top: 11px;
-        padding-bottom: 11px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'material' or $skin-name == 'material-dark' {
@@ -1551,8 +1550,7 @@ $ripple-width: 32px !default;
       }
       @if $skin-name == 'FluentUI' {
-        padding-top: 10px;
-        padding-bottom: 10px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'bootstrap4' {

package/SCSS-Themes/navigations/treeview/fabric-lite.scss CHANGED Viewed

@@ -367,6 +367,10 @@ $ripple-width: 32px !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -484,10 +488,6 @@ $ripple-width: 32px !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }

package/SCSS-Themes/navigations/treeview/fabric.scss CHANGED Viewed

@@ -367,6 +367,10 @@ $ripple-width: 32px !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -484,10 +488,6 @@ $ripple-width: 32px !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }
@@ -1537,8 +1537,7 @@ $ripple-width: 32px !default;
       }
       @if $skin-name == 'highcontrast' {
-        padding-top: 11px;
-        padding-bottom: 11px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'material' or $skin-name == 'material-dark' {
@@ -1547,8 +1546,7 @@ $ripple-width: 32px !default;
       }
       @if $skin-name == 'FluentUI' {
-        padding-top: 10px;
-        padding-bottom: 10px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'bootstrap4' {

package/SCSS-Themes/navigations/treeview/fluent-dark-lite.scss CHANGED Viewed

@@ -33,7 +33,7 @@ $treeview-navigable-icon-image-anchor-margin: 0 12px 0 0 !default;
 $treeview-navigable-icon-image-anchor-margin-reverse: 0 0 0 12px !default;
 $treeview-navigable-rtl-margin-reverse: 0 16px 0 0 !default;
 $treeview-rtl-image-margin: 0 12px 0 0 !default;
-$treeview-image-text-padding: 0 12px !default;
+$treeview-image-text-padding: 8px 12px !default;
 $treeview-icon-image-margin: 0 0 0 12px !default;
 $treeview-rtl-icon-image-margin: 0 12px 0 0 !default;
 $treeview-check-margin: 0 0 0 12px !default;
@@ -55,7 +55,7 @@ $treeview-big-icon-font-size: $text-2xl !default;
 $treeview-big-item-height: 44px !default;
 $treeview-big-text-height: 24px !default;
 $treeview-big-input-height: 40px !default;
-$treeview-big-text-padding: 0 16px !default;
+$treeview-big-text-padding: 10px 16px !default;
 $treeview-big-input-padding: 0 9px !default;
 $treeview-big-icon-padding: 0px !default;
 $treeview-big-image-margin: 0 0 0 16px !default;
@@ -70,7 +70,7 @@ $treeview-big-root-ul-padding: 0 0 0 16px !default;
 $treeview-big-rtl-root-ul-padding: 0 16px 0 0 !default;
 $treeview-big-child-ul-padding: 0 0 0 24px !default;
 $treeview-big-rtl-child-ul-padding: 0 24px 0 0 !default;
-$treeview-big-image-text-padding: 0 16px !default;
+$treeview-big-image-text-padding: 10px 16px !default;
 $treeview-big-icon-margin: 0 0 0 -24px !default;
 $treeview-big-rtl-icon-margin: 0 -24px 0 0 !default;
 $treeview-big-text-wrap-padding: 0 0 0 24px !default;
@@ -377,6 +377,10 @@ $treeview-item-active-check-color: $primary !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -494,10 +498,6 @@ $treeview-item-active-check-color: $primary !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }

package/SCSS-Themes/navigations/treeview/fluent-dark.scss CHANGED Viewed

@@ -33,7 +33,7 @@ $treeview-navigable-icon-image-anchor-margin: 0 12px 0 0 !default;
 $treeview-navigable-icon-image-anchor-margin-reverse: 0 0 0 12px !default;
 $treeview-navigable-rtl-margin-reverse: 0 16px 0 0 !default;
 $treeview-rtl-image-margin: 0 12px 0 0 !default;
-$treeview-image-text-padding: 0 12px !default;
+$treeview-image-text-padding: 8px 12px !default;
 $treeview-icon-image-margin: 0 0 0 12px !default;
 $treeview-rtl-icon-image-margin: 0 12px 0 0 !default;
 $treeview-check-margin: 0 0 0 12px !default;
@@ -55,7 +55,7 @@ $treeview-big-icon-font-size: $text-2xl !default;
 $treeview-big-item-height: 44px !default;
 $treeview-big-text-height: 24px !default;
 $treeview-big-input-height: 40px !default;
-$treeview-big-text-padding: 0 16px !default;
+$treeview-big-text-padding: 10px 16px !default;
 $treeview-big-input-padding: 0 9px !default;
 $treeview-big-icon-padding: 0px !default;
 $treeview-big-image-margin: 0 0 0 16px !default;
@@ -70,7 +70,7 @@ $treeview-big-root-ul-padding: 0 0 0 16px !default;
 $treeview-big-rtl-root-ul-padding: 0 16px 0 0 !default;
 $treeview-big-child-ul-padding: 0 0 0 24px !default;
 $treeview-big-rtl-child-ul-padding: 0 24px 0 0 !default;
-$treeview-big-image-text-padding: 0 16px !default;
+$treeview-big-image-text-padding: 10px 16px !default;
 $treeview-big-icon-margin: 0 0 0 -24px !default;
 $treeview-big-rtl-icon-margin: 0 -24px 0 0 !default;
 $treeview-big-text-wrap-padding: 0 0 0 24px !default;
@@ -377,6 +377,10 @@ $treeview-item-active-check-color: $primary !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -494,10 +498,6 @@ $treeview-item-active-check-color: $primary !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }
@@ -1547,8 +1547,7 @@ $treeview-item-active-check-color: $primary !default;
       }
       @if $skin-name == 'highcontrast' {
-        padding-top: 11px;
-        padding-bottom: 11px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'material' or $skin-name == 'material-dark' {
@@ -1557,8 +1556,7 @@ $treeview-item-active-check-color: $primary !default;
       }
       @if $skin-name == 'FluentUI' {
-        padding-top: 10px;
-        padding-bottom: 10px;
+        padding: $treeview-big-text-padding;
       }
       @if $skin-name == 'bootstrap4' {

package/SCSS-Themes/navigations/treeview/fluent-lite.scss CHANGED Viewed

@@ -33,7 +33,7 @@ $treeview-navigable-icon-image-anchor-margin: 0 12px 0 0 !default;
 $treeview-navigable-icon-image-anchor-margin-reverse: 0 0 0 12px !default;
 $treeview-navigable-rtl-margin-reverse: 0 16px 0 0 !default;
 $treeview-rtl-image-margin: 0 12px 0 0 !default;
-$treeview-image-text-padding: 0 12px !default;
+$treeview-image-text-padding: 8px 12px !default;
 $treeview-icon-image-margin: 0 0 0 12px !default;
 $treeview-rtl-icon-image-margin: 0 12px 0 0 !default;
 $treeview-check-margin: 0 0 0 12px !default;
@@ -55,7 +55,7 @@ $treeview-big-icon-font-size: $text-2xl !default;
 $treeview-big-item-height: 44px !default;
 $treeview-big-text-height: 24px !default;
 $treeview-big-input-height: 40px !default;
-$treeview-big-text-padding: 0 16px !default;
+$treeview-big-text-padding: 10px 16px !default;
 $treeview-big-input-padding: 0 9px !default;
 $treeview-big-icon-padding: 0px !default;
 $treeview-big-image-margin: 0 0 0 16px !default;
@@ -70,7 +70,7 @@ $treeview-big-root-ul-padding: 0 0 0 16px !default;
 $treeview-big-rtl-root-ul-padding: 0 16px 0 0 !default;
 $treeview-big-child-ul-padding: 0 0 0 24px !default;
 $treeview-big-rtl-child-ul-padding: 0 24px 0 0 !default;
-$treeview-big-image-text-padding: 0 16px !default;
+$treeview-big-image-text-padding: 10px 16px !default;
 $treeview-big-icon-margin: 0 0 0 -24px !default;
 $treeview-big-rtl-icon-margin: 0 -24px 0 0 !default;
 $treeview-big-text-wrap-padding: 0 0 0 24px !default;
@@ -377,6 +377,10 @@ $treeview-item-active-check-color: $primary !default;
               padding-top: 5px;
               padding-bottom: 5px;
             }
+            @if $skin-name == 'bootstrap5' {
+              padding-top: 3px;
+              padding-bottom: 3px;
+            }
           }
         }
       }
@@ -494,10 +498,6 @@ $treeview-item-active-check-color: $primary !default;
           margin-top: 4px;
           margin-bottom: 4px;
         }
-        @else if($skin-name == 'bootstrap5') {
-          margin-bottom: 3px;
-          margin-top: 3px;
-        }
         @else {
           margin-bottom: 0;
         }