@syncfusion/ej2-react-layouts 19.4.52 → 20.1.47

package/styles/splitter/tailwind-dark.css

@@ -1,24 +1,16 @@
 @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
 .e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler::before {
-  content: '\e855';
+  content: '\e7e3';
   font-family: 'e-icons';
   font-size: 14px;
 }
 
-.e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler.e-template-resize-handler::before {
-  content: '';
-}
-
 .e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler::before {
-  content: '\e858';
+  content: '\e7fd';
   font-family: 'e-icons';
   font-size: 14px;
 }
 
-.e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler.e-template-resize-handler::before {
-  content: '';
-}
-
 .e-bigger .e-splitter .e-split-bar .e-resize-handler::before {
   font-size: 16px;
 }
@@ -117,7 +109,7 @@
 
 .e-splitter.e-splitter-vertical.e-rtl .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down) {
   border-radius: 50%;
-  bottom: 18px;
+  bottom: 20px;
   right: 22px;
 }
 
@@ -125,7 +117,7 @@
   border-radius: 50%;
   left: 22px;
   right: auto;
-  top: 18px;
+  top: 20px;
 }
 
 .e-splitter.e-splitter-vertical.e-rtl .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
@@ -335,14 +327,14 @@
 
 .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down) {
   border-radius: 50%;
-  bottom: 18px;
+  bottom: 20px;
   left: 22px;
 }
 
 .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down {
   border-radius: 50%;
   right: 22px;
-  top: 18px;
+  top: 20px;
 }
 
 .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::before, .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
@@ -464,7 +456,7 @@
 }
 
 .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover .e-navigate-arrow.e-arrow-left, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover .e-navigate-arrow.e-arrow-right, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-navigate-arrow.e-arrow-left, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-navigate-arrow.e-arrow-right {
-  background-color: #000;
+  background-color: transparent;
   border-color: #22d3ee;
   border-width: 1px;
   opacity: .9;
@@ -519,7 +511,7 @@
 }
 
 .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-up, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-down, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-up, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-down {
-  background-color: #000;
+  background-color: transparent;
   border-color: #22d3ee;
   border-width: 1px;
   opacity: .9;

package/styles/splitter/tailwind.css

@@ -1,24 +1,16 @@
 @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
 .e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler::before {
-  content: '\e855';
+  content: '\e7e3';
   font-family: 'e-icons';
   font-size: 14px;
 }
 
-.e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler.e-template-resize-handler::before {
-  content: '';
-}
-
 .e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler::before {
-  content: '\e858';
+  content: '\e7fd';
   font-family: 'e-icons';
   font-size: 14px;
 }
 
-.e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler.e-template-resize-handler::before {
-  content: '';
-}
-
 .e-bigger .e-splitter .e-split-bar .e-resize-handler::before {
   font-size: 16px;
 }
@@ -117,7 +109,7 @@
 
 .e-splitter.e-splitter-vertical.e-rtl .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down) {
   border-radius: 50%;
-  bottom: 18px;
+  bottom: 20px;
   right: 22px;
 }
 
@@ -125,7 +117,7 @@
   border-radius: 50%;
   left: 22px;
   right: auto;
-  top: 18px;
+  top: 20px;
 }
 
 .e-splitter.e-splitter-vertical.e-rtl .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
@@ -335,14 +327,14 @@
 
 .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down) {
   border-radius: 50%;
-  bottom: 18px;
+  bottom: 20px;
   left: 22px;
 }
 
 .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down {
   border-radius: 50%;
   right: 22px;
-  top: 18px;
+  top: 20px;
 }
 
 .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::before, .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
