@syncfusion/blazor-themes 22.1.39 → 22.2.5

package/SCSS-Themes/pivotview/pivotview/material3.scss

@@ -120,6 +120,7 @@ $pivotgrid-rowsheader-cellvalue-margin-top: 5px !default;
 $pivotgrid-excelfilter-member-editor-node-limit-height: 100px !default;
 $pivotgrid-member-editor-node-limit-bigger-height: 455px !default;
 $pivotgrid-member-sort-border-radius: $text-xl !default;
+$pivotgrid-cell-value-margin-top: 0 !default;
 
 // $pivotview-filter-toolbar-indicator-margin-left: 20px !default;
 $pivotview-filter-toolbar-items-margin-left: 20px !default;
@@ -878,6 +879,12 @@ $pivotpager-string-maindiv-font-color: rgba($content-text-color-alt1) !default;
       }
     }
 
+    &.sf-pivotview {
+      .e-pivot-toolbar {
+        box-sizing: border-box;
+      }
+    }
+
     .e-pivot-toolbar {
       background: $pivotgrid-grp-bg-color;
       border-bottom: 0;
@@ -1387,6 +1394,32 @@ $pivotpager-string-maindiv-font-color: rgba($content-text-color-alt1) !default;
 
   /*! PivotView theme */
   .e-pivotview {
+    .e-pivotcell-container {
+      display: flex;
+
+      .e-stackedheadertext,
+      .e-headertext {
+        &.e-cellvalue {
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+      }
+
+      .e-sortfilterdiv.e-value-sort-icon {
+        align-items: center;
+        display: flex;
+      }
+    }
+
+    .e-gridclip .e-pivotcell-container {
+      .e-stackedheadertext,
+      .e-headertext {
+        &.e-cellvalue {
+          text-overflow: clip;
+        }
+      }
+    }
+
     .e-nextspan {
       display: inline-block;
       width: $pivotview-indent-space-size;
@@ -1535,19 +1568,7 @@ $pivotpager-string-maindiv-font-color: rgba($content-text-color-alt1) !default;
 
     div {
       &.e-cellvalue {
-        margin-top: 5px;
-  
-        @if ($pivotgrid-skin == 'highcontrast-light') or ($pivotgrid-skin == 'highcontrast') or ($skin-name == 'Material3') {
-          margin-top: 0;
-        }
-  
-        @if ($skin-name == 'tailwind') or ($skin-name == 'bootstrap5') {
-          margin-top: 2px;
-        }
-  
-        @if ($skin-name == 'FluentUI') {
-          margin-top: 1px;
-        }
+        margin-top: $pivotgrid-cell-value-margin-top;
       }
 
       div span.e-value-sort-icon {
@@ -1581,12 +1602,12 @@ $pivotpager-string-maindiv-font-color: rgba($content-text-color-alt1) !default;
       }
     }
 
-    .e-stackedheadercelldiv .e-sortfilterdiv, .e-headercelldiv .e-sortfilterdiv {
-      margin: $pivotgrid-vsort-column-margin !important;
-    }
-
-    .e-stackedheadercelldiv .e-sortfilterdiv.e-value-sort-align, .e-headercelldiv .e-sortfilterdiv.e-value-sort-align {
-      margin: $pivotgrid-vsort-column-parent-margin !important;
+    .e-stackedheadercelldiv, .e-headercelldiv {
+      .e-sortfilterdiv, .e-sortfilterdiv.e-value-sort-align {
+        margin: $pivotgrid-vsort-column-parent-margin !important;
+        margin-left: auto !important;
+        margin-top: $pivotgrid-cell-value-margin-top !important;
+      }
     }
 
     .e-rowsheader .e-sortfilterdiv {

package/SCSS-Themes/pivotview/pivotview/tailwind-dark.scss

@@ -119,6 +119,7 @@ $pivotgrid-rowsheader-cellvalue-margin-left: 8px !default;
 $pivotgrid-rowsheader-cellvalue-margin-top: 4px !default;
 $pivotgrid-excelfilter-member-editor-node-limit-height: 120px !default;
 $pivotgrid-member-editor-node-limit-bigger-height: 450px !default;
+$pivotgrid-cell-value-margin-top: 2px !default;
 
 // $pivotview-filter-toolbar-indicator-margin-left: 20px !default;
 $pivotview-filter-toolbar-items-margin-left: 20px !default;
@@ -875,6 +876,12 @@ $pivotpager-single-size-title-padding: 8px !default;
       }
     }
 
+    &.sf-pivotview {
+      .e-pivot-toolbar {
+        box-sizing: border-box;
+      }
+    }
+
     .e-pivot-toolbar {
       background: $pivotgrid-grp-bg-color;
       border-bottom: 0;
@@ -1384,6 +1391,32 @@ $pivotpager-single-size-title-padding: 8px !default;
 
   /*! PivotView theme */
   .e-pivotview {
+    .e-pivotcell-container {
+      display: flex;
+
+      .e-stackedheadertext,
+      .e-headertext {
+        &.e-cellvalue {
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+      }
+
+      .e-sortfilterdiv.e-value-sort-icon {
+        align-items: center;
+        display: flex;
+      }
+    }
+
+    .e-gridclip .e-pivotcell-container {
+      .e-stackedheadertext,
+      .e-headertext {
+        &.e-cellvalue {
+          text-overflow: clip;
+        }
+      }
+    }
+
     .e-nextspan {
       display: inline-block;
       width: $pivotview-indent-space-size;
@@ -1532,19 +1565,7 @@ $pivotpager-single-size-title-padding: 8px !default;
 
     div {
       &.e-cellvalue {
-        margin-top: 5px;
-  
-        @if ($pivotgrid-skin == 'highcontrast-light') or ($pivotgrid-skin == 'highcontrast') or ($skin-name == 'Material3') {
-          margin-top: 0;
-        }
-  
-        @if ($skin-name == 'tailwind') or ($skin-name == 'bootstrap5') {
-          margin-top: 2px;
-        }
-  
-        @if ($skin-name == 'FluentUI') {
-          margin-top: 1px;
-        }
+        margin-top: $pivotgrid-cell-value-margin-top;
       }
 
       div span.e-value-sort-icon {
@@ -1578,12 +1599,12 @@ $pivotpager-single-size-title-padding: 8px !default;
       }
     }
 
-    .e-stackedheadercelldiv .e-sortfilterdiv, .e-headercelldiv .e-sortfilterdiv {
-      margin: $pivotgrid-vsort-column-margin !important;
-    }
-
-    .e-stackedheadercelldiv .e-sortfilterdiv.e-value-sort-align, .e-headercelldiv .e-sortfilterdiv.e-value-sort-align {
-      margin: $pivotgrid-vsort-column-parent-margin !important;
+    .e-stackedheadercelldiv, .e-headercelldiv {
+      .e-sortfilterdiv, .e-sortfilterdiv.e-value-sort-align {
+        margin: $pivotgrid-vsort-column-parent-margin !important;
+        margin-left: auto !important;
+        margin-top: $pivotgrid-cell-value-margin-top !important;
+      }
     }
 
     .e-rowsheader .e-sortfilterdiv {

package/SCSS-Themes/pivotview/pivotview/tailwind.scss

@@ -119,6 +119,7 @@ $pivotgrid-rowsheader-cellvalue-margin-left: 8px !default;
 $pivotgrid-rowsheader-cellvalue-margin-top: 4px !default;
 $pivotgrid-excelfilter-member-editor-node-limit-height: 120px !default;
 $pivotgrid-member-editor-node-limit-bigger-height: 450px !default;
+$pivotgrid-cell-value-margin-top: 2px !default;
 
 // $pivotview-filter-toolbar-indicator-margin-left: 20px !default;
 $pivotview-filter-toolbar-items-margin-left: 20px !default;
@@ -875,6 +876,12 @@ $pivotpager-single-size-title-padding: 8px !default;
       }
     }
 
+    &.sf-pivotview {
+      .e-pivot-toolbar {
+        box-sizing: border-box;
+      }
+    }
+
     .e-pivot-toolbar {
       background: $pivotgrid-grp-bg-color;
       border-bottom: 0;
@@ -1384,6 +1391,32 @@ $pivotpager-single-size-title-padding: 8px !default;
 
   /*! PivotView theme */
   .e-pivotview {
+    .e-pivotcell-container {
+      display: flex;
+
+      .e-stackedheadertext,
+      .e-headertext {
+        &.e-cellvalue {
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+      }
+
+      .e-sortfilterdiv.e-value-sort-icon {
+        align-items: center;
+        display: flex;
+      }
+    }
+
+    .e-gridclip .e-pivotcell-container {
+      .e-stackedheadertext,
+      .e-headertext {
+        &.e-cellvalue {
+          text-overflow: clip;
+        }
+      }
+    }
+
     .e-nextspan {
       display: inline-block;
       width: $pivotview-indent-space-size;
@@ -1532,19 +1565,7 @@ $pivotpager-single-size-title-padding: 8px !default;
 
     div {
       &.e-cellvalue {
-        margin-top: 5px;
-  
-        @if ($pivotgrid-skin == 'highcontrast-light') or ($pivotgrid-skin == 'highcontrast') or ($skin-name == 'Material3') {
-          margin-top: 0;
-        }
-  
-        @if ($skin-name == 'tailwind') or ($skin-name == 'bootstrap5') {
-          margin-top: 2px;
-        }
-  
-        @if ($skin-name == 'FluentUI') {
-          margin-top: 1px;
-        }
+        margin-top: $pivotgrid-cell-value-margin-top;
       }
 
       div span.e-value-sort-icon {
@@ -1578,12 +1599,12 @@ $pivotpager-single-size-title-padding: 8px !default;
       }
     }
 
-    .e-stackedheadercelldiv .e-sortfilterdiv, .e-headercelldiv .e-sortfilterdiv {
-      margin: $pivotgrid-vsort-column-margin !important;
-    }
-
-    .e-stackedheadercelldiv .e-sortfilterdiv.e-value-sort-align, .e-headercelldiv .e-sortfilterdiv.e-value-sort-align {
-      margin: $pivotgrid-vsort-column-parent-margin !important;
+    .e-stackedheadercelldiv, .e-headercelldiv {
+      .e-sortfilterdiv, .e-sortfilterdiv.e-value-sort-align {
+        margin: $pivotgrid-vsort-column-parent-margin !important;
+        margin-left: auto !important;
+        margin-top: $pivotgrid-cell-value-margin-top !important;
+      }
     }
 
     .e-rowsheader .e-sortfilterdiv {

package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap-dark.scss

@@ -86,7 +86,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap.scss

@@ -83,7 +83,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap4.scss

@@ -83,7 +83,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap5-dark.scss

@@ -85,7 +85,7 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap5.scss

@@ -85,7 +85,7 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/fabric-dark.scss

@@ -86,7 +86,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/fabric.scss

@@ -83,7 +83,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/fluent-dark.scss

@@ -87,7 +87,7 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/fluent.scss

@@ -87,7 +87,7 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/highcontrast.scss

@@ -82,7 +82,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/material-dark.scss

@@ -86,7 +86,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/material.scss

@@ -83,7 +83,7 @@ $drop-down-btn-bigger-popup-margin-top: 0 !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/material3-dark.scss

@@ -86,7 +86,7 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/material3.scss

@@ -86,7 +86,7 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/tailwind-dark.scss

@@ -84,7 +84,7 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/splitbuttons/drop-down-button/tailwind.scss

@@ -84,7 +84,7 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 

package/SCSS-Themes/tailwind-dark.scss

@@ -30785,7 +30785,7 @@ $drop-down-btn-menu-icon-disabled-color: $secondary-text-color-disabled !default
 
     &:focus-visible { // only for keybord
       @if $skin-name == 'Material3' {
-        box-shadow: $btn-keyboard-focus-box-shadow !important; /* stylelint-disable-line declaration-no-important */
+        box-shadow: $btn-keyboard-focus-box-shadow;
       }
     }
 
@@ -73097,7 +73097,9 @@ $pager-focus-shadow: 0 0 0 1px $primary inset !default;
       box-sizing: border-box;
     }
 
-    .e-pager-default.e-hide {
+    .e-pager-default.e-hide,
+    .e-pagesizes.e-hide,
+    .e-hide {
       display: none;
     }
 
@@ -92760,7 +92762,6 @@ $gantt-masked-table-background-color: rgb(225,223,221);
   .e-gantt .e-gantt-chart .e-gantt-child-critical-progressbar-inner-div {
     background-color: $gantt-critical-child-progress-bar;
     border: $gantt-child-progress-bar-border;
-    position: absolute;
     border-radius: $gantt-child-progress-bar-border-radius;
   }
 
@@ -107472,6 +107473,7 @@ $pivotgrid-rowsheader-cellvalue-margin-left: 8px !default;
 $pivotgrid-rowsheader-cellvalue-margin-top: 4px !default;
 $pivotgrid-excelfilter-member-editor-node-limit-height: 120px !default;
 $pivotgrid-member-editor-node-limit-bigger-height: 450px !default;
+$pivotgrid-cell-value-margin-top: 2px !default;
 
 // $pivotview-filter-toolbar-indicator-margin-left: 20px !default;
 $pivotview-filter-toolbar-items-margin-left: 20px !default;
@@ -108228,6 +108230,12 @@ $pivotpager-single-size-title-padding: 8px !default;
       }
     }
 
+    &.sf-pivotview {
+      .e-pivot-toolbar {
+        box-sizing: border-box;
+      }
+    }
+
     .e-pivot-toolbar {
       background: $pivotgrid-grp-bg-color;
       border-bottom: 0;
@@ -108737,6 +108745,32 @@ $pivotpager-single-size-title-padding: 8px !default;
 
   /*! PivotView theme */
   .e-pivotview {
+    .e-pivotcell-container {
+      display: flex;
+
+      .e-stackedheadertext,
+      .e-headertext {
+        &.e-cellvalue {
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+      }
+
+      .e-sortfilterdiv.e-value-sort-icon {
+        align-items: center;
+        display: flex;
+      }
+    }
+
+    .e-gridclip .e-pivotcell-container {
+      .e-stackedheadertext,
+      .e-headertext {
+        &.e-cellvalue {
+          text-overflow: clip;
+        }
+      }
+    }
+
     .e-nextspan {
       display: inline-block;
       width: $pivotview-indent-space-size;
@@ -108885,19 +108919,7 @@ $pivotpager-single-size-title-padding: 8px !default;
 
     div {
       &.e-cellvalue {
-        margin-top: 5px;
-  
-        @if ($pivotgrid-skin == 'highcontrast-light') or ($pivotgrid-skin == 'highcontrast') or ($skin-name == 'Material3') {
-          margin-top: 0;
-        }
-  
-        @if ($skin-name == 'tailwind') or ($skin-name == 'bootstrap5') {
-          margin-top: 2px;
-        }
-  
-        @if ($skin-name == 'FluentUI') {
-          margin-top: 1px;
-        }
+        margin-top: $pivotgrid-cell-value-margin-top;
       }
 
       div span.e-value-sort-icon {
@@ -108931,12 +108953,12 @@ $pivotpager-single-size-title-padding: 8px !default;
       }
     }
 
-    .e-stackedheadercelldiv .e-sortfilterdiv, .e-headercelldiv .e-sortfilterdiv {
-      margin: $pivotgrid-vsort-column-margin !important;
-    }
-
-    .e-stackedheadercelldiv .e-sortfilterdiv.e-value-sort-align, .e-headercelldiv .e-sortfilterdiv.e-value-sort-align {
-      margin: $pivotgrid-vsort-column-parent-margin !important;
+    .e-stackedheadercelldiv, .e-headercelldiv {
+      .e-sortfilterdiv, .e-sortfilterdiv.e-value-sort-align {
+        margin: $pivotgrid-vsort-column-parent-margin !important;
+        margin-left: auto !important;
+        margin-top: $pivotgrid-cell-value-margin-top !important;
+      }
     }
 
     .e-rowsheader .e-sortfilterdiv {