@syncfusion/ej2-angular-spreadsheet 20.4.54 → 21.1.35

package/styles/spreadsheet/_material-dark-definition.scss

@@ -15,6 +15,18 @@ $cell-border-color: $grey-300 !default;
 $hdr-cell-border-color: $grey-800 !default;
 $dlg-error-color: #dd2c2c !default;
 $agg-clr: #fff !default;
+$header-cell-font-size: 12px !default;
+$open-dlg-file-alert-span-font-size: 12px !default;
+$goto-dlg-btn-font-size: 12px !default;
+$numformat-ddb-preview-font-size: 12px !default;
+$aggregate-list-font-size: 14px !default;
+$header-cell-font-weight: 500 !default;
+$spreadsheet-tbar-btn-icon-font-size: 16px !default;
+$spreadsheet-cpicker-font-color-font-size: 13px !default;
+$spreadsheet-cpicker-fill-color-font-size: 14px !default;
+$aggregate-list-font-size: 16px !default;
+$bigger-spreadsheet-tbar-btn-icon-font-size: 18px !default;
+$spreadsheet-drop-icon-font-size: 12px !default;
 
 //enddefault
 //selection
@@ -52,6 +64,12 @@ $formula-textarea-width: calc(100% - 146px) !default;
 $formula-bar-color: $grey-dark-font !default;
 $mformula-bar-height: 42px !default;
 $expand-icon-margin: 4px !default;
+$formula-submit-btn-icon-font-size: 16px !default;
+$formula-bar-drop-icon-font-size: 10px !default;
+$formula-bar-btn-icon-font-size: 18px !default;
+$bigger-name-box-ddl-icon-font-size: 20px !default;
+$bigger-insert-function-btn-icon-font-size: 18px !default;
+$bigger-formula-bar-drop-icon-font-size: 18px !default;
 
 //End formula bar
 //Insert dialog box
@@ -60,6 +78,10 @@ $dlg-description-font-weight: 500 !default;
 $dlg-content-padding: 18px !default;
 $dlg-category-margin-bottom: 0 !default;
 $dlg-min-height: 480px !default;
+$function-dlg-header-content-font-size: 16px !default;
+$dlg-category-content-font-size: 12px !default;
+$dlg-description-content-font-size: 14px !default;
+$dlg-category-content-font-weight: 500 !default;
 
 //End Insert dialogbox
 //Ribbon
@@ -70,16 +92,16 @@ $align-ddb-ul-padding: 8px !default;
 $align-ddb-item-padding: 0 7px !default;
 $align-ddb-item-margin: 0 !default;
 $ctrl-btn-padding: 16px !default;
-$ribbon-btn-width: 22px !default;
-$ribbon-btn-height: 23px !default;
-$ribbon-btn-padding: 1.5px !default;
-$bigger-ribbon-btn-height: 34px !default;
-$bigger-ribbon-btn-padding: 6px !default;
+$spreadsheet-ribbon-btn-width: 22px !default;
+$spreadsheet-ribbon-btn-height: 23px !default;
+$spreadsheet-ribbon-btn-padding: 1.5px !default;
+$bigger-spreadsheet-ribbon-btn-height: 34px !default;
+$bigger-spreadsheet-ribbon-btn-padding: 6px !default;
 $cpicker-btn-width: 24px !default;
 $bigger-cpicker-btn-width: 31px !default;
 $menu-extension-padding: 10px !default;
-$ribbon-item-hover-border-color: transparent !default;
-$ribbon-item-active-border-color: transparent !default;
+$spreadsheet-ribbon-item-hover-border-color: transparent !default;
+$spreadsheet-ribbon-item-active-border-color: transparent !default;
 $font-family-collection: ('Arial', 'Arial Black', 'Axettac Demo', 'Batang', 'Book Antiqua', 'Calibri', 'Comic Sans MS', 'Courier', 'Courier New', 'Din Condensed', 'Georgia', 'Helvetica', 'Helvetica New', 'Roboto', 'Tahoma', 'Times New Roman', 'Verdana') !default;
 $normal-btn-padding: 7px !default;
 
@@ -87,11 +109,17 @@ $normal-btn-padding: 7px !default;
 //Sorting
 $sort-error-bg-color: #fce7e9;
 $sort-error-font-color: #333;
