npm - @syncfusion/blazor-themes - Versions diffs - 26.1.35 → 26.1.39 - Mend

@syncfusion/blazor-themes 26.1.35 → 26.1.39

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

package/SCSS-Themes/pivotview/pivotfieldlist/material3.scss CHANGED Viewed

@@ -720,6 +720,12 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
         &:not(.e-active) {
           .e-list-icon {
             color: $field-list-tree-icon-color;
+            @if ($skin-name == 'fluent2') {
+              &:hover {
+                color: $field-list-icon-hover-color;
+              }
+            }
           }
         }
@@ -731,6 +737,15 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
           float: right !important;
           margin: 0 12px 0 0;
           /* stylelint-enable */
+          @if ($skin-name == 'fluent2') {
+            &:hover {
+              color: $field-list-icon-hover-color;
+            }
+            &:active {
+              color: $field-list-icon-hover-color;
+            }
+          }
         }
       }
@@ -795,6 +810,11 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
         margin-right: 4px;
         pointer-events: auto;
         width: 20px;
+        @if ($skin-name == 'fluent2') {
+          font-size: 16px;
+          margin-top: 3px;
+        }
       }
       @if ($skin-name == 'tailwind') {
         &.e-active {
@@ -1162,7 +1182,11 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
             position: relative;
             top: 3px;
           }
+          @if ($skin-name == 'fluent2') {
+            font-size: 20px;
+          }
           @if ($skin-name == 'tailwind') {
             position: relative;
             top: 1px;
@@ -2704,6 +2728,10 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
                 vertical-align: bottom;
                 width: 20px;
+                @if ($skin-name =='fluent2') {
+                  font-size: 16px;
+                }
                 @if ($skin-name =='bootstrap5') or ($skin-name =='FluentUI') {
                   margin-right: 4px;
                   padding-left: 8px;
@@ -2984,6 +3012,10 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
                   height: 20px;
                   width: 20px;
+                  @if ($skin-name =='fluent2') {
+                    font-size: 16px;
+                  }
                   &.e-disable-drag {
                     cursor: not-allowed;
                     opacity: .4;
@@ -3962,6 +3994,11 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
           margin-bottom: $field-list-treeview-drag-bigger-padding !important;
           margin-right: 4px !important;
           width: 24px !important;
+          @if ($skin-name =='fluent2') {
+            font-size: 20px !important;
+            margin-bottom: 5px !important;
+          }
         }
         .e-calc-measure-icon,
@@ -4063,6 +4100,10 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
               .e-drag {
                 font-size: $field-list-bigger-icon-size;
                 width: 24px;
+                @if ($skin-name =='fluent2') {
+                  font-size: 20px;
+                }
               }
             }
           }

package/SCSS-Themes/pivotview/pivotfieldlist/tailwind-dark.scss CHANGED Viewed

@@ -713,6 +713,12 @@ $field-list-adaptive-outerdiv-height: 179px !default;
         &:not(.e-active) {
           .e-list-icon {
             color: $field-list-tree-icon-color;
+            @if ($skin-name == 'fluent2') {
+              &:hover {
+                color: $field-list-icon-hover-color;
+              }
+            }
           }
         }
@@ -724,6 +730,15 @@ $field-list-adaptive-outerdiv-height: 179px !default;
           float: right !important;
           margin: 0 12px 0 0;
           /* stylelint-enable */
+          @if ($skin-name == 'fluent2') {
+            &:hover {
+              color: $field-list-icon-hover-color;
+            }
+            &:active {
+              color: $field-list-icon-hover-color;
+            }
+          }
         }
       }
@@ -788,6 +803,11 @@ $field-list-adaptive-outerdiv-height: 179px !default;
         margin-right: 4px;
         pointer-events: auto;
         width: 20px;