@@ -464,7 +456,7 @@
 }
 
 .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover .e-navigate-arrow.e-arrow-left, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover .e-navigate-arrow.e-arrow-right, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-navigate-arrow.e-arrow-left, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-navigate-arrow.e-arrow-right {
-  background-color: #fff;
+  background-color: transparent;
   border-color: #4f46e5;
   border-width: 1px;
   opacity: .9;
@@ -519,7 +511,7 @@
 }
 
 .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-up, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-down, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-up, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-down {
-  background-color: #fff;
+  background-color: transparent;
   border-color: #4f46e5;
   border-width: 1px;
   opacity: .9;

package/styles/tailwind-dark.css

@@ -163,12 +163,12 @@
 
 .e-bigger .e-card .e-card-actions,
 .e-bigger.e-card .e-card-actions {
-  padding: 12px 24px;
+  padding: 24px 24px;
 }
 
 .e-bigger .e-card .e-card-actions.e-card-vertical,
 .e-bigger.e-card .e-card-actions.e-card-vertical {
-  padding: 12px 24px 12px 24px;
+  padding: 12px 24px 24px 24px;
 }
 
 .e-bigger .e-card .e-card-actions.e-card-vertical .e-card-btn,
@@ -212,7 +212,7 @@
 
 .e-bigger .e-card .e-card-content,
 .e-bigger.e-card .e-card-content {
-  padding: 16px 24px;
+  padding: 0 24px 16px 24px;
 }
 
 .e-bigger .e-card .e-card-content + :not(.e-card-content),
@@ -234,7 +234,7 @@
   font-size: 15px;
   -ms-flex-pack: center;
       justify-content: center;
-  line-height: 36px;
+  line-height: 24px;
   min-height: 36px;
   overflow: hidden;
   position: relative;
@@ -359,7 +359,7 @@
       justify-content: center;
   line-height: normal;
   min-height: 22.5px;
-  padding: 18px;
+  padding: 18px 18px 12px 18px;
   width: inherit;
 }
 
@@ -467,7 +467,7 @@
   display: inline-block;
   -ms-flex-pack: start;
       justify-content: flex-start;
-  padding: 8px 18px;
+  padding: 18px 18px;
 }
 
 .e-card .e-card-actions.e-card-vertical {
@@ -475,7 +475,7 @@
   display: flex;
   -ms-flex-direction: column;
       flex-direction: column;
-  padding: 8px 18px;
+  padding: 18px 18px;
 }
 
 .e-card .e-card-actions.e-card-vertical .e-card-btn,
@@ -567,7 +567,7 @@
 .e-card .e-card-content {
   font-size: 14px;
   line-height: 1.5;
-  padding: 12px 18px;
+  padding: 0 18px 12px 18px;
 }
 
 .e-card .e-card-content + :not(.e-card-content),
@@ -668,25 +668,17 @@
 }
 
 .e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler::before {
-  content: '\e855';
+  content: '\e7e3';
   font-family: 'e-icons';
   font-size: 14px;
 }
 
-.e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler.e-template-resize-handler::before {
-  content: '';
-}
-
 .e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler::before {
-  content: '\e858';
+  content: '\e7fd';
   font-family: 'e-icons';
   font-size: 14px;
 }
 
-.e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler.e-template-resize-handler::before {
-  content: '';
-}
-
 .e-bigger .e-splitter .e-split-bar .e-resize-handler::before {
   font-size: 16px;
 }
@@ -785,7 +777,7 @@
 
 .e-splitter.e-splitter-vertical.e-rtl .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down) {
   border-radius: 50%;
-  bottom: 18px;
+  bottom: 20px;
   right: 22px;
 }
 
@@ -793,7 +785,7 @@
   border-radius: 50%;
   left: 22px;
   right: auto;
-  top: 18px;
+  top: 20px;
 }
 
 .e-splitter.e-splitter-vertical.e-rtl .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
@@ -1003,14 +995,14 @@
 
 .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down) {
   border-radius: 50%;
-  bottom: 18px;
+  bottom: 20px;
   left: 22px;
 }
 
 .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down {
   border-radius: 50%;
   right: 22px;
-  top: 18px;
+  top: 20px;
 }
 
 .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::before, .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
@@ -1132,7 +1124,7 @@
 }
 
 .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover .e-navigate-arrow.e-arrow-left, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover .e-navigate-arrow.e-arrow-right, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-navigate-arrow.e-arrow-left, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-navigate-arrow.e-arrow-right {
-  background-color: #000;
+  background-color: transparent;
   border-color: #22d3ee;
   border-width: 1px;
   opacity: .9;
@@ -1187,7 +1179,7 @@
 }
 
 .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-up, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-down, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-up, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-down {
-  background-color: #000;
+  background-color: transparent;
   border-color: #22d3ee;
   border-width: 1px;
   opacity: .9;
@@ -1315,19 +1307,19 @@
 
 .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-east::before,
 .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-east::before {
-  bottom: 0;
-  content: '\e859';
-  font-size: 8px;
+  bottom: 4px;
+  content: '\e761';
+  font-size: 12px;
   position: absolute;
-  right: 0;
+  right: 4px;
 }
 
 .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-west::before,
 .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-west::before {
-  bottom: 0;
-  content: '\e859';
-  font-size: 8px;
-  left: 0;
+  bottom: 4px;
+  content: '\e761';
+  font-size: 12px;
+  left: 4px;
   position: absolute;
   transform: rotateY(180deg);
 }
@@ -1363,7 +1355,6 @@
 }
 
 .e-dashboardlayout.e-control .e-panel:hover {
-  border: 1px solid #9ca3af;
   box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
 }
 