+$sort-dlg-listwrapper-text-font-size: 12px !default;
+$sort-dlg-error-font-size: 12px !default;
 
 //End Sorting
 //Hyperlink
 $hyper-doc-border-color: #c8c8c8 !default;
 $hyper-text-border: #979797 !default;
+$hyperlink-dlg-header-content-font-size: 18px !default;
+$hyperlink-dlg-content-header-font-size: 14px !default;
+$hyperlink-dlg-content-text-font-size: 14px !default;
+$link-dialog-tab-text-font-size: 14px !default;
 
 //End Hyperlink
 //Filtering
@@ -99,6 +127,7 @@ $filter-icon-margin-bottom: 0 !default;
 $filter-icon-bigger-margin-bottom: 12px !default;
 $filter-selectall-padding: 22px !default;
 $filter-selectall-bigger-padding: 27px !default;
+$filter-icon-before-font-size: 20px !default;
 
 //End Filtering
 //Find And Replace
@@ -110,11 +139,30 @@ $find-dlg-width: 470px !default;
 $bigger-find-tool-dlg-width: 403px !default;
 $bigger-find-tool-dlg-height: 62px !default;
 $bigger-find-goto-dlg-height: 241px !default;
+$find-dlg-alert-span-font-size: 12px !default;
+$bigger-find-dlg-btn-font-size: 12px !default;
+$find-dlg-header-font-weight: 500 !default;
 
 //End Find And Replace
 //Protect Sheet
 $protect-dlg-height: 470px !default;
 $protect-dlg-width: 287px !default;
+$protect-sheet-dlg-password-header-font-size: 14px !default;
+$unprotect-sheet-dlg-header-font-size: 18px !default;
+$unprotectsheet-alert-span-font-size: 12px !default;
+$unprotectsheet-content-header-font-size: 14px !default;
+$reenterpwd-dlg-content-header-font-size: 18px !default;
+$reenterpwd-dlg-alert-span-font-size: 12px !default;
+$reenterpwd-dlg-content-header-font-size: 14px !default;
+$protect-checkbox-label-font-size: 14px !default;
+$protectworkbook-dlg-header-font-size: 18px !default;
+$protectworkbook-dlg-alert-span-font-size: 12px !default;
+$protectworkbook-dlg-content-header-font-size: 12px !default;
+$unprotectworkbook-dlg-content-header-font-size: 14px !default;
+$importprotectworkbook-dlg-content-header-font-size: 14px !default;
+$protectworkbook-dlg-pwd-alert-span-font-size: 14px !default;
+$protectworkbook-dlg-pwd-content-font-size: 14px !default;
+$protect-content-font-size: 14px !default;
 
 //End Protect Sheet
 //Conditional Formatting
@@ -122,6 +170,8 @@ $ele-color: #616161;
 $ele-hover-color: #eee;
 $dark-ele-color: #303030;
 $dark-ele-hover-color: rgba(255, 255, 255, .1) !default;
+$cf-dlg-content-font-weight: 500 !default;
+$cf-menu-icon-font-size: 16px !default;
 
 //End Conditional Formatting
 //Formula selection
@@ -145,9 +195,22 @@ $custom-listview-color: #ddd;
 //End Custom Format
 //File Name Dialog
 $open-dlg-width: 340px !default;
+$file-menu-extension-font-size: 14px !default;
 
 //End File Name Dialog
 //Data Validation
 $bigger-validation-list-icon-bottom: 12px !default;
+$validation-dlg-content-header-font-size: 14px !default;
+$validation-dlg-content-input-font-size: 14px !default;
+$validation-dlg-error-font-size: 12px !default;
+$validationerror-dlg-content-font-size: 14px !default;
 
 //End Data Validation
+//Chart
+$title-dlg-content-header-font-size: 16px !default;
+$title-dlg-content-input-font-size: 14px !default;
+$spreadsheet-switch-row-column-icon-font-size: 18px !default;
+$spreadsheet-addchart-icon-font-size: 18px !default;
+$spreadsheet-chart-icon-font-size: 32px !default;
+
+//End Chart

package/styles/spreadsheet/_material-definition.scss

@@ -15,6 +15,18 @@ $cell-border-color: $spreadsheet-border-color !default;
 $hdr-cell-border-color: $cell-border-color !default;
 $dlg-error-color: #dd2c2c !default;
 $agg-clr: #808080;
