@syncfusion/ej2-angular-documenteditor 20.4.54 → 21.1.35

package/styles/bootstrap5.css

@@ -42,6 +42,11 @@
   font-family: "e-icons";
   font-size: 13px;
 }
+.e-documenteditor .e-de-multi-cmt-mark::before {
+  color: #6c757d;
+  content: "\e8bc";
+  font-family: "e-icons";
+}
 .e-documenteditor .e-de-cmt-post::before {
   content: "\e71d";
   font-family: "e-icons";
@@ -123,40 +128,43 @@
 .e-de-table-left-alignment::before {
   color: #6c757d;
   content: "\e7f6";
-  font-size: 46px;
+  font-size: 48px;
 }
 
 .e-de-table-center-alignment::before {
   color: #6c757d;
   content: "\e7f1";
-  font-size: 46px;
+  font-size: 48px;
 }
 
 .e-de-table-right-alignment::before {
   color: #6c757d;
   content: "\e703";
-  font-size: 46px;
+  font-size: 48px;
 }
 
 .e-de-tablecell-top-alignment::before {
   color: #6c757d;
   content: "\e775";
   font-family: "e-icons";
-  font-size: 51px;
+  font-size: 48px;
+  margin: 2px;
 }
 
 .e-de-tablecell-center-alignment::before {
   color: #6c757d;
   content: "\e7e5";
   font-family: "e-icons";
-  font-size: 51px;
+  font-size: 48px;
+  margin: 2px;
 }
 
 .e-de-tablecell-bottom-alignment::before {
   color: #6c757d;
   content: "\e7d9";
   font-family: "e-icons";
-  font-size: 51px;
+  font-size: 48px;
+  margin: 2px;
 }
 
 .e-de-table-border-setting {
@@ -204,14 +212,14 @@
 .e-de-table-border-none-setting::before {
   color: #6c757d;
   content: "\e7eb";
-  font-size: 38px;
+  font-size: 36px;
   position: absolute;
 }
 
 .e-de-table-border-box-setting::before {
   color: #6c757d;
   content: "\e834";
-  font-size: 34px;
+  font-size: 36px;
   left: 2px;
   position: absolute;
   top: 2px;
@@ -221,7 +229,7 @@
   color: #6c757d;
   content: "\e7e8";
   font-family: "e-icons";
-  font-size: 34px;
+  font-size: 36px;
   left: 2px;
   position: absolute;
   top: 2px;
@@ -230,7 +238,7 @@
 .e-de-table-border-custom-setting::before {
   color: #6c757d;
   content: "\e7d5";
-  font-size: 34px;
+  font-size: 36px;
   left: 2px;
   position: absolute;
   top: 2px;
@@ -239,14 +247,14 @@
 .e-de-para-border-none-setting::before {
   color: #6c757d;
   content: "\e890";
-  font-size: 38px;
+  font-size: 36px;
   position: absolute;
 }
 
 .e-de-para-border-box-setting::before {
   color: #6c757d;
   content: "\e891";
-  font-size: 34px;
+  font-size: 36px;
   left: 2px;
   position: absolute;
   top: 2px;
@@ -255,7 +263,7 @@
 .e-de-para-border-shadow-setting::before {
   color: #6c757d;
   content: "\e892";
-  font-size: 34px;
+  font-size: 36px;
   left: 2px;
   position: absolute;
   top: 2px;
@@ -264,7 +272,7 @@
 .e-de-para-border-custom-setting::before {
   color: #6c757d;
   content: "\e88f";
-  font-size: 34px;
+  font-size: 36px;
   left: 2px;
   position: absolute;
   top: 2px;
@@ -1676,7 +1684,7 @@ label[for*=_wholeWord_e-de-rtl] {
 .e-de-style-font-group-button .e-btn,
 .e-de-style-paragraph-group-button .e-btn,
 .e-de-style-paragraph-indent-group-button .e-btn {
-  background-color: #fff;
+  background: #fff;
   border-color: #dee2e6;
 }
 .e-de-style-font-group-button .e-btn:focus,
@@ -1848,7 +1856,7 @@ label[for*=_wholeWord_e-de-rtl] {
 
 .e-de-restrict-pane,
 .e-de-op {
-  background-color: #f8f9fa;
+  background: #f8f9fa;
 }
 
 .e-de-restrict-pane .e-tab-header .e-toolbar-items,
@@ -2518,7 +2526,7 @@ label[for*=_wholeWord_e-de-rtl] {
   margin-right: 20px;
 }
 
-.e-de-style-left-div .e-de-style-dlg-name-input {
+.e-de-style-dlg-name-input {
   height: 31px;
 }
 
@@ -4465,7 +4473,7 @@ label[for*=_wholeWord_e-de-rtl] {
 }
 
 .e-de-statusbar-pageweb {
-  background-color: #f8f9fa;
+  background: #f8f9fa;
   border: 0;
   box-shadow: none;
   float: right;
@@ -4492,12 +4500,22 @@ label[for*=_wholeWord_e-de-rtl] {
   font-size: 18px;
 }
 
+.e-listview .e-list-icon {
+  height: 24px;
+  width: 16px;
+  margin-right: 12px;
+}
+
+.e-de-listview-icon {
+  line-height: 22px;
+}
+
 .e-de-linespacing {
   margin-top: 8px;
 }
 
 .e-de-statusbar-zoom {
-  background-color: #f8f9fa;
+  background: #f8f9fa;
   border: 0;
   color: #495057;
   float: right;
@@ -4634,7 +4652,7 @@ label[for*=_wholeWord_e-de-rtl] {
 
 .e-de-tool-ctnr-properties-pane,
 .e-de-ctnr-properties-pane {
-  background-color: #f8f9fa;
+  background: #f8f9fa;
   border-bottom: 1px solid #dee2e6;
   border-top: 1px solid #dee2e6;
 }
@@ -4781,7 +4799,7 @@ label[for*=_wholeWord_e-de-rtl] {
   margin: 0 14px;
 }
 .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-de-toolbar-btn-start {
-  margin-left: 8px;
+  margin-left: 8px !important;
   margin-right: 4px;
 }
 .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-de-toolbar-btn-middle {
@@ -4797,20 +4815,23 @@ label[for*=_wholeWord_e-de-rtl] {
 }
 
 .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn {
+  -ms-flex-direction: column;
+      flex-direction: column;
+  height: calc(100% - 10px);
   padding: 0;
-  padding-bottom: 14px;
+  padding-bottom: 10px;
 }
 .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn:focus {
   padding: 0;
-  padding-bottom: 14px;
+  padding-bottom: 10px;
 }
 .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn:active {
   padding: 0;
-  padding-bottom: 14px;
+  padding-bottom: 10px;
 }
 .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn:hover {
   padding: 0;
-  padding-bottom: 14px;
+  padding-bottom: 10px;
 }
 
 .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn .e-tbar-btn-text {
@@ -4856,7 +4877,7 @@ label[for*=_wholeWord_e-de-rtl] {
 }
 
 .e-de-ctnr-group-btn .e-btn {
-  background-color: #fff;
+  background: #fff;
   border-color: #dee2e6;
 }
 .e-de-ctnr-group-btn .e-btn:focus {
@@ -4949,7 +4970,7 @@ label[for*=_wholeWord_e-de-rtl] {
 }
 
 .e-de-ctnr-properties-pane-btn .e-btn {
-  background-color: #f8f9fa;
+  background: #f8f9fa;
   border-radius: 0;
   box-shadow: none;
   color: #0d6efd;
@@ -4991,6 +5012,7 @@ label[for*=_wholeWord_e-de-rtl] {
 .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item button.e-btn.e-tbtn-txt .e-icons.e-btn-icon,
 .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn.e-tbtn-txt .e-icons.e-btn-icon {
   padding: 0 !important;
+  min-height: 16px;
 }
 
 .e-de-hdr-ftr-frst-div {
@@ -5099,7 +5121,7 @@ label[for*=_wholeWord_e-de-rtl] {
 }
 
 .e-bigger .e-de-panel-right-width {
-  width: 86px;
+  width: 96px;
 }
 .e-bigger .e-de-char-fmt-btn-left > button,
 .e-bigger .e-de-char-fmt-btn-right > button {
@@ -5354,8 +5376,8 @@ label[for*=_wholeWord_e-de-rtl] {
   border: 1px solid #dee2e6;
   color: #495057;
   height: 129px;
-  margin-left: 78px;
   width: 94px;
+  margin-left: 78px;
 }
 
 .e-de-toc-template1.e-de-rtl {
@@ -5410,7 +5432,7 @@ label[for*=_wholeWord_e-de-rtl] {
 }
 
 .e-de-status-bar {
-  background-color: #f8f9fa;
+  background: #f8f9fa;
   display: -ms-flexbox;
   display: flex;
   padding-top: 4px;
@@ -5543,8 +5565,8 @@ label[for*=_wholeWord_e-de-rtl] {
 }
 
 .e-de-grp-btn-ctnr .e-de-ctnr-group-btn > button {
-  height: 38px;
   width: 39px;
+  height: 38px;
 }
 
 .e-bigger .e-de-grp-btn-ctnr .e-de-ctnr-group-btn > button {
@@ -5556,6 +5578,15 @@ label[for*=_wholeWord_e-de-rtl] {
   width: 70px;
 }
 
+.e-rtl .e-listview .e-list-icon {
+  height: 24px;
+  width: 16px;
+  margin-left: 12px;
+}
+.e-rtl .e-de-listview-icon {
+  line-height: 22px;
+}
+
 .e-bigger .de-split-button > div:first-child {
   margin-right: 0;
 }
@@ -5680,7 +5711,7 @@ label[for*=_wholeWord_e-de-rtl] {
   margin: 0 16px;
 }
 .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-de-toolbar-btn-start {
-  margin-left: 12px;
+  margin-left: 12px !important;
   margin-right: 6px;
 }
 .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-de-toolbar-btn-middle {
@@ -5697,22 +5728,22 @@ label[for*=_wholeWord_e-de-rtl] {
 .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn,
 .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn.e-control {
   padding: 0;
-  padding-bottom: 14px;
+  padding-bottom: 10px;
 }
 .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn:focus,
 .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn.e-control:focus {
   padding: 0;
-  padding-bottom: 14px;
+  padding-bottom: 10px;
 }
 .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn:active,
 .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn.e-control:active {
   padding: 0;
-  padding-bottom: 14px;
+  padding-bottom: 10px;
 }
 .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn:hover,
 .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn.e-control:hover {
   padding: 0;
-  padding-bottom: 14px;
+  padding-bottom: 10px;
 }
 .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn .e-tbar-btn-text {
   padding: 0 !important;
@@ -5728,7 +5759,7 @@ label[for*=_wholeWord_e-de-rtl] {
   width: 75px;
 }
 .e-bigger .e-de-ctnr-properties-pane-btn .e-btn {
-  background-color: #f8f9fa;
+  background: #f8f9fa;
   border-radius: 0;
   box-shadow: none;
   min-height: 100%;
@@ -5914,6 +5945,22 @@ label[for*=_wholeWord_e-de-rtl] {
   height: 0;
   line-height: 0.5;
 }
+.e-bigger .e-listview .e-list-icon {
+  height: 24px;
+  width: 16px;
+  margin-right: 16px;
+}
+.e-bigger .e-de-listview-icon {
+  line-height: 22px;
+}
+.e-bigger .e-rtl .e-listview .e-list-icon {
+  height: 24px;
+  width: 16px;
+  margin-left: 16px;
+}
+.e-bigger .e-rtl .e-de-listview-icon {
+  line-height: 22px;
+}
 
 .e-de-ctn .e-de-bzr-button {
   background: #f8f9fa;

package/styles/document-editor/_bootstrap5-definition.scss

@@ -279,11 +279,11 @@ $de-font-checkbox-label-font-size: $text-sm !default;
 $de-op-icon-font-size: $text-sm !default;
 $de-op-close-icon-size: $text-sm !default;
 $de-op-close-icon-margin-left: -4px !default;
-$de-table-alignment-font-size: 46px !default;
+$de-table-alignment-font-size: $text-5xl !default;
 $de-table-alignment-top: 126px !default;
-$de-tablecell-alignment-font-size: 51px !default;
-$de-border-none-setting-font-size: 38px !default;
-$de-border-setting-font-size: 34px !default;
+$de-tablecell-alignment-font-size: $text-5xl !default;
+$de-border-none-setting-font-size: $text-4xl !default;
+$de-border-setting-font-size: $text-4xl !default;
 $de-td-table-border-top: 2px !default;
 $de-hyperlink-bookmark-check-margin-top: 12px !default;
 $de-table-ppty-dlg-measure-div-margin-left: 12px !default;
@@ -459,7 +459,7 @@ $de-para-dlg-right-contaner-top: 0 !default;
 $de-para-dlg-sub-title-bottom-margin: 4px !default;
 $de-para-dlg-sub-title-top-margin: 8px !default;
 $de-para-dlg-rtl-btn-margin-right: 24px !default;
-$de-para-dlg-rtl-btn-font-size: 12px !default;
+$de-para-dlg-rtl-btn-font-size: $text-xs !default;
 $de-para-dlg-rtl-btn-width: 200px !default;
 $de-de-rtl-btn-div-e-de-rtl-margin-right: 24px !default;
 $de-de-rtl-btn-div-e-de-rtl-margin-left: 12px !default;
@@ -557,4 +557,4 @@ $de-style-dlg-btn-bg-color: $content-bg-color;
 $de-row-height-bottom-margin: 4px;
 
 //Columns Dialog
-$de-column-presets-font-size: 60px !default;
+$de-column-presets-font-size: $text-6xl !default;

package/styles/document-editor/_fluent-definition.scss

@@ -296,11 +296,11 @@ $de-font-checkbox-label-font-size: $text-sm !default;
 $de-op-icon-font-size: $text-sm !default;
 $de-op-close-icon-size: $text-sm !default;
 $de-op-close-icon-margin-left: -4px !default;
-$de-table-alignment-font-size: 42px !default;
+$de-table-alignment-font-size: $text-5xl !default;
 $de-table-alignment-top: 126px !default;
-$de-tablecell-alignment-font-size: 51px !default;
-$de-border-none-setting-font-size: 38px !default;
-$de-border-setting-font-size: 34px !default;
+$de-tablecell-alignment-font-size: $text-5xl !default;
+$de-border-none-setting-font-size: $text-4xl !default;
+$de-border-setting-font-size: $text-4xl !default;
 $de-td-table-border-top: 2px !default;
 $de-table-ppty-dlg-measure-div-margin-left: 12px !default;
 $de-table-ppty-dlg-measure-div-margin-top: 6px !default;
@@ -468,7 +468,7 @@ $de-para-dlg-right-contaner-top: 0 !default;
 $de-para-dlg-sub-title-bottom-margin: 8px !default;
 $de-para-dlg-sub-title-top-margin: 8px !default;
 $de-para-dlg-rtl-btn-margin-right: 24px !default;
-$de-para-dlg-rtl-btn-font-size: 12px !default;
+$de-para-dlg-rtl-btn-font-size: $text-xs !default;
 $de-para-dlg-rtl-btn-width: 200px !default;
 $de-de-rtl-btn-div-e-de-rtl-margin-right: 24px !default;
 $de-de-rtl-btn-div-e-de-rtl-margin-left: 12px !default;
@@ -566,4 +566,4 @@ $de-style-dlg-btn-bg-color: $content-bg-color;
 $de-row-height-bottom-margin: 4px;
 
 //Columns Dialog
-$de-column-presets-font-size: 60px !default;
+$de-column-presets-font-size: $text-6xl !default;

package/styles/document-editor/_tailwind-definition.scss

@@ -280,11 +280,11 @@ $de-font-checkbox-label-font-size: $text-sm !default;
 $de-op-icon-font-size: $text-sm !default;
 $de-op-close-icon-size: $text-sm !default;
 $de-op-close-icon-margin-left: -4px !default;
-$de-table-alignment-font-size: 46px !default;
+$de-table-alignment-font-size: $text-5xl !default;
 $de-table-alignment-top: 126px !default;
-$de-tablecell-alignment-font-size: 51px !default;
-$de-border-none-setting-font-size: 38px !default;
-$de-border-setting-font-size: 34px !default;
+$de-tablecell-alignment-font-size: $text-5xl !default;
+$de-border-none-setting-font-size: $text-4xl !default;
+$de-border-setting-font-size: $text-4xl !default;
 $de-td-table-border-top: 2px !default;
 $de-hyperlink-bookmark-check-margin-top: 12px !default;
 $de-table-ppty-dlg-measure-div-margin-left: 12px !default;
@@ -460,7 +460,7 @@ $de-para-dlg-right-contaner-top: 0 !default;
 $de-para-dlg-sub-title-bottom-margin: 4px !default;
 $de-para-dlg-sub-title-top-margin: 0 !default;
 $de-para-dlg-rtl-btn-margin-right: 24px !default;
-$de-para-dlg-rtl-btn-font-size: 12px !default;
+$de-para-dlg-rtl-btn-font-size: $text-xs !default;
 $de-para-dlg-rtl-btn-width: 200px !default;
 $de-de-rtl-btn-div-e-de-rtl-margin-right: 24px !default;
 $de-de-rtl-btn-div-e-de-rtl-margin-left: 12px !default;
@@ -554,4 +554,4 @@ $de-op-btn-icon-hover-clr: rgba(0, 0, 0, .75) !default;
 $de-cmt-separator: $border-light !default;
 
 //Columns Dialog
-$de-column-presets-font-size: 60px !default;
+$de-column-presets-font-size: $text-6xl !default;