+        @if ($skin-name == 'fluent2') {
+          font-size: 16px;
+          margin-top: 3px;
+        }
       }
       @if ($skin-name == 'tailwind') {
         &.e-active {
@@ -1155,7 +1175,11 @@ $field-list-adaptive-outerdiv-height: 179px !default;
             position: relative;
             top: 3px;
           }
+          @if ($skin-name == 'fluent2') {
+            font-size: 20px;
+          }
           @if ($skin-name == 'tailwind') {
             position: relative;
             top: 1px;
@@ -2697,6 +2721,10 @@ $field-list-adaptive-outerdiv-height: 179px !default;
                 vertical-align: bottom;
                 width: 20px;
+                @if ($skin-name =='fluent2') {
+                  font-size: 16px;
+                }
                 @if ($skin-name =='bootstrap5') or ($skin-name =='FluentUI') {
                   margin-right: 4px;
                   padding-left: 8px;
@@ -2977,6 +3005,10 @@ $field-list-adaptive-outerdiv-height: 179px !default;
                   height: 20px;
                   width: 20px;
+                  @if ($skin-name =='fluent2') {
+                    font-size: 16px;
+                  }
                   &.e-disable-drag {
                     cursor: not-allowed;
                     opacity: .4;
@@ -3955,6 +3987,11 @@ $field-list-adaptive-outerdiv-height: 179px !default;
           margin-bottom: $field-list-treeview-drag-bigger-padding !important;
           margin-right: 4px !important;
           width: 24px !important;
+          @if ($skin-name =='fluent2') {
+            font-size: 20px !important;
+            margin-bottom: 5px !important;
+          }
         }
         .e-calc-measure-icon,
@@ -4056,6 +4093,10 @@ $field-list-adaptive-outerdiv-height: 179px !default;
               .e-drag {
                 font-size: $field-list-bigger-icon-size;
                 width: 24px;
+                @if ($skin-name =='fluent2') {
+                  font-size: 20px;
+                }
               }
             }
           }

package/SCSS-Themes/pivotview/pivotfieldlist/tailwind.scss CHANGED Viewed

@@ -713,6 +713,12 @@ $field-list-adaptive-outerdiv-height: 179px !default;
         &:not(.e-active) {
           .e-list-icon {
             color: $field-list-tree-icon-color;
+            @if ($skin-name == 'fluent2') {
+              &:hover {
+                color: $field-list-icon-hover-color;
+              }
+            }
           }
         }
@@ -724,6 +730,15 @@ $field-list-adaptive-outerdiv-height: 179px !default;
           float: right !important;
           margin: 0 12px 0 0;
           /* stylelint-enable */
+          @if ($skin-name == 'fluent2') {
+            &:hover {
+              color: $field-list-icon-hover-color;
+            }
+            &:active {
+              color: $field-list-icon-hover-color;
+            }
+          }
         }
       }
@@ -788,6 +803,11 @@ $field-list-adaptive-outerdiv-height: 179px !default;
         margin-right: 4px;
         pointer-events: auto;
         width: 20px;