+$header-cell-font-size: 12px !default;
+$open-dlg-file-alert-span-font-size: 12px !default;
+$goto-dlg-btn-font-size: 12px !default;
+$numformat-ddb-preview-font-size: 12px !default;
+$aggregate-list-font-size: 14px !default;
+$header-cell-font-weight: 500 !default;
+$spreadsheet-tbar-btn-icon-font-size: 16px !default;
+$spreadsheet-cpicker-font-color-font-size: 13px !default;
+$spreadsheet-cpicker-fill-color-font-size: 14px !default;
+$aggregate-list-font-size: 16px !default;
+$bigger-spreadsheet-tbar-btn-icon-font-size: 18px !default;
+$spreadsheet-drop-icon-font-size: 12px !default;
 
 //enddefault
 //selection
@@ -50,6 +62,12 @@ $formula-textarea-width: calc(100% - 146px) !default;
 $formula-bar-color: #515151 !default;
 $mformula-bar-height: 42px !default;
 $expand-icon-margin: 4px !default;
+$formula-submit-btn-icon-font-size: 16px !default;
+$formula-bar-drop-icon-font-size: 10px !default;
+$formula-bar-btn-icon-font-size: 18px !default;
+$bigger-name-box-ddl-icon-font-size: 20px !default;
+$bigger-insert-function-btn-icon-font-size: 18px !default;
+$bigger-formula-bar-drop-icon-font-size: 18px !default;
 
 //End formula bar$header-cell-color
 //Insert dialog box
@@ -58,6 +76,10 @@ $dlg-description-font-weight: 500 !default;
 $dlg-content-padding: 18px !default;
 $dlg-category-margin-bottom: 0 !default;
 $dlg-min-height: 480px !default;
+$function-dlg-header-content-font-size: 16px !default;
+$dlg-category-content-font-size: 12px !default;
+$dlg-description-content-font-size: 14px !default;
+$dlg-category-content-font-weight: 500 !default;
 
 //End Insert dialogbox
 //Ribbon
@@ -68,16 +90,16 @@ $align-ddb-ul-padding: 8px !default;
 $align-ddb-item-padding: 0 7px !default;
 $align-ddb-item-margin: 0 !default;
 $ctrl-btn-padding: 16px !default;
-$ribbon-btn-width: 22px !default;
-$ribbon-btn-height: 23px !default;
-$ribbon-btn-padding: 1.5px !default;
-$bigger-ribbon-btn-height: 34px !default;
-$bigger-ribbon-btn-padding: 6px !default;
+$spreadsheet-ribbon-btn-width: 22px !default;
+$spreadsheet-ribbon-btn-height: 23px !default;
+$spreadsheet-ribbon-btn-padding: 1.5px !default;
+$bigger-spreadsheet-ribbon-btn-height: 34px !default;
+$bigger-spreadsheet-ribbon-btn-padding: 6px !default;
 $cpicker-btn-width: 24px !default;
 $bigger-cpicker-btn-width: 31px !default;
 $menu-extension-padding: 10px !default;
-$ribbon-item-hover-border-color: transparent !default;
-$ribbon-item-active-border-color: transparent !default;
+$spreadsheet-ribbon-item-hover-border-color: transparent !default;
+$spreadsheet-ribbon-item-active-border-color: transparent !default;
 $font-family-collection: ('Arial', 'Arial Black', 'Axettac Demo', 'Batang', 'Book Antiqua', 'Calibri', 'Comic Sans MS', 'Courier', 'Courier New', 'Din Condensed', 'Georgia', 'Helvetica', 'Helvetica New', 'Roboto', 'Tahoma', 'Times New Roman', 'Verdana') !default;
 $normal-btn-padding: 7px !default;
 
@@ -85,11 +107,17 @@ $normal-btn-padding: 7px !default;
 //Sorting
 $sort-error-bg-color: #fce7e9;
 $sort-error-font-color: #333;
+$sort-dlg-listwrapper-text-font-size: 12px !default;
+$sort-dlg-error-font-size: 12px !default;
 
 //End Sorting
 //Hyperlink
 $hyper-doc-border-color: #c8c8c8 !default;
 $hyper-text-border: #979797 !default;
