@syncfusion/ej2-vue-documenteditor 19.2.60 → 19.3.45

package/styles/document-editor-container/material.css

@@ -467,13 +467,18 @@
   font-size: 14px;
 }
 
+.e-de-statusbar-pageweb .e-de-printlayout:hover,
+.e-de-statusbar-pageweb .e-de-weblayout:hover {
+  font-size: 14px;
+}
+
 .e-bigger .e-btn.e-de-statusbar-pageweb {
   padding: 0;
 }
 
 .e-bigger .e-de-statusbar-pageweb .e-de-printlayout,
 .e-bigger .e-de-statusbar-pageweb .e-de-weblayout {
-  font-size: 14px;
+  font-size: 16px;
 }
 
 .e-de-linespacing {
@@ -490,8 +495,6 @@
 
 .e-de-pagenumber-text {
   border: none !important;
-  height: 22px !important;
-  margin-top: -2px !important;
 }
 
 .e-de-pagenumber-input {
@@ -499,8 +502,7 @@
   border: 1px solid #eee;
   border-radius: 2px;
   color: #000;
-  height: 22px;
-  padding: 2px;
+  padding: 0px;
   text-align: center;
   width: 22px;
 }
@@ -523,6 +525,7 @@
 
 .e-de-ctn-title {
   background-color: #3f51b5;
+  border-bottom: none !important;
   color: #fff;
 }
 
@@ -746,10 +749,6 @@
   width: 100%;
 }
 
-.de-split-button > div:first-child {
-  margin-right: 0;
-}
-
 .e-de-ctnr-properties-pane-btn {
   width: 75px;
 }
@@ -1120,6 +1119,52 @@
   box-shadow: none !important;
 }
 
+.e-de-ctnr-group-btn-top > button:first-child {
+  border-radius: 0;
+  border-top-left-radius: 4px;
+}
+
+.e-de-ctnr-group-btn-top.e-de-rtl > button:first-child {
+  border-top-left-radius: 0;
+  border-top-right-radius: 4px;
+}
+
+.e-de-ctnr-group-btn-top > button:last-child {
+  border-radius: 0;
+  border-top-right-radius: 4px;
+}
+
+.e-de-ctnr-group-btn-top.e-de-rtl > button:last-child {
+  border-top-left-radius: 4px;
+  border-top-right-radius: 0;
+}
+
+.e-de-ctnr-group-btn-middle > button {
+  border-radius: 0;
+  border-top: 0;
+  border-bottom: 0;
+}
+
+.e-de-ctnr-group-btn-bottom > button:first-child {
+  border-radius: 0;
+  border-bottom-left-radius: 4px;
+}
+
+.e-de-ctnr-group-btn-bottom.e-de-rtl > button:first-child {
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 4px;
+}
+
+.e-de-ctnr-group-btn-bottom > button:last-child {
+  border-radius: 0;
+  border-bottom-right-radius: 4px;
+}
+
+.e-de-ctnr-group-btn-bottom.e-de-rtl > button:last-child {
+  border-bottom-right-radius: 0;
+  border-bottom-left-radius: 4px;
+}
+
 .e-de-toc-template1 {
   background: #fafafa;
   border: 1px solid #eee;
@@ -1198,6 +1243,10 @@
   width: 100px;
 }
 
+.e-de-ctnr-pg-no span {
+  border: 1px solid transparent;
+}
+
 .e-de-ctnr-pg-no-spellout {
   color: #000;
   display: -ms-inline-flexbox;
@@ -1208,6 +1257,10 @@
   width: calc(100% - 140px);
 }
 
+.e-de-ctnr-pg-no-spellout span {
+  border: 1px solid transparent;
+}
+
 .e-bigger .e-de-ctnr-pg-no-spellout {
   color: #000;
   display: -ms-inline-flexbox;
@@ -1496,8 +1549,8 @@
   margin-bottom: 16px;
 }
 