+        @if ($skin-name == 'fluent2') {
+          font-size: 16px;
+          margin-top: 3px;
+        }
       }
       @if ($skin-name == 'tailwind') {
         &.e-active {
@@ -1155,7 +1175,11 @@ $field-list-adaptive-outerdiv-height: 179px !default;
             position: relative;
             top: 3px;
           }
+          @if ($skin-name == 'fluent2') {
+            font-size: 20px;
+          }
           @if ($skin-name == 'tailwind') {
             position: relative;
             top: 1px;
@@ -2697,6 +2721,10 @@ $field-list-adaptive-outerdiv-height: 179px !default;
                 vertical-align: bottom;
                 width: 20px;
+                @if ($skin-name =='fluent2') {
+                  font-size: 16px;
+                }
                 @if ($skin-name =='bootstrap5') or ($skin-name =='FluentUI') {
                   margin-right: 4px;
                   padding-left: 8px;
@@ -2977,6 +3005,10 @@ $field-list-adaptive-outerdiv-height: 179px !default;
                   height: 20px;
                   width: 20px;
+                  @if ($skin-name =='fluent2') {
+                    font-size: 16px;
+                  }
                   &.e-disable-drag {
                     cursor: not-allowed;
                     opacity: .4;
@@ -3955,6 +3987,11 @@ $field-list-adaptive-outerdiv-height: 179px !default;
           margin-bottom: $field-list-treeview-drag-bigger-padding !important;
           margin-right: 4px !important;
           width: 24px !important;
+          @if ($skin-name =='fluent2') {
+            font-size: 20px !important;
+            margin-bottom: 5px !important;
+          }
         }
         .e-calc-measure-icon,
@@ -4056,6 +4093,10 @@ $field-list-adaptive-outerdiv-height: 179px !default;
               .e-drag {
                 font-size: $field-list-bigger-icon-size;
                 width: 24px;
+                @if ($skin-name =='fluent2') {
+                  font-size: 20px;
+                }
               }
             }
           }

package/SCSS-Themes/pivotview/pivotview/fluent2-dark.scss CHANGED Viewed

@@ -141,15 +141,15 @@ $pivotgrid-button-border-color: $chip-border-color !default;
 $pivotgrid-drag-clone-text-color: $pivotgrid-default-font-color !default;
 $pivotgrid-button-background-color: $content-bg-color-alt3 !default;
 $pivotgrid-button-drag-color: $icon-color !default;
-$pivotgrid-hover-color: $content-bg-color-alt2 !default;
-$pivotgrid-focus-color: $content-bg-color-alt4 !default;
+$pivotgrid-hover-color: $content-bg-color-hover !default;
+$pivotgrid-focus-color: $content-bg-color-focus !default;
 $pivotgrid-button-icon-color: $icon-color !default;
 $pivotgrid-button-active-icon-color: $pivotgrid-button-icon-color !default;
-$pivotgrid-icon-hover-color: $icon-color !default;
+$pivotgrid-icon-hover-color: $icon-color-hover !default;
 $pivotgrid-icon-focus-color: $pivotgrid-icon-hover-color !default;
-$pivotgrid-tooltip-fontcolor: $toooltip-text-color !default;
+$pivotgrid-tooltip-fontcolor: $tooltip-text-color !default;
 $pivotgrid-button-font-color: $content-text-color-alt1 !default;
-$pivotgrid-button-acitve-font-color: $content-text-color-alt1 !default;
+$pivotgrid-button-acitve-font-color: $content-text-color-pressed !default;
 $pivotgrid-editor-label-color: $content-text-color-alt1 !default;
 $pivotgrid-editor-label-fill: $content-bg-color-alt1 !default;
 $pivotgrid-header-selection-bg-color: $content-bg-color-alt3 !default;
@@ -174,8 +174,8 @@ $pivotgrid-member-editor-search-padding: 1px $pivotgrid-editor-search-padding-si
 $pivotgrid-member-filter-list-padding-size: -22px !default;
 $pivotview-axis-indent-padding: $pivotview-grid-indent-padding !default;
 $pivotview-axis-bigger-indent-padding: $pivotview-grid-bigger-indent-padding !default;
-$pivotgrid-button-font-size: $text-sm !default;
-$pivotgrid-bigger-button-font-size: $text-sm !default;
+$pivotgrid-button-font-size: $text-xs !default;
+$pivotgrid-bigger-button-font-size: $text-base !default;
 $pivotgrid-button-inner-padding: 4px !default;
 $pivotgrid-bigger-button-inner-padding: 5px !default;
 $pivotgrid-bigger-excel-dialog-min-width: 350px !default;
@@ -3318,7 +3318,6 @@ $pivotpager-single-size-title-padding: 8px !default;
     }
     .e-pv-filtered::before {
-      color: $primary-dark;
       content: '\e735';
     }

package/SCSS-Themes/pivotview/pivotview/fluent2.scss CHANGED Viewed