+$hyperlink-dlg-header-content-font-size: 18px !default;
+$hyperlink-dlg-content-header-font-size: 14px !default;
+$hyperlink-dlg-content-text-font-size: 14px !default;
+$link-dialog-tab-text-font-size: 14px !default;
 
 //End Hyperlink
 //Filtering
@@ -97,6 +125,7 @@ $filter-icon-margin-bottom: 0 !default;
 $filter-icon-bigger-margin-bottom: 12px !default;
 $filter-selectall-padding: 22px !default;
 $filter-selectall-bigger-padding: 27px !default;
+$filter-icon-before-font-size: 20px !default;
 
 //End Filtering
 //Find And Replace
@@ -108,11 +137,30 @@ $find-dlg-width: 468px !default;
 $bigger-find-tool-dlg-width: 403px !default;
 $bigger-find-tool-dlg-height: 59px !default;
 $bigger-find-goto-dlg-height: 236px !default;
+$find-dlg-alert-span-font-size: 12px !default;
+$bigger-find-dlg-btn-font-size: 12px !default;
+$find-dlg-header-font-weight: 500 !default;
 
 //End Find And Replace
 //Protect Sheet
 $protect-dlg-height: 470px !default;
 $protect-dlg-width: 287px !default;
+$protect-sheet-dlg-password-header-font-size: 14px !default;
+$unprotect-sheet-dlg-header-font-size: 18px !default;
+$unprotectsheet-alert-span-font-size: 12px !default;
+$unprotectsheet-content-header-font-size: 14px !default;
+$reenterpwd-dlg-content-header-font-size: 18px !default;
+$reenterpwd-dlg-alert-span-font-size: 12px !default;
+$reenterpwd-dlg-content-header-font-size: 14px !default;
+$protect-checkbox-label-font-size: 14px !default;
+$protectworkbook-dlg-header-font-size: 18px !default;
+$protectworkbook-dlg-alert-span-font-size: 12px !default;
+$protectworkbook-dlg-content-header-font-size: 12px !default;
+$unprotectworkbook-dlg-content-header-font-size: 14px !default;
+$importprotectworkbook-dlg-content-header-font-size: 14px !default;
+$protectworkbook-dlg-pwd-alert-span-font-size: 14px !default;
+$protectworkbook-dlg-pwd-content-font-size: 14px !default;
+$protect-content-font-size: 14px !default;
 
 //End Protect Sheet
 //Conditional Formatting
@@ -120,6 +168,8 @@ $ele-color: #616161;
 $ele-hover-color: #eee;
 $dark-ele-color: #303030;
 $dark-ele-hover-color: rgba(255, 255, 255, .1) !default;
+$cf-dlg-content-font-weight: 500 !default;
+$cf-menu-icon-font-size: 16px !default;
 
 //End Conditional Formatting
 //Formula selection
@@ -143,9 +193,22 @@ $custom-listview-color: #ddd;
 //End Custom Format
 //File Name Dialog
 $open-dlg-width: 340px !default;
+$file-menu-extension-font-size: 14px !default;
 
 //End File Name Dialog
 //Data Validation
 $bigger-validation-list-icon-bottom: 9px !default;
+$validation-dlg-content-header-font-size: 14px !default;
+$validation-dlg-content-input-font-size: 14px !default;
+$validation-dlg-error-font-size: 12px !default;
+$validationerror-dlg-content-font-size: 14px !default;
 
 //End Data Validation
+//Chart
+$title-dlg-content-header-font-size: 16px !default;
+$title-dlg-content-input-font-size: 14px !default;
+$spreadsheet-switch-row-column-icon-font-size: 18px !default;
+$spreadsheet-addchart-icon-font-size: 18px !default;
+$spreadsheet-chart-icon-font-size: 32px !default;
+
+//End Chart

package/styles/spreadsheet/_tailwind-definition.scss

@@ -15,6 +15,18 @@ $header-cell-color: $content-text-color-alt2 !default;
 $spreadsheet-border-color: $border-light !default;
 $spreadsheet-border: $spreadsheet-border-width solid $spreadsheet-border-color !default;
 $select-all-bg-color: $spreadsheet-border-color !default;
