@syncfusion/ej2-angular-spreadsheet 20.4.54 → 21.1.35

package/styles/tailwind.css

@@ -284,7 +284,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,
@@ -684,7 +684,7 @@
 }
 .e-spreadsheet .e-protect-dlg.e-dialog {
   height: 470px;
-  width: 287px;
+  width: 289px;
 }
 .e-spreadsheet .e-protect-dlg.e-dialog .e-sheet-password-content .e-header {
   font-size: 14px;
@@ -731,7 +731,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 {
@@ -796,7 +796,7 @@
   height: 300px;
 }
 .e-spreadsheet .e-protect-content {
-  font-size: 13px;
+  font-size: 14px;
   height: 37px;
   padding-top: 20px;
   width: 100%;
@@ -881,7 +881,7 @@
   text-align: center;
   transition: transform 300ms ease;
   width: 18px;
-  font-size: 10px;
+  font-size: 18px;
   font-size: 18px;
   line-height: 25px;
 }
@@ -1536,7 +1536,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;
@@ -1893,7 +1893,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;
 }
@@ -1929,11 +1929,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;
@@ -2101,7 +2096,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;
@@ -2184,17 +2179,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 {
@@ -2203,7 +2198,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;
@@ -2472,9 +2467,8 @@
 }
 .e-spreadsheet-function-dlg.e-dialog .e-dlg-content .e-category-content {
   font-size: 12px;
-  font-weight: 500;
+  font-weight: 700;
   margin-bottom: 0;
-  font-weight: 600;
   padding: 10px 0;
 }
 .e-spreadsheet-function-dlg.e-dialog .e-dlg-content .e-formula-description {
@@ -2551,7 +2545,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 {
@@ -2693,7 +2687,7 @@
 }
 .e-bigger .e-spreadsheet:not(.e-mobile-view) .e-formula-bar-panel .e-formula-bar,
 .e-bigger.e-spreadsheet:not(.e-mobile-view) .e-formula-bar-panel .e-formula-bar {
-  font-size: 15px;
+  font-size: 16px;
   height: 29px;
   line-height: 29px;
 }
@@ -2726,12 +2720,12 @@
 .e-bigger .e-spreadsheet .e-filter-icon,
 .e-bigger.e-spreadsheet .e-filter-icon {
   margin-bottom: 12px;
-  font-size: 21px;
+  font-size: 22px;
   margin-top: -3px;
 }
 .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,
@@ -3930,7 +3924,7 @@
   background-color: #e5e7eb;
 }
 
-.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: #6b7280;
 }
 
@@ -3957,74 +3951,74 @@
   opacity: 0.45;
 }
 