@@ -141,15 +141,15 @@ $pivotgrid-button-border-color: $chip-border-color !default;
 $pivotgrid-drag-clone-text-color: $pivotgrid-default-font-color !default;
 $pivotgrid-button-background-color: $content-bg-color-alt3 !default;
 $pivotgrid-button-drag-color: $icon-color !default;
-$pivotgrid-hover-color: $content-bg-color-alt2 !default;
-$pivotgrid-focus-color: $content-bg-color-alt4 !default;
+$pivotgrid-hover-color: $content-bg-color-hover !default;
+$pivotgrid-focus-color: $content-bg-color-focus !default;
 $pivotgrid-button-icon-color: $icon-color !default;
 $pivotgrid-button-active-icon-color: $pivotgrid-button-icon-color !default;
-$pivotgrid-icon-hover-color: $icon-color !default;
+$pivotgrid-icon-hover-color: $icon-color-hover !default;
 $pivotgrid-icon-focus-color: $pivotgrid-icon-hover-color !default;
-$pivotgrid-tooltip-fontcolor: $toooltip-text-color !default;
+$pivotgrid-tooltip-fontcolor: $tooltip-text-color !default;
 $pivotgrid-button-font-color: $content-text-color-alt1 !default;
-$pivotgrid-button-acitve-font-color: $content-text-color-alt1 !default;
+$pivotgrid-button-acitve-font-color: $content-text-color-pressed !default;
 $pivotgrid-editor-label-color: $content-text-color-alt1 !default;
 $pivotgrid-editor-label-fill: $content-bg-color-alt1 !default;
 $pivotgrid-header-selection-bg-color: $content-bg-color-alt3 !default;
@@ -174,8 +174,8 @@ $pivotgrid-member-editor-search-padding: 1px $pivotgrid-editor-search-padding-si
 $pivotgrid-member-filter-list-padding-size: -22px !default;
 $pivotview-axis-indent-padding: $pivotview-grid-indent-padding !default;
 $pivotview-axis-bigger-indent-padding: $pivotview-grid-bigger-indent-padding !default;
-$pivotgrid-button-font-size: $text-sm !default;
-$pivotgrid-bigger-button-font-size: $text-sm !default;
+$pivotgrid-button-font-size: $text-xs !default;
+$pivotgrid-bigger-button-font-size: $text-base !default;
 $pivotgrid-button-inner-padding: 4px !default;
 $pivotgrid-bigger-button-inner-padding: 5px !default;
 $pivotgrid-bigger-excel-dialog-min-width: 350px !default;
@@ -3318,7 +3318,6 @@ $pivotpager-single-size-title-padding: 8px !default;
     }
     .e-pv-filtered::before {
-      color: $primary-dark;
       content: '\e735';
     }

package/SCSS-Themes/popups/dialog/bds-dark.scss CHANGED Viewed