+$header-cell-font-size: $text-xs !default;
+$open-dlg-file-alert-span-font-size: $text-xs !default;
+$goto-dlg-btn-font-size: $text-xs !default;
+$numformat-ddb-preview-font-size: $text-xs !default;
+$aggregate-list-font-size: $text-sm !default;
+$header-cell-font-weight: $font-weight-medium !default;
+$spreadsheet-tbar-btn-icon-font-size: $font-icon-16 !default;
+$spreadsheet-cpicker-font-color-font-size: $font-icon-13 !default;
+$spreadsheet-cpicker-fill-color-font-size: $font-icon-14 !default;
+$aggregate-list-font-size: $font-icon-16 !default;
+$bigger-spreadsheet-tbar-btn-icon-font-size: $font-icon-18 !default;
+$spreadsheet-drop-icon-font-size: $font-icon-12 !default;
 
 //enddefault
 //selection
@@ -45,7 +57,7 @@ $select-icon-color: $primary !default;
 //End Tab
 //Formula bar
 $formula-bar-font-size: $text-sm !default;
-$bigger-formula-bar-font-size: 15px !default;
+$bigger-formula-bar-font-size: $text-base !default;
 $name-box-width: 92px !default;
 $namebox-icon-size: 18px !default;
 $formula-textarea-width: calc(100% - 146px) !default;
@@ -53,14 +65,25 @@ $formula-bar-color: $secondary-text-color !default;
 $mformula-bar-height: 42px !default;
 $expand-icon-margin: 4px !default;
 $formula-bar-bg-color: $content-bg-color !default;
+$formula-submit-btn-icon-font-size: $font-icon-16 !default;
+$name-box-icon-font-size: $font-icon-18 !default;
+$formula-bar-drop-icon-font-size: $font-icon-18 !default;
+$formula-bar-btn-icon-font-size: $font-icon-18 !default;
+$bigger-name-box-ddl-icon-font-size: $font-icon-20 !default;
+$bigger-insert-function-btn-icon-font-size: $font-icon-18 !default;
+$bigger-formula-bar-drop-icon-font-size: $font-icon-18 !default;
 
 //End formula bar
 //Insert dialog box
 $dlg-list-border: $spreadsheet-border !default;
-$dlg-description-font-weight: 500 !default;
+$dlg-description-font-weight: $font-weight-medium !default;
 $dlg-content-padding: 18px !default;
 $dlg-category-margin-bottom: 0 !default;
 $dlg-min-height: 518px !default;
+$function-dlg-header-content-font-size: $text-base !default;
+$dlg-category-content-font-size: $text-xs !default;
+$dlg-description-content-font-size: $text-sm !default;
+$dlg-category-content-font-weight: $font-weight-bold !default;
 
 //End Insert dialogbox
 //Ribbon
@@ -71,16 +94,16 @@ $align-ddb-ul-padding: 8px !default;
 $align-ddb-item-padding: 0 7px !default;
 $align-ddb-item-margin: 0 !default;
 $ctrl-btn-padding: 16px !default;
-$ribbon-btn-width: 30px !default;
-$ribbon-btn-height: 30px !default;
-$ribbon-btn-padding: 1.5px !default;
-$bigger-ribbon-btn-height: 34px !default;
-$bigger-ribbon-btn-padding: 6px !default;
+$spreadsheet-ribbon-btn-width: 30px !default;
+$spreadsheet-ribbon-btn-height: 30px !default;
+$spreadsheet-ribbon-btn-padding: 1.5px !default;
+$bigger-spreadsheet-ribbon-btn-height: 34px !default;
+$bigger-spreadsheet-ribbon-btn-padding: 6px !default;
 $cpicker-btn-width: 32px !default;
 $bigger-cpicker-btn-width: 36px !default;
 $menu-extension-padding: 12px !default;
-$ribbon-item-hover-border-color: transparent !default;
-$ribbon-item-active-border-color: transparent !default;
+$spreadsheet-ribbon-item-hover-border-color: transparent !default;
+$spreadsheet-ribbon-item-active-border-color: transparent !default;
 $font-family-collection: ('Arial', 'Arial Black', 'Axettac Demo', 'Batang', 'Book Antiqua', 'Calibri', 'Comic Sans MS', 'Courier', 'Courier New', 'Din Condensed', 'Georgia', 'Helvetica', 'Helvetica New', 'Roboto', 'Tahoma', 'Times New Roman', 'Verdana') !default;
 $normal-btn-padding: 8px !default;
 