@@ -1371,10 +1362,6 @@
   display: block;
 }
 
-.e-dashboardlayout.e-control .e-panel:active {
-  border: 1px solid #22d3ee;
-}
-
 .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-dl-icon {
   display: none;
 }
@@ -1420,6 +1407,10 @@
   width: inherit;
 }
 
+.e-dashboardlayout.e-control .e-panel .e-panel-content {
+  padding: 12px;
+}
+
 .e-dashboardlayout.e-control .e-panel {
   border: 1px solid #4b5563;
   height: 100%;
@@ -1537,6 +1528,10 @@
   line-height: 24px;
 }
 
+.e-bigger .e-dashboardlayout.e-control .e-panel .e-panel-content {
+  padding: 16px;
+}
+
 .e-content-placeholder.e-dashboardlayout.e-placeholder-dashboardlayout {
   height: 100%;
   width: 100%;
@@ -1548,7 +1543,7 @@
 }
 
 .e-dashboardlayout.e-control .e-panel {
-  background: #374151;
+  background: #1f2937;
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
   box-sizing: border-box;
   position: absolute;
@@ -1566,7 +1561,7 @@
 }
 
 .e-dashboardlayout.e-control .e-panel {
-  background: #374151;
+  background: #1f2937;
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
   box-sizing: border-box;
   position: absolute;

package/styles/tailwind.css

@@ -163,12 +163,12 @@
 
 .e-bigger .e-card .e-card-actions,
 .e-bigger.e-card .e-card-actions {
-  padding: 12px 24px;
+  padding: 24px 24px;
 }
 
 .e-bigger .e-card .e-card-actions.e-card-vertical,
 .e-bigger.e-card .e-card-actions.e-card-vertical {
-  padding: 12px 24px 12px 24px;
+  padding: 12px 24px 24px 24px;
 }
 
 .e-bigger .e-card .e-card-actions.e-card-vertical .e-card-btn,
@@ -212,7 +212,7 @@
 
 .e-bigger .e-card .e-card-content,
 .e-bigger.e-card .e-card-content {
-  padding: 16px 24px;
+  padding: 0 24px 16px 24px;
 }
 
 .e-bigger .e-card .e-card-content + :not(.e-card-content),
@@ -234,7 +234,7 @@
   font-size: 15px;
   -ms-flex-pack: center;
       justify-content: center;
-  line-height: 36px;
+  line-height: 24px;
   min-height: 36px;
   overflow: hidden;
   position: relative;
@@ -359,7 +359,7 @@
       justify-content: center;
   line-height: normal;
   min-height: 22.5px;
-  padding: 18px;
+  padding: 18px 18px 12px 18px;
   width: inherit;
 }
 
@@ -467,7 +467,7 @@
   display: inline-block;
   -ms-flex-pack: start;
       justify-content: flex-start;
-  padding: 8px 18px;
+  padding: 18px 18px;
 }
 
 .e-card .e-card-actions.e-card-vertical {
@@ -475,7 +475,7 @@
   display: flex;
   -ms-flex-direction: column;
       flex-direction: column;
-  padding: 8px 18px;
+  padding: 18px 18px;
 }
 
 .e-card .e-card-actions.e-card-vertical .e-card-btn,
@@ -567,7 +567,7 @@
 .e-card .e-card-content {
   font-size: 14px;
   line-height: 1.5;
-  padding: 12px 18px;
+  padding: 0 18px 12px 18px;
 }
 
 .e-card .e-card-content + :not(.e-card-content),