@@ -132,12 +132,6 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     .e-dlg-header-content {
       border-radius: $header-content-border-radius;
       line-height: $dialog-header-line-height;
-      .e-dlg-closeicon-btn.e-btn.e-icon-btn {
-        @if $skin-name =='fluent2' {
-          line-height: 2;
-        }
-      }
     }
     .e-dlg-header-content + .e-dlg-content {
@@ -311,6 +305,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
       @if $skin-name == 'Material3' {
         padding: $zero-value;
       }
+      @if $skin-name == 'fluent2' {
+        padding: $dialog-bigger-header-btn-padding;
+      }
     }
     .e-btn .e-btn-icon.e-icon-dlg-close {
@@ -416,6 +413,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     @if $skin-name == 'Material3' {
       padding: $zero-value;
     }
+    @if $skin-name == 'fluent2' {
+      padding: $dialog-header-btn-padding;
+    }
   }
   .e-rtl {

package/SCSS-Themes/popups/dialog/bds.scss CHANGED Viewed

@@ -132,12 +132,6 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     .e-dlg-header-content {
       border-radius: $header-content-border-radius;
       line-height: $dialog-header-line-height;
-      .e-dlg-closeicon-btn.e-btn.e-icon-btn {
-        @if $skin-name =='fluent2' {
-          line-height: 2;
-        }
-      }
     }
     .e-dlg-header-content + .e-dlg-content {
@@ -311,6 +305,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
       @if $skin-name == 'Material3' {
         padding: $zero-value;
       }
+      @if $skin-name == 'fluent2' {
+        padding: $dialog-bigger-header-btn-padding;
+      }
     }
     .e-btn .e-btn-icon.e-icon-dlg-close {
@@ -416,6 +413,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     @if $skin-name == 'Material3' {
       padding: $zero-value;
     }
+    @if $skin-name == 'fluent2' {
+      padding: $dialog-header-btn-padding;
+    }
   }
   .e-rtl {

package/SCSS-Themes/popups/dialog/bootstrap-dark.scss CHANGED Viewed

@@ -111,12 +111,6 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     .e-dlg-header-content {
       border-radius: $header-content-border-radius;
       line-height: $dialog-header-line-height;
-      .e-dlg-closeicon-btn.e-btn.e-icon-btn {
-        @if $skin-name =='fluent2' {
-          line-height: 2;
-        }
-      }
     }
     .e-dlg-header-content + .e-dlg-content {
@@ -290,6 +284,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
       @if $skin-name == 'Material3' {
         padding: $zero-value;
       }
+      @if $skin-name == 'fluent2' {
+        padding: $dialog-bigger-header-btn-padding;
+      }
     }
     .e-btn .e-btn-icon.e-icon-dlg-close {
@@ -395,6 +392,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     @if $skin-name == 'Material3' {
       padding: $zero-value;
     }
+    @if $skin-name == 'fluent2' {
+      padding: $dialog-header-btn-padding;
+    }
   }
   .e-rtl {

package/SCSS-Themes/popups/dialog/bootstrap.scss CHANGED Viewed

@@ -103,12 +103,6 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     .e-dlg-header-content {
       border-radius: $header-content-border-radius;
       line-height: $dialog-header-line-height;
-      .e-dlg-closeicon-btn.e-btn.e-icon-btn {
-        @if $skin-name =='fluent2' {
-          line-height: 2;
-        }
-      }
     }
     .e-dlg-header-content + .e-dlg-content {
@@ -282,6 +276,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
       @if $skin-name == 'Material3' {
         padding: $zero-value;
       }
+      @if $skin-name == 'fluent2' {
+        padding: $dialog-bigger-header-btn-padding;
+      }
     }
     .e-btn .e-btn-icon.e-icon-dlg-close {
@@ -387,6 +384,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     @if $skin-name == 'Material3' {
       padding: $zero-value;
     }
+    @if $skin-name == 'fluent2' {
+      padding: $dialog-header-btn-padding;
+    }
   }
   .e-rtl {

package/SCSS-Themes/popups/dialog/bootstrap4.scss CHANGED Viewed

@@ -103,12 +103,6 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     .e-dlg-header-content {
       border-radius: $header-content-border-radius;
       line-height: $dialog-header-line-height;
-      .e-dlg-closeicon-btn.e-btn.e-icon-btn {
-        @if $skin-name =='fluent2' {
-          line-height: 2;
-        }
-      }
     }
     .e-dlg-header-content + .e-dlg-content {
@@ -282,6 +276,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
       @if $skin-name == 'Material3' {
         padding: $zero-value;
       }
+      @if $skin-name == 'fluent2' {
+        padding: $dialog-bigger-header-btn-padding;
+      }
     }
     .e-btn .e-btn-icon.e-icon-dlg-close {
@@ -387,6 +384,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     @if $skin-name == 'Material3' {
       padding: $zero-value;
     }
+    @if $skin-name == 'fluent2' {
+      padding: $dialog-header-btn-padding;
+    }
   }
   .e-rtl {

package/SCSS-Themes/popups/dialog/bootstrap5-dark.scss CHANGED Viewed

@@ -113,12 +113,6 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     .e-dlg-header-content {
       border-radius: $header-content-border-radius;
       line-height: $dialog-header-line-height;
-      .e-dlg-closeicon-btn.e-btn.e-icon-btn {
-        @if $skin-name =='fluent2' {
-          line-height: 2;
-        }
-      }
     }
     .e-dlg-header-content + .e-dlg-content {
@@ -292,6 +286,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
       @if $skin-name == 'Material3' {
         padding: $zero-value;
       }
+      @if $skin-name == 'fluent2' {
+        padding: $dialog-bigger-header-btn-padding;
+      }
     }
     .e-btn .e-btn-icon.e-icon-dlg-close {
@@ -397,6 +394,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     @if $skin-name == 'Material3' {
       padding: $zero-value;
     }
+    @if $skin-name == 'fluent2' {
+      padding: $dialog-header-btn-padding;
+    }
   }
   .e-rtl {

package/SCSS-Themes/popups/dialog/bootstrap5.scss CHANGED Viewed

@@ -113,12 +113,6 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     .e-dlg-header-content {
       border-radius: $header-content-border-radius;
       line-height: $dialog-header-line-height;
-      .e-dlg-closeicon-btn.e-btn.e-icon-btn {
-        @if $skin-name =='fluent2' {
-          line-height: 2;
-        }
-      }
     }
     .e-dlg-header-content + .e-dlg-content {
@@ -292,6 +286,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
       @if $skin-name == 'Material3' {
         padding: $zero-value;
       }
+      @if $skin-name == 'fluent2' {
+        padding: $dialog-bigger-header-btn-padding;
+      }
     }
     .e-btn .e-btn-icon.e-icon-dlg-close {
@@ -397,6 +394,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     @if $skin-name == 'Material3' {
       padding: $zero-value;
     }
+    @if $skin-name == 'fluent2' {
+      padding: $dialog-header-btn-padding;
+    }
   }
   .e-rtl {

package/SCSS-Themes/popups/dialog/fabric-dark.scss CHANGED Viewed

@@ -108,12 +108,6 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     .e-dlg-header-content {
       border-radius: $header-content-border-radius;
       line-height: $dialog-header-line-height;
-      .e-dlg-closeicon-btn.e-btn.e-icon-btn {
-        @if $skin-name =='fluent2' {
-          line-height: 2;
-        }
-      }
     }
     .e-dlg-header-content + .e-dlg-content {
@@ -287,6 +281,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
       @if $skin-name == 'Material3' {
         padding: $zero-value;
       }
+      @if $skin-name == 'fluent2' {
+        padding: $dialog-bigger-header-btn-padding;
+      }
     }
     .e-btn .e-btn-icon.e-icon-dlg-close {
@@ -392,6 +389,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     @if $skin-name == 'Material3' {
       padding: $zero-value;
     }
+    @if $skin-name == 'fluent2' {
+      padding: $dialog-header-btn-padding;
+    }
   }
   .e-rtl {

package/SCSS-Themes/popups/dialog/fabric.scss CHANGED Viewed

@@ -103,12 +103,6 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     .e-dlg-header-content {
       border-radius: $header-content-border-radius;
       line-height: $dialog-header-line-height;
-      .e-dlg-closeicon-btn.e-btn.e-icon-btn {
-        @if $skin-name =='fluent2' {
-          line-height: 2;
-        }
-      }
     }
     .e-dlg-header-content + .e-dlg-content {
@@ -282,6 +276,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
       @if $skin-name == 'Material3' {
         padding: $zero-value;
       }
+      @if $skin-name == 'fluent2' {
+        padding: $dialog-bigger-header-btn-padding;
+      }
     }
     .e-btn .e-btn-icon.e-icon-dlg-close {
@@ -387,6 +384,9 @@ $dialog-enable-resize-padding-bottom: 15px !default;
     @if $skin-name == 'Material3' {
       padding: $zero-value;
     }
+    @if $skin-name == 'fluent2' {
+      padding: $dialog-header-btn-padding;
+    }
   }
   .e-rtl {