@@ -88,10 +111,16 @@ $normal-btn-padding: 8px !default;
 //Sorting
 $sort-error-bg-color: $danger-light;
 $sort-error-font-color: $danger-bg-color;
+$sort-dlg-listwrapper-text-font-size: $text-xs !default;
+$sort-dlg-error-font-size: $text-xs !default;
 
 //End Sorting
 //Hyperlink
 $hyper-doc-border-color: $border-light !default;
+$hyperlink-dlg-header-content-font-size: $text-lg !default;
+$hyperlink-dlg-content-header-font-size: $text-sm !default;
+$hyperlink-dlg-content-text-font-size: $text-sm !default;
+$link-dialog-tab-text-font-size: $text-sm !default;
 
 //End Hyperlink
 //Filtering
@@ -99,6 +128,9 @@ $filter-icon-margin-bottom: 0 !default;
 $filter-icon-bigger-margin-bottom: 12px !default;
 $filter-selectall-padding: 19px !default;
 $filter-selectall-bigger-padding: 25px !default;
+$filter-icon-font-size: $font-icon-14 !default;
+$filter-icon-before-font-size: $font-icon-20 !default;
+$bigger-filter-icon-font-size: $font-icon-22 !default;
 
 //End Filtering
 //Find And Replace
@@ -110,11 +142,30 @@ $bigger-find-tool-dlg-height: 50px !default;
 $bigger-find-goto-dlg-height: 256px !default;
 $find-popup-border-top-color: $border-light !default;
 $find-popup-border-color: $border-light !default;
+$find-dlg-alert-span-font-size: $text-xs !default;
+$bigger-find-dlg-btn-font-size: $text-xs !default;
+$find-dlg-header-font-weight: $font-weight-medium !default;
 
 //End Find And Replace
 //Protect Sheet
 $protect-dlg-height: 470px !default;
-$protect-dlg-width: 287px !default;
+$protect-dlg-width: 289px !default;
+$protect-sheet-dlg-password-header-font-size: $text-sm !default;
+$unprotect-sheet-dlg-header-font-size: $text-lg !default;
+$unprotectsheet-alert-span-font-size: $text-xs !default;
+$unprotectsheet-content-header-font-size: $text-sm !default;
+$reenterpwd-dlg-content-header-font-size: $text-lg !default;
+$reenterpwd-dlg-alert-span-font-size: $text-xs !default;
+$reenterpwd-dlg-content-header-font-size: $text-sm !default;
+$protect-checkbox-label-font-size: $text-sm !default;
+$protectworkbook-dlg-header-font-size: $text-lg !default;
+$protectworkbook-dlg-alert-span-font-size: $text-xs !default;
+$protectworkbook-dlg-content-header-font-size: $text-xs !default;
+$unprotectworkbook-dlg-content-header-font-size: $text-sm !default;
+$importprotectworkbook-dlg-content-header-font-size: $text-sm !default;
+$protectworkbook-dlg-pwd-alert-span-font-size: $text-sm !default;
+$protectworkbook-dlg-pwd-content-font-size: $text-sm !default;
+$protect-content-font-size: $text-sm !default;
 
 //End Protect Sheet
 //Conditional Formatting
@@ -122,6 +173,8 @@ $ele-color: $content-bg-color-alt3;
 $ele-hover-color: $content-bg-color-hover;
 $dark-ele-color: $content-bg-color-alt2;
 $dark-ele-hover-color: $content-bg-color-alt3;
+$cf-dlg-content-font-weight: $font-weight-medium !default;
+$cf-menu-icon-font-size: $font-icon-16 !default;
 
 //End Conditional Formatting
 //Formula selection
@@ -147,6 +200,7 @@ $expand-icon-color: $icon-color !default;
 
 //File Name Dialog
 $open-dlg-width: 360px !default;
+$file-menu-extension-font-size: $text-sm !default;
 
 //File Name Dialog
 //chart icon color
@@ -154,5 +208,17 @@ $chart-icon-color: $primary-bg-color-hover !default;
 
 //Data Validation
 $bigger-validation-list-width: 26px !default;