-.e-bigger .e-de-ctnr-segment > div:first-child,
-.e-bigger .e-de-ctnr-segment > button:first-child {
+.e-bigger .e-de-ctnr-segment > div:first-child:not(.e-rtl),
+.e-bigger .e-de-ctnr-segment > button:first-child:not(.e-rtl) {
   margin-right: 12px;
 }
 
@@ -1633,7 +1686,6 @@
 .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn-text {
   display: table;
   font-size: 13px;
-  font-size: 12px;
   margin: 0 6px;
   padding: 0;
   white-space: normal;
@@ -1711,9 +1763,8 @@
 .e-bigger .e-de-ctnr-hglt-color {
   font-size: 12px;
   font-weight: 400;
-  height: 25px !important;
-  width: 25px !important;
-  border-radius: 4px;
+  height: 22px !important;
+  width: 22px !important;
 }
 
 .e-bigger .e-de-ctnr-list {
@@ -1827,6 +1878,7 @@
 .e-de-ctn .e-de-bzr-button {
   font-size: 12px;
   font-weight: 400;
+  background: #fafafa;
 }
 
 .e-de-ctn .e-de-bzr-button:active {

package/styles/document-editor-container/tailwind-dark.css

@@ -1,3 +1,4 @@
+@charset "UTF-8";
 @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
 .e-de-ctnr-close::before {
   color: #d1d5db;
@@ -527,7 +528,7 @@
 }
 
 .e-hglt-no-color:hover {
-  background-color: #d3d3d3;
+  background-color: #374151;
   cursor: pointer;
 }
 
@@ -549,8 +550,6 @@
   border: 0;
   box-shadow: none;
   float: right;
-  height: 33px;
-  width: 33px;
 }
 
 .e-de-statusbar-pageweb:hover {
@@ -559,16 +558,17 @@
 
 .e-de-statusbar-pageweb .e-de-printlayout,
 .e-de-statusbar-pageweb .e-de-weblayout {
-  font-size: 14px;
+  font-size: 18px;
 }
 
-.e-bigger .e-btn.e-de-statusbar-pageweb {
-  padding: 0;
+.e-de-statusbar-pageweb .e-de-printlayout:hover,
+.e-de-statusbar-pageweb .e-de-weblayout:hover {
+  font-size: 18px;
 }
 
 .e-bigger .e-de-statusbar-pageweb .e-de-printlayout,
 .e-bigger .e-de-statusbar-pageweb .e-de-weblayout {
-  font-size: 16px;
+  font-size: 18px;
 }
 
 .e-de-linespacing {
@@ -585,8 +585,6 @@
 
 .e-de-pagenumber-text {
   border: none !important;
-  height: 22px !important;
-  margin-top: -3px !important;
 }
 
 .e-de-pagenumber-input {
@@ -594,12 +592,17 @@
   border: 1px solid #4b5563;
   border-radius: 2px;
   color: #9ca3af;
-  height: 22px;
-  padding: 2px;
+  font-family: inherit;
+  font-size: 14px;
+  padding: 0px;
   text-align: center;
   width: 22px;
 }
 
+.e-bigger .e-de-pagenumber-input {
+  font-size: 16px;
+}
+
 .e-btn-pageweb-toggle {
   background-color: #4b5563;
   box-shadow: none;
@@ -622,7 +625,32 @@
 
 .e-de-ctn-title {
   background-color: #22d3ee;
+  border-bottom: none !important;
   color: #000;
+  font-size: 14px !important;
+}
+
+.e-de-ctn-title button {
+  font-size: 14px !important;
+  height: 36px ​ !important;
+}
+
+.e-de-ctn-title button .e-btn-icon {
+  font-size: 16px !important;
+}
+
+.e-bigger .e-de-ctn-title {
+  font-size: 16px !important;
+  height: 40px !important;
+}
+
+.e-bigger .e-de-ctn-title button {
+  font-size: 16px !important;
+  height: auto ​ !important;
+}
+
+.e-bigger .e-de-ctn-title button .e-btn-icon {
+  font-size: 18px !important;
 }
 
 .e-de-tool-ctnr-properties-pane {
@@ -671,7 +699,7 @@
 .e-de-ctnr-toolbar {
   display: -ms-flexbox;
   display: flex;
-  height: 75px;
+  height: 85px;
   width: 100%;
 }
 
@@ -696,11 +724,11 @@
 }
 
 .e-de-ctnr-segment {
-  margin-bottom: 8px;
+  margin-bottom: 12px;
 }
 
 .e-de-insert-del-cell > div:last-child {
-  margin-left: 8px !important;
+  margin-left: 10px !important;
 }
 
 .e-bigger .e-de-ctnr-prop-label,
@@ -718,11 +746,20 @@
 }
 
 .e-bigger .e-de-ctnr-group-btn .e-btn .e-btn-icon {
-  margin-left: -3px;
+  margin-left: -5px;
 }
 
-.e-de-ctnr-group-btn .e-btn .e-btn-icon {
-  margin-left: 0;
+.e-bigger .e-de-ctnr-group-btn .e-btn .e-btn-icon:not(.e-caret) {
+  font-size: 18px;
+}
+
+.e-bigger .e-de-pane-rtl .e-de-ctnr-group-btn .e-btn .e-btn-icon {
+  margin-left: 0px;
+  margin-right: -5px;
+}
+
+.e-de-ctnr-group-btn .e-btn .e-btn-icon:not(.e-caret) {
+  font-size: 16px;
 }
 
 .e-de-property-div-padding .e-de-cellmargin-text {
@@ -735,29 +772,29 @@
 
 .e-de-font-clr-picker .e-colorpicker-wrapper:first-child,
 .e-de-font-clr-picker > .e-split-btn-wrapper {
-  margin-right: 8px;
+  margin-right: 10px;
 }
 
 .e-de-font-clr-picker.e-rtl .e-colorpicker-wrapper:first-child,
 .e-de-font-clr-picker.e-rtl > .e-split-btn-wrapper {
-  margin-left: 8px;
+  margin-left: 10px;
   margin-right: 0;
 }
 
 .e-de-ctnr-segment > div:first-child:not(.e-rtl),
 .e-de-ctnr-segment > button:first-child:not(.e-rtl) {
-  margin-right: 8px;
+  margin-right: 10px;
 }
 
 .e-de-ctnr-segment.e-de-ctnr-segment-rtl > div:first-child,
 .e-de-ctnr-segment.e-de-ctnr-segment-rtl > button:first-child {
-  margin-left: 8px;
+  margin-left: 10px;
   margin-right: 0;
 }
 
 .e-de-tlbr-wrapper {
   background-color: #374151;
-  height: 75px;
+  height: 85px;
   width: calc(100% - 75px);
 }
 
@@ -767,8 +804,8 @@
   font-size: 14px;
   font-weight: 500;
   letter-spacing: 0.05px;
-  margin-bottom: 12px;
   line-height: 1.5;
+  margin-bottom: 12px;
   opacity: 0.87;
 }
 
@@ -826,7 +863,7 @@
 }
 
 .e-de-toolbar.e-toolbar .e-toolbar-items {
-  height: 75px;
+  height: 85px;
 }
 
 .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-de-separator {
@@ -886,10 +923,6 @@
   width: 100%;
 }
 
-.de-split-button > div:first-child {
-  margin-right: 8px;
-}
-
 .e-de-ctnr-properties-pane-btn {
   width: 75px;
 }
@@ -925,12 +958,12 @@
 
 .e-de-showhide-btn {
   border: 0;
-  height: 75px;
+  height: 85px;
 }
 
 .e-de-showhide-btn-rtl {
   border: 0;
-  height: 75px;
+  height: 85px;
 }
 
 .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item:not(.e-separator) {
@@ -1082,8 +1115,9 @@
 .e-de-ctnr-hglt-color {
   font-size: 12px;
   font-weight: 400;
-  height: 18px !important;
-  width: 18px !important;
+  height: 20px !important;
+  width: 20px !important;
+  border-radius: 4px;
 }
 
 .e-de-font-clr-picker > div div button,
@@ -1253,6 +1287,52 @@
   box-shadow: none !important;
 }
 
+.e-de-ctnr-group-btn-top > button:first-child {
+  border-radius: 0;
+  border-top-left-radius: 4px;
+}
+
+.e-de-ctnr-group-btn-top.e-de-rtl > button:first-child {
+  border-top-left-radius: 0;
+  border-top-right-radius: 4px;
+}
+
+.e-de-ctnr-group-btn-top > button:last-child {
+  border-radius: 0;
+  border-top-right-radius: 4px;
+}
+
+.e-de-ctnr-group-btn-top.e-de-rtl > button:last-child {
+  border-top-left-radius: 4px;
+  border-top-right-radius: 0;
+}
+
+.e-de-ctnr-group-btn-middle > button {
+  border-radius: 0;
+  border-top: 0;
+  border-bottom: 0;
+}
+
+.e-de-ctnr-group-btn-bottom > button:first-child {
+  border-radius: 0;
+  border-bottom-left-radius: 4px;
+}
+
+.e-de-ctnr-group-btn-bottom.e-de-rtl > button:first-child {
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 4px;
+}
+
+.e-de-ctnr-group-btn-bottom > button:last-child {
+  border-radius: 0;
+  border-bottom-right-radius: 4px;
+}
+
+.e-de-ctnr-group-btn-bottom.e-de-rtl > button:last-child {
+  border-bottom-right-radius: 0;
+  border-bottom-left-radius: 4px;
+}
+
 .e-de-toc-template1 {
   background: #fff;
   border: 1px solid #4b5563;
@@ -1318,7 +1398,7 @@
   background-color: #374151;
   display: -ms-flexbox;
   display: flex;
-  padding-top: 3.5px;
+  padding-top: 0;
   width: 100%;
 }
 
@@ -1326,30 +1406,38 @@
   color: #9ca3af;
   display: -ms-inline-flexbox;
   display: inline-flex;
-  font-size: 12px;
+  font-size: 14px;
   height: 100%;
   padding-top: 8px;
   width: 110px;
 }
 
+.e-de-ctnr-pg-no span {
+  border: 1px solid transparent;
+}
+
 .e-de-ctnr-pg-no-spellout {
   color: #9ca3af;
   display: -ms-inline-flexbox;
   display: inline-flex;
-  font-size: 12px;
+  font-size: 14px;
   height: 100%;
   padding-top: 8px;
-  width: calc(100% - 152px);
+  width: calc(100% - 170px);
+}
+
+.e-de-ctnr-pg-no-spellout span {
+  border: 1px solid transparent;
 }
 
 .e-bigger .e-de-ctnr-pg-no-spellout {
   color: #9ca3af;
   display: -ms-inline-flexbox;
   display: inline-flex;
-  font-size: 14px;
+  font-size: 16px;
   height: 100%;
-  padding-top: 8px;
-  width: calc(100% - 168px);
+  padding-top: 7px;
+  width: calc(100% - 205px);
 }
 
 .e-de-statusbar-zoom-spell {
@@ -1503,7 +1591,7 @@
 }
 
 .e-bigger .de-split-button > div:first-child {
-  margin-right: 16px;
+  margin-right: 0;
 }
 
 .e-bigger .e-de-border-clr-picker .e-split-btn-wrapper > button:first-child {
@@ -1646,8 +1734,8 @@
   margin-right: 0;
 }
 
-.e-bigger .e-de-ctnr-segment > div:first-child,
-.e-bigger .e-de-ctnr-segment > button:first-child {
+.e-bigger .e-de-ctnr-segment > div:first-child:not(.e-rtl),
+.e-bigger .e-de-ctnr-segment > button:first-child:not(.e-rtl) {
   margin-right: 16px;
 }
 
@@ -1850,8 +1938,8 @@
 .e-bigger .e-de-ctnr-hglt-color {
   font-size: 12px;
   font-weight: 400;
-  height: 25px !important;
-  width: 25px !important;
+  height: 24px !important;
+  width: 24px !important;
   border-radius: 4px;
 }
 
@@ -1968,7 +2056,6 @@
   background: #4b5563;
   border: none;
   border-radius: 4px;
-  color: #fff;
 }
 
 .e-de-ctn .e-de-ctnr-toolbar .e-de-bzr-button .e-btn-icon {