-.e-ribbon .e-drop-icon::before {
+.e-spreadsheet .e-ribbon .e-drop-icon::before {
   content: "\e729";
 }
-.e-ribbon .e-menu-wrapper.e-file-menu ul .e-menu-item .e-caret::before {
+.e-spreadsheet .e-ribbon .e-menu-wrapper.e-file-menu ul .e-menu-item .e-caret::before {
   content: "\e729";
 }
 
-.e-ribbon {
+.e-spreadsheet .e-ribbon {
   border: 1px solid #e5e7eb;
   position: relative;
 }
-.e-ribbon .e-tab .e-content .e-toolbar {
+.e-spreadsheet .e-ribbon .e-tab .e-content .e-toolbar {
   border-left-width: 0;
   border-right-width: 0;
 }
-.e-ribbon .e-tab .e-tab-header {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header {
   height: 35px;
   min-height: 35px;
 }
-.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
   height: 35px;
   min-height: 35px;
 }
-.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-tab-wrap {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-tab-wrap {
   height: 35px;
 }
-.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-text-wrap {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-text-wrap {
   height: 35px;
 }
-.e-ribbon .e-tab .e-tab-header .e-toolbar-items {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-items {
   height: 35px;
   min-height: 35px;
 }
-.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-scroll-nav {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-scroll-nav {
   height: 35px;
   min-height: 35px;
 }
-.e-ribbon .e-tab .e-tab-header .e-hscroll {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-hscroll {
   display: inline-block !important; /* stylelint-disable-line declaration-no-important */
   width: calc(100% - 28px);
 }
-.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-toolbar-item:nth-child(2) .e-tab-wrap {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-toolbar-item:nth-child(2) .e-tab-wrap {
   padding: 0;
 }
-.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-toolbar-item:nth-child(2) .e-text-wrap {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-toolbar-item:nth-child(2) .e-text-wrap {
   vertical-align: top;
 }
-.e-ribbon .e-tab .e-tab-header .e-indicator {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-indicator {
   z-index: 1;
 }
-.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-toolbar-item.e-hide {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-toolbar-item.e-hide {
   display: none;
 }
-.e-ribbon .e-tab .e-content .e-item {
+.e-spreadsheet .e-ribbon .e-tab .e-content .e-item {
   padding: 0;
 }
-.e-ribbon .e-tab .e-tab-header .e-toolbar-item {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-item {
   -webkit-user-select: none;
       -ms-user-select: none;
           user-select: none;
 }
-.e-ribbon .e-tab .e-tab-header .e-toolbar-item .e-tab-text {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-item .e-tab-text {
   text-transform: none;
 }
-.e-ribbon .e-tab.e-sheet-tab .e-tab-header .e-tab-text {
+.e-spreadsheet .e-ribbon .e-tab.e-sheet-tab .e-tab-header .e-tab-text {
   white-space: pre;
 }
-.e-ribbon .e-drop-icon {
+.e-spreadsheet .e-ribbon .e-drop-icon {
   cursor: pointer;
   font-family: "e-icons";
   margin: 8px 4px;
@@ -4035,114 +4029,115 @@
   transform: rotate(180deg);
   transition: transform 300ms ease;
   width: 18px;
-  font-size: 10px;
   font-size: 18px;
 }
-.e-ribbon .e-drop-icon.e-disabled {
+.e-spreadsheet .e-ribbon .e-drop-icon.e-disabled {
   cursor: default;
   pointer-events: none;
 }
-.e-ribbon.e-collapsed .e-content, .e-ribbon.e-collapsed .e-indicator, .e-ribbon.e-collapsed .e-tab-header .e-toolbar-item.e-active .e-text-wrap::before {
+.e-spreadsheet .e-ribbon.e-collapsed .e-content, .e-spreadsheet .e-ribbon.e-collapsed .e-indicator, .e-spreadsheet .e-ribbon.e-collapsed .e-tab-header .e-toolbar-item.e-active .e-text-wrap::before {
   display: none;
 }
-.e-ribbon.e-collapsed .e-drop-icon {
+.e-spreadsheet .e-ribbon.e-collapsed .e-drop-icon {
   transform: rotate(0deg);
 }
-.e-ribbon .e-content .e-toolbar.e-overlay .e-toolbar-items .e-toolbar-item.e-overlay {
+.e-spreadsheet .e-ribbon .e-content .e-toolbar .e-toolbar-items {
+  display: inline-block;
+}
+.e-spreadsheet .e-ribbon .e-content .e-toolbar.e-overlay .e-toolbar-items .e-toolbar-item.e-overlay {
   opacity: 1;
 }
-.e-ribbon .e-menu-wrapper {
+.e-spreadsheet .e-ribbon .e-menu-wrapper {
   border-width: 0;
 }
-.e-ribbon .e-menu-wrapper ul.e-menu {
+.e-spreadsheet .e-ribbon .e-menu-wrapper ul.e-menu {
   padding: 0;
 }
-.e-ribbon .e-menu-wrapper ul .e-menu-item.e-menu-caret-icon {
+.e-spreadsheet .e-ribbon .e-menu-wrapper ul .e-menu-item.e-menu-caret-icon {
   height: 35px;
   line-height: 35px;
 }
-.e-ribbon .e-menu-wrapper ul .e-menu-item.e-menu-caret-icon .e-caret {
+.e-spreadsheet .e-ribbon .e-menu-wrapper ul .e-menu-item.e-menu-caret-icon .e-caret {
   line-height: 35px;
 }
 
-.e-bigger .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu,
-.e-bigger.e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu {
+.e-bigger .e-spreadsheet .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu,
+.e-bigger.e-spreadsheet .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu {
   padding: 0;
 }
-.e-bigger .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon,
-.e-bigger.e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon {
+.e-bigger .e-spreadsheet .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon,
+.e-bigger.e-spreadsheet .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon {
   height: 41px;
   line-height: 41px;
 }
-.e-bigger .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon .e-caret,
-.e-bigger.e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon .e-caret {
+.e-bigger .e-spreadsheet .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon .e-caret,
+.e-bigger.e-spreadsheet .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon .e-caret {
   line-height: 41px;
 }
-.e-bigger .e-ribbon .e-drop-icon,
-.e-bigger.e-ribbon .e-drop-icon {
-  font-size: 12px;
-  margin: 16px 5px;
+.e-bigger .e-spreadsheet .e-ribbon .e-drop-icon,
+.e-bigger.e-spreadsheet .e-ribbon .e-drop-icon {
   font-size: 18px;
+  margin: 16px 5px;
   line-height: 8px;
 }
-.e-bigger .e-ribbon .e-tab .e-tab-header,
-.e-bigger.e-ribbon .e-tab .e-tab-header {
+.e-bigger .e-spreadsheet .e-ribbon .e-tab .e-tab-header,
+.e-bigger.e-spreadsheet .e-ribbon .e-tab .e-tab-header {
   height: 41px;
   min-height: 41px;
 }
-.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator),
-.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
+.e-bigger .e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator),
+.e-bigger.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
   height: 41px;
   min-height: 41px;
 }
-.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-tab-wrap,
-.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-tab-wrap {
+.e-bigger .e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-tab-wrap,
+.e-bigger.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-tab-wrap {
   height: 41px;
 }
-.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-text-wrap,
-.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-text-wrap {
+.e-bigger .e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-text-wrap,
+.e-bigger.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-text-wrap {
   height: 41px;
 }
-.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-items,
-.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-items {
+.e-bigger .e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-items,
+.e-bigger.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-items {
   height: 41px;
   min-height: 41px;
 }
-.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-scroll-nav,
-.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-scroll-nav {
+.e-bigger .e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-scroll-nav,
+.e-bigger.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-scroll-nav {
   height: 41px;
   min-height: 41px;
 }
 
-.e-ribbon {
+.e-spreadsheet .e-ribbon {
   background-color: #f3f4f6;
 }
-.e-ribbon .e-tab .e-tab-header {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header {
   background-color: inherit;
 }
-.e-ribbon .e-tab .e-tab-header .e-tab-wrap:focus {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-tab-wrap:focus {
   background: rgba(243, 244, 246, 0.12);
 }
-.e-ribbon .e-tab .e-tab-header .e-tab-wrap:focus .e-tab-icon,
-.e-ribbon .e-tab .e-tab-header .e-tab-wrap:focus .e-tab-text {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-tab-wrap:focus .e-tab-icon,
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-tab-wrap:focus .e-tab-text {
   color: #4f46e5;
 }
-.e-ribbon .e-drop-icon {
+.e-spreadsheet .e-ribbon .e-drop-icon {
   color: #6b7280;
 }
-.e-ribbon .e-tab .e-content .e-toolbar {
+.e-spreadsheet .e-ribbon .e-tab .e-content .e-toolbar {
   border-bottom-color: transparent;
   border-top-color: transparent;
 }
-.e-ribbon .e-tab .e-tab-header .e-toolbar-item.e-active {
+.e-spreadsheet .e-ribbon .e-tab .e-tab-header .e-toolbar-item.e-active {
   background: #f3f4f6;
 }
-.e-ribbon .e-tab .e-content .e-toolbar {
+.e-spreadsheet .e-ribbon .e-tab .e-content .e-toolbar {
   background: #f3f4f6;
 }
-.e-ribbon .e-tab .e-content .e-toolbar .e-toolbar-items, .e-ribbon .e-tab .e-content .e-toolbar .e-toolbar-item .e-btn.e-tbar-btn:not(:hover):not(:focus), .e-ribbon .e-tab .e-content .e-toolbar .e-toolbar-item.e-overlay {
+.e-spreadsheet .e-ribbon .e-tab .e-content .e-toolbar .e-toolbar-items, .e-spreadsheet .e-ribbon .e-tab .e-content .e-toolbar .e-toolbar-item .e-btn.e-tbar-btn:not(:hover):not(:focus), .e-spreadsheet .e-ribbon .e-tab .e-content .e-toolbar .e-toolbar-item.e-overlay {
   background: transparent;
 }
-.e-ribbon .e-menu-wrapper {
+.e-spreadsheet .e-ribbon .e-menu-wrapper {
   background-color: transparent;
 }

package/styles/tailwind.scss

@@ -1,2 +1,2 @@
 @import 'spreadsheet/tailwind.scss';
-@import 'ribbon/tailwind.scss';
+@import 'spreadsheet-ribbon/tailwind.scss';

package/styles/ribbon/_bootstrap-dark-definition.scss

@@ -1,13 +0,0 @@
-$ribbon-skin: 'bootstrap' !default;
-$ribbon-border-color: $grey-88 !default;
-$ribbon-border: 1px solid $ribbon-border-color !default;
-$ribbon-content-bg-color: $gray-darker !default;
-$ribbon-header-bg-color: #191919 !default;
-$file-menu-wrap-padding: 0 !default;
-$drop-icon-margin: 16.5px 4px 17.5px !default;
-$bigger-drop-icon-margin: 18.5px 5px 19.5px !default;
-$expand-icon-color: $grey-dark-font !default;
-$ribbon-header-height: 45px !default;
-$ribbon-focus-text-color: $grey-dark-font !default;
-$ribbon-focus-bg-color: $grey-44 !default;
-$ribbon-comb-icon-color: $grey-dark-font !default;

package/styles/ribbon/_bootstrap-definition.scss

@@ -1,12 +0,0 @@
-$ribbon-skin: 'bootstrap' !default;
-$ribbon-border-color: #e5e5e5 !default;
-$ribbon-border: 1px solid $ribbon-border-color !default;
-$ribbon-content-bg-color: $grey-white !default;
-$ribbon-header-bg-color: $grey-f9 !default;
-$file-menu-wrap-padding: 0 !default;
-$drop-icon-margin: 16.5px 4px 17.5px !default;
-$bigger-drop-icon-margin: 18.5px 5px 19.5px !default;
-$expand-icon-color: $gray-light !default;
-$ribbon-header-height: 45px !default;
-$ribbon-focus-bg-color: $grey-lighter !default;
-$ribbon-focus-text-color: $brand-primary-darken-25 !default;

package/styles/ribbon/_bootstrap4-definition.scss

@@ -1,13 +0,0 @@
-$ribbon-skin: 'bootstrap4' !default;
-$ribbon-border-color: $gray-300 !default;
-$ribbon-border: 1px solid $ribbon-border-color !default;
-$ribbon-header-bg-color: $gray-100 !default;
-$ribbon-content-bg-color: $white !default;
-$file-menu-wrap-padding: 0 !default;
-$drop-icon-margin: 15px 5px !default;
-$ribbon-comb-icon-color:  $gray-700 !default;
-$bigger-drop-icon-margin: 18.5px 5px 19.5px !default;
-$expand-icon-color: $gray-600 !default;
-$ribbon-header-height: 41px !default;
-$ribbon-focus-text-color: darken($primary, 15%) !default;
-$ribbon-focus-bg-color: #eee !default;

package/styles/ribbon/_bootstrap5-definition.scss

@@ -1,14 +0,0 @@
-$ribbon-skin: 'bootstrap5' !default;
-$file-menu-wrap-padding: 0 !default;
-$drop-icon-margin: 8px 4px !default;
-$bigger-drop-icon-margin: 16px 5px !default;
-$ribbon-border-color: $border-light !default;
-$ribbon-border: 1px solid $ribbon-border-color !default;
-$ribbon-content-bg-color: $content-bg-color !default;
-$ribbon-header-bg-color: $content-bg-color-alt1 !default;
-$separator-border-color: $border-light !default;
-$expand-icon-color: $icon-color !default;
-$ribbon-comb-icon-color:  $icon-color !default;
-$ribbon-focus-text-color: $primary-bg-color-pressed !default;
-$ribbon-focused-wrap-focus-border-color: $icon-color !default;
-$ribbon-focus-bg-color: rgba($content-bg-color-alt2, .12) !default;

package/styles/ribbon/_fabric-dark-definition.scss

@@ -1,14 +0,0 @@
-$ribbon-skin: 'fabric' !default;
-$border-color: $neutral-quintenary !default;
-$ribbon-border: 1px solid $border-color !default;
-$tab-header-height: 38px !default;
-$bigger-tab-header-height: 48px !default;
-$ribbon-header-bg-color: $neutral-lighter !default;
-$file-menu-wrap-padding: 0 0 0 8px !default;
-$drop-icon-margin: 12.5px 4px !default;
-$bigger-drop-icon-margin: 14.5px 5px !default;
-$ribbon-comb-icon-color: $neutral-light-font !default;
-$expand-icon-color: $neutral-light-font !default;
-$ribbon-focus-bg-color: initial !default;
-$ribbon-focus-text-color: $neutral-light-fontalt !default;
-$ribbon-focused-wrap-focus-border-color: $neutral-secondary-alt !default;

package/styles/ribbon/_fabric-definition.scss

@@ -1,14 +0,0 @@
-$ribbon-skin: 'fabric' !default;
-$border-color: $neutral-light !default;
-$ribbon-border: 1px solid $border-color !default;
-$tab-header-height: 38px !default;
-$bigger-tab-header-height: 48px !default;
-$ribbon-header-bg-color: $neutral-white !default;
-$ribbon-focused-wrap-focus-border-color: $neutral-secondary-alt !default;
-$file-menu-wrap-padding: 0 0 0 8px !default;
-$drop-icon-margin: 12.5px 4px !default;
-$bigger-drop-icon-margin: 14.5px 5px !default;
-$ribbon-comb-icon-color: $neutral-light-font !default;
-$expand-icon-color: $neutral-secondary !default;
-$ribbon-focus-bg-color: initial !default;
-$ribbon-focus-text-color: $neutral-light-font !default;

package/styles/ribbon/_fluent-definition.scss

@@ -1,14 +0,0 @@
-$ribbon-skin: 'FluentUI' !default;
-$file-menu-wrap-padding: 0 !default;
-$drop-icon-margin: 8px 4px !default;
-$bigger-drop-icon-margin: 16px 5px !default;
-$ribbon-border-color: $border-light !default;
-$ribbon-border: 1px solid $ribbon-border-color !default;
-$ribbon-content-bg-color: $content-bg-color !default;
-$ribbon-header-bg-color: $content-bg-color-alt1 !default;
-$ribbon-comb-icon-color:  $icon-color !default;
-$separator-border-color: $border-light !default;
-$ribbon-focus-text-color: $content-text-color !default;
-$expand-icon-color: $icon-color !default;
-$ribbon-focused-wrap-focus-border-color: $icon-color !default;
-$ribbon-focus-bg-color: $content-bg-color-alt2 !default;

package/styles/ribbon/_fusionnew-definition.scss

@@ -1,14 +0,0 @@
-$ribbon-skin: 'bootstrap5' !default;
-$file-menu-wrap-padding: 0 !default;
-$drop-icon-margin: 8px 4px !default;
-$bigger-drop-icon-margin: 16px 5px !default;
-$ribbon-border-color: $border-light !default;
-$ribbon-border: 1px solid $ribbon-border-color !default;
-$ribbon-content-bg-color: $content-bg-color !default;
-$ribbon-header-bg-color: $content-bg-color-alt1 !default;
-$ribbon-comb-icon-color:  $icon-color !default;
-$separator-border-color: $border-light !default;
-$ribbon-focus-text-color: $primary-bg-color-pressed !default;
-$expand-icon-color: $icon-color !default;
-$ribbon-focused-wrap-focus-border-color: $icon-color !default;
-$ribbon-focus-bg-color: rgba($content-bg-color-alt2, .12) !default;

package/styles/ribbon/_highcontrast-definition.scss

@@ -1,12 +0,0 @@
-$ribbon-skin: 'highcontrast' !default;
-$ribbon-border-color: $bg-base-100 !default;
-$ribbon-border: 1px solid $ribbon-border-color !default;
-$ribbon-header-bg-color: $bg-base-0 !default;
-$file-menu-wrap-padding: 0 !default;
-$ribbon-focused-wrap-focus-border-color: $hover-border !default;
-$drop-icon-margin: 12.5px 4px !default;
-$bigger-drop-icon-margin: 14.5px 5px !default;
-$ribbon-comb-icon-color: $content-font !default;
-$expand-icon-color: $content-font !default;
-$ribbon-focus-bg-color: initial !default;
-$ribbon-focus-text-color: $content-font !default;

package/styles/ribbon/_highcontrast-light-definition.scss

@@ -1,12 +0,0 @@
-$ribbon-skin: 'highcontrast' !default;
-$ribbon-border-color: transparent !default;
-$ribbon-border: 1px solid $ribbon-border-color !default;
-$file-menu-wrap-padding: 0 !default;
-$drop-icon-margin: 12.5px 4px !default;
-$bigger-drop-icon-margin: 14.5px 5px !default;
-$expand-icon-color: initial !default;
-$ribbon-comb-icon-color: $content-font !default;
-$ribbon-header-bg-color: transparent !default;
-$ribbon-focused-wrap-focus-border-color: $hover-border !default;
-$ribbon-focus-bg-color: initial !default;
-$ribbon-focus-text-color: $content-font !default;

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

@@ -1,15 +0,0 @@
-$ribbon-skin: 'material' !default;
-$ribbon-border-color: $grey-700 !default;
-$ribbon-border: 1px solid $ribbon-border-color !default;
-$tab-header-height: 36px !default;
-$bigger-tab-header-height: 48px !default;
-$ribbon-header-bg-color: $grey-900 !default;
-$file-menu-wrap-padding: 0 !default;
-$ribbon-hover-text-color: $grey-dark-font !default;
-$drop-icon-margin: 12.5px 4px !default;
-$bigger-drop-icon-margin: 14.5px 5px !default;
-$ribbon-comb-icon-color: rgba($accent, 1) !default;
-$separator-border-color: rgba($grey-white, .24) !default;
-$expand-icon-color: $grey-dark-font !default;
-$ribbon-focus-bg-color: rgba($accent, .12) !default;
-$ribbon-focus-text-color: rgba($accent, 1) !default;

package/styles/ribbon/_material-definition.scss

@@ -1,12 +0,0 @@
-$ribbon-skin: 'material' !default;
-$ribbon-border-color: $grey-300 !default;
-$ribbon-border: 1px solid $ribbon-border-color !default;
-$ribbon-header-bg-color: $grey-50 !default;
-$ribbon-focus-bg-color: rgba($accent, .12) !default;
-$file-menu-wrap-padding: 0 !default;
-$drop-icon-margin: 12.5px 4px !default;
-$ribbon-focus-text-color: rgba($accent, 1) !default;
-$bigger-drop-icon-margin: 14.5px 5px !default;
-$separator-border-color: #dcdcdc !default;
-$expand-icon-color: #5f6368 !default;
-$ribbon-comb-icon-color: rgba($accent, 1) !default;

package/styles/ribbon/_material3-definition.scss

@@ -1,15 +0,0 @@
-$ribbon-skin: 'bootstrap5' !default;
-$file-menu-wrap-padding: 0 !default;
-$drop-icon-margin: 8px 4px !default;
-$bigger-drop-icon-margin: 16px 5px !default;
-$ribbon-border-color: $border-light !default;
-$ribbon-border: 1px solid $ribbon-border-color !default;
-$ribbon-hover-text-color: $primary-bg-color-pressed !default;
-$ribbon-comb-icon-color:  $icon-color !default;
-$ribbon-content-bg-color: $content-bg-color !default;
-$ribbon-header-bg-color: $content-bg-color-alt1 !default;
-$ribbon-focused-wrap-focus-border-color: $icon-color !default;
-$separator-border-color: $border-light !default;
-$expand-icon-color: $icon-color !default;
-$ribbon-focus-bg-color: rgba($content-bg-color-alt2, .12) !default;
-$ribbon-focus-text-color: $primary-bg-color-pressed !default;

package/styles/ribbon/_tailwind-definition.scss

@@ -1,13 +0,0 @@
-$ribbon-skin: 'tailwind' !default;
-$file-menu-wrap-padding: 0 !default;
-$drop-icon-margin: 8px 4px !default;
-$bigger-drop-icon-margin: 16px 5px !default;
-$ribbon-border-color: $border-light !default;
-$ribbon-border: 1px solid $ribbon-border-color !default;
-$ribbon-content-bg-color: $content-bg-color-alt2 !default;
-$ribbon-header-bg-color: $content-bg-color-alt2 !default;
-$separator-border-color: $border-light !default;
-$expand-icon-color: $icon-color !default;
-$ribbon-comb-icon-color: $primary !default;
-$ribbon-focus-bg-color: rgba($content-bg-color-alt2, .12) !default;
-$ribbon-focus-text-color: $primary !default;