+$validation-dlg-content-header-font-size: $text-sm !default;
+$validation-dlg-content-input-font-size: $text-sm !default;
+$validation-dlg-error-font-size: $text-xs !default;
+$validationerror-dlg-content-font-size: $text-sm !default;
 
 //End Data Validation
+//Chart
+$title-dlg-content-header-font-size: $text-base !default;
+$title-dlg-content-input-font-size: $text-sm !default;
+$spreadsheet-switch-row-column-icon-font-size: $font-icon-18 !default;
+$spreadsheet-addchart-icon-font-size: $font-icon-18 !default;
+$spreadsheet-chart-icon-font-size: $font-icon-32 !default;
+
+//End Chart

package/styles/spreadsheet/_theme.scss

@@ -12,7 +12,7 @@
     }
 
     & .e-find-dlg .e-header {
-      font-weight: 500;
+      font-weight: $find-dlg-header-font-weight;
     }
 
     & .e-scrollbar {
@@ -155,7 +155,7 @@
 
       &:hover:not(.e-active) {
         background: $tbar-hover-bg;
-        border-color: $ribbon-item-hover-border-color;
+        border-color: $spreadsheet-ribbon-item-hover-border-color;
 
         @if $skin-name == 'bootstrap4' {
           color: $tbar-hover-font;
@@ -179,7 +179,7 @@
       &.e-active {
         @if $skin-name != 'highcontrast' {
           background: $tbar-focus-bg;
-          border-color: $ribbon-item-active-border-color;
+          border-color: $spreadsheet-ribbon-item-active-border-color;
         }
       }
 
@@ -220,7 +220,7 @@
 
         &:hover:not(.e-active) {
           background: $tbar-hover-bg;
-          border-color: $ribbon-item-hover-border-color;
+          border-color: $spreadsheet-ribbon-item-hover-border-color;
 
           @if $skin-name == 'bootstrap5' {
             color: $tbar-active-icon-color;
@@ -244,7 +244,7 @@
         &.e-active {
           @if $skin-name != 'highcontrast' {
             background: $tbar-focus-bg;
-            border-color: $ribbon-item-active-border-color;
+            border-color: $spreadsheet-ribbon-item-active-border-color;
           }
 
           @if $skin-name == 'bootstrap5' {
@@ -1338,7 +1338,7 @@
     }
   }
 
-  .e-ribbon .e-content .e-toolbar .e-toolbar-items .e-toolbar-item.e-overlay .e-icons {
+  .e-spreadsheet .e-ribbon .e-content .e-toolbar .e-toolbar-items .e-toolbar-item.e-overlay .e-icons {
     color: $tbar-default-icon-color;
   }
 

package/styles/spreadsheet/bootstrap-dark.css

@@ -265,7 +265,7 @@
 }
 .e-chart-menu .e-ul .e-menu-item .e-menu-icon,
 .e-chart-type-menu .e-ul .e-menu-item .e-menu-icon {
-  font-size: 30px;
+  font-size: 32px;
   margin-right: 10px;
 }
 .e-chart-menu .e-ul .e-menu-item .e-bar,
@@ -709,7 +709,7 @@
   padding-top: 7px;
 }
 .e-spreadsheet .e-reenterpwd-dlg.e-dialog .e-dlg-content .e-reenterpwd-content .e-header {
-  font-size: 14px;
+  font-size: 18px;
   line-height: 16px;
 }
 .e-spreadsheet .e-reenterpwd-dlg.e-dialog .e-dlg-content .e-reenterpwd-content .e-input {
@@ -772,7 +772,7 @@
   height: 300px;
 }
 .e-spreadsheet .e-protect-content {
-  font-size: 13px;
+  font-size: 14px;
   height: 37px;
   padding-top: 20px;
   width: 100%;
@@ -1505,7 +1505,7 @@
   font-size: 16px;
 }
 .e-spreadsheet .e-ribbon .e-toolbar .e-toolbar-item .e-btn .e-chart-icon, .e-spreadsheet .e-ribbon .e-toolbar .e-toolbar-item .e-btn .e-chart-type-icon {
-  font-size: 30px !important; /* stylelint-disable-line declaration-no-important */
+  font-size: 32px !important; /* stylelint-disable-line declaration-no-important */
   margin-right: 5px;
   padding: 0 5px;
   width: 30px;
@@ -1849,7 +1849,7 @@
 .e-spreadsheet .e-datavalidation-dlg .e-footer-content .e-clearall-btn {
   float: left;
 }
-.e-spreadsheet .e-validationerror-dlg .e-dlg-content {
+.e-spreadsheet .e-validation-error-dlg .e-dlg-content {
   font-size: 14px;
   line-height: 28px;
 }
@@ -1885,11 +1885,6 @@
   text-align: center;
   width: 136px;
 }
-.e-spreadsheet .e-hyperlink-dlg.e-dialog .e-dlg-content .e-link-dialog .e-tab-header .e-toolbar-item .e-tab-text,
-.e-spreadsheet .e-edithyperlink-dlg.e-dialog .e-dlg-content .e-link-dialog .e-tab-header .e-toolbar-item .e-tab-text {
-  font-size: 13px;
-  line-height: 15px;
-}
 .e-spreadsheet .e-hyperlink-dlg.e-dialog .e-dlg-content .e-link-dialog .e-content,
 .e-spreadsheet .e-edithyperlink-dlg.e-dialog .e-dlg-content .e-link-dialog .e-content {
   padding-top: 24px;
@@ -2055,7 +2050,7 @@
   max-width: initial;
 }
 .e-dropdown-popup.e-numformat-ddb ul .e-numformat-preview-text {
-  font-size: 13px;
+  font-size: 12px;
   max-width: 200px;
   overflow: hidden;
   text-align: right;
@@ -2138,17 +2133,17 @@
   font-family: "Verdana";
 }
 .e-dropdown-popup.e-aggregate-list {
-  font-size: 13px;
+  font-size: 14px;
   margin-left: auto;
 }
 .e-dropdown-popup.e-borders-ddb .e-menu-wrapper {
   border: 0;
 }
 .e-dropdown-popup.e-borders-ddb .e-menu-wrapper ul .e-menu-item .e-menu-icon {
-  font-size: 16px;
+  font-size: 14px;
 }
 .e-dropdown-popup.e-popup.e-aggregate-list ul {
-  font-size: 13px;
+  font-size: 14px;
 }
 
 .e-menu-wrapper.e-file-menu ul .e-menu-item div {
@@ -2157,7 +2152,7 @@
   width: 100%;
 }
 .e-menu-wrapper.e-file-menu ul .e-menu-item div .e-extension {
-  font-size: 13px;
+  font-size: 14px;
   margin-left: auto;
   opacity: 0.7;
   padding-left: 12px;
@@ -2503,7 +2498,7 @@
   margin-top: 0;
 }
 .e-spreadsheet:not(.e-mobile-view) .e-aggregate-list {
-  font-size: 13px;
+  font-size: 14px;
   margin-left: auto;
 }
 .e-spreadsheet:not(.e-mobile-view) .e-ribbon {
@@ -2668,7 +2663,7 @@
 }
 .e-bigger .e-spreadsheet .e-find-dlg .e-footer-content .e-btn,
 .e-bigger.e-spreadsheet .e-find-dlg .e-footer-content .e-btn {
-  font-size: 11px;
+  font-size: 12px;
   margin-top: 6px;
 }
 .e-bigger .e-spreadsheet .e-findtool-dlg,
@@ -3854,7 +3849,7 @@
   background-color: rgba(255, 255, 255, 0.1);
 }
 
-.e-ribbon .e-content .e-toolbar .e-toolbar-items .e-toolbar-item.e-overlay .e-icons {
+.e-spreadsheet .e-ribbon .e-content .e-toolbar .e-toolbar-items .e-toolbar-item.e-overlay .e-icons {
   color: #f0f0f0;
 }
 

package/styles/spreadsheet/bootstrap-dark.scss

@@ -1,5 +1,5 @@
 @import 'ej2-base/styles/bootstrap-dark-definition.scss';
-@import '../ribbon/bootstrap-dark-definition.scss';
+@import '../spreadsheet-ribbon/bootstrap-dark-definition.scss';
 @import 'ej2-buttons/styles/button/bootstrap-dark-definition.scss';
 @import 'ej2-buttons/styles/check-box/bootstrap-dark-definition.scss';
 @import 'ej2-buttons/styles/radio-button/bootstrap-dark-definition.scss';