@@ -668,25 +668,17 @@
 }
 
 .e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler::before {
-  content: '\e855';
+  content: '\e7e3';
   font-family: 'e-icons';
   font-size: 14px;
 }
 
-.e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler.e-template-resize-handler::before {
-  content: '';
-}
-
 .e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler::before {
-  content: '\e858';
+  content: '\e7fd';
   font-family: 'e-icons';
   font-size: 14px;
 }
 
-.e-splitter .e-split-bar.e-split-bar-vertical .e-resize-handler.e-template-resize-handler::before {
-  content: '';
-}
-
 .e-bigger .e-splitter .e-split-bar .e-resize-handler::before {
   font-size: 16px;
 }
@@ -785,7 +777,7 @@
 
 .e-splitter.e-splitter-vertical.e-rtl .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down) {
   border-radius: 50%;
-  bottom: 18px;
+  bottom: 20px;
   right: 22px;
 }
 
@@ -793,7 +785,7 @@
   border-radius: 50%;
   left: 22px;
   right: auto;
-  top: 18px;
+  top: 20px;
 }
 
 .e-splitter.e-splitter-vertical.e-rtl .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
@@ -1003,14 +995,14 @@
 
 .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow:not(.e-arrow-down) {
   border-radius: 50%;
-  bottom: 18px;
+  bottom: 20px;
   left: 22px;
 }
 
 .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down {
   border-radius: 50%;
   right: 22px;
-  top: 18px;
+  top: 20px;
 }
 
 .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::before, .e-splitter .e-split-bar.e-split-bar-vertical .e-navigate-arrow.e-arrow-down::after {
@@ -1132,7 +1124,7 @@
 }
 
 .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover .e-navigate-arrow.e-arrow-left, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover .e-navigate-arrow.e-arrow-right, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-navigate-arrow.e-arrow-left, .e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active .e-navigate-arrow.e-arrow-right {
-  background-color: #fff;
+  background-color: transparent;
   border-color: #4f46e5;
   border-width: 1px;
   opacity: .9;
@@ -1187,7 +1179,7 @@
 }
 
 .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-up, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-hover .e-navigate-arrow.e-arrow-down, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-up, .e-splitter .e-split-bar.e-split-bar-vertical.e-split-bar-active .e-navigate-arrow.e-arrow-down {
-  background-color: #fff;
+  background-color: transparent;
   border-color: #4f46e5;
   border-width: 1px;
   opacity: .9;
@@ -1315,19 +1307,19 @@
 
 .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-east::before,
 .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-east::before {
-  bottom: 0;
-  content: '\e859';
-  font-size: 8px;
+  bottom: 4px;
+  content: '\e761';
+  font-size: 12px;
   position: absolute;
-  right: 0;
+  right: 4px;
 }
 
 .e-dashboardlayout.e-control .e-panel .e-resize.e-single.e-south-west::before,
 .e-dashboardlayout.e-control .e-panel .e-resize.e-double.e-south-west::before {
-  bottom: 0;
-  content: '\e859';
-  font-size: 8px;
-  left: 0;
+  bottom: 4px;
+  content: '\e761';
+  font-size: 12px;
+  left: 4px;
   position: absolute;
   transform: rotateY(180deg);
 }
@@ -1363,7 +1355,6 @@
 }
 
 .e-dashboardlayout.e-control .e-panel:hover {
-  border: 1px solid #9ca3af;
   box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
 }
 
@@ -1371,10 +1362,6 @@
   display: block;
 }
 
-.e-dashboardlayout.e-control .e-panel:active {
-  border: 1px solid #4f46e5;
-}
-
 .e-dashboardlayout.e-control .e-panel .e-panel-container .e-resize.e-dl-icon {
   display: none;
 }
@@ -1420,6 +1407,10 @@
   width: inherit;
 }
 
+.e-dashboardlayout.e-control .e-panel .e-panel-content {
+  padding: 12px;
+}
+
 .e-dashboardlayout.e-control .e-panel {
   border: 1px solid #e5e7eb;
   height: 100%;
@@ -1537,6 +1528,10 @@
   line-height: 24px;
 }
 
+.e-bigger .e-dashboardlayout.e-control .e-panel .e-panel-content {
+  padding: 16px;
+}
+
 .e-content-placeholder.e-dashboardlayout.e-placeholder-dashboardlayout {
   height: 100%;
   width: 100%;