@syncfusion/ej2-image-editor 20.4.51 → 21.1.36

package/styles/image-editor/icons/_material.scss

@@ -104,6 +104,126 @@
         }
       }
     }
+
+    & .e-custom {
+      &::before {
+        content: '\e964';
+      }
+    }
+    
+    & .e-circle {
+      &::before {
+        content: '\e671';
+      }
+    }
+    
+    & .e-square{
+      &::before {
+        content: '\e965';
+      }
+    }
+    
+    & .e-custom-a {
+      &::before {
+        content: '\e966';
+      }
+    }
+    
+    & .e-custom-b {
+      &::before {
+        content: '\e967';
+      }
+    }
+    
+    & .e-custom-c {
+      &::before {
+        content: '\e968';
+      }
+    }
+    
+    & .e-custom-d {
+      &::before {
+        content: '\e96a';
+      }
+    }
+    
+    & .e-custom-e {
+      &::before {
+        content: '\e96b';
+      }
+    }
+  
+    & .e-horizontal-flip {
+      &::before {
+        content: '\e95c';
+      }
+    }
+    
+    & .e-vertical-flip {
+      &::before {
+        content: '\e95d';
+      }
+    }
+  
+    & .e-clock-wise {
+      &::before {
+        content: '\e960';
+      }
+    }
+    
+    & .e-anti-clock-wise {
+      &::before {
+        content: '\e95f';
+      }
+    }
+  
+    & .e-rectangle {
+      &::before {
+        content: '\e670';
+      }
+    }
+    
+    & .e-circle {
+      &::before {
+        content: '\e671';
+      }
+    }
+    
+    & .e-triangle {
+      &::before {
+        content: '\e954';
+      }
+    }
+    
+    & .e-line {
+      &::before {
+        content: '\e668';
+      }
+    }
+    
+    & .e-add-text {
+      &::before {
+        content: '\e35b';
+      }
+    }
+    
+    & .e-free-pen {
+      &::before {
+        content: '\e737';
+      }
+    }
+
+    & .e-arrow {
+      &::before {
+        content: '\e669';
+      }
+    }
+    
+    & .e-path {
+      &::before {
+        content: '\e931';
+      }
+    }
   }
 }
 
@@ -215,4 +335,16 @@
       content: '\e95d';
     }
   }
+
+  & .e-arrow {
+    &::before {
+      content: '\e669';
+    }
+  }
+  
+  & .e-path {
+    &::before {
+      content: '\e931';
+    }
+  }
 }

package/styles/image-editor/icons/_material3-dark.scss

@@ -0,0 +1 @@
+@import './material3.scss';

package/styles/image-editor/icons/_material3.scss

@@ -99,7 +99,7 @@
     & .e-stroke.e-template,
     & .e-pen-stroke-color.e-template {
       & .e-caret::before {
-        content: '\739';
+        content: '\e739';
       }
     }
 
@@ -110,6 +110,126 @@
         }
       }
     }
+
+    & .e-custom {
+      &::before {
+        content: '\e8a9';
+      }
+    }
+    
+    & .e-circle {
+      &::before {
+        content: '\e7ca';
+      }
+    }
+    
+    & .e-square{
+      &::before {
+        content: '\e8aa';
+      }
+    }
+    
+    & .e-custom-a {
+      &::before {
+        content: '\e8ab';
+      }
+    }
+    
+    & .e-custom-b {
+      &::before {
+        content: '\e8ac';
+      }
+    }
+    
+    & .e-custom-c {
+      &::before {
+        content: '\e8ad';
+      }
+    }
+    
+    & .e-custom-d {
+      &::before {
+        content: '\e8ae';
+      }
+    }
+    
+    & .e-custom-e {
+      &::before {
+        content: '\e8af';
+      }
+    }
+  
+    & .e-horizontal-flip {
+      &::before {
+        content: '\e8a3';
+      }
+    }
+    
+    & .e-vertical-flip {
+      &::before {
+        content: '\e8a4';
+      }
+    }
+  
+    & .e-clock-wise {
+      &::before {
+        content: '\e8a6';
+      }
+    }
+  
+    & .e-anti-clock-wise {
+      &::before {
+        content: '\e8a5';
+      }
+    }
+  
+    & .e-rectangle {
+      &::before {
+        content: '\e723';
+      }
+    }
+    
+    & .e-circle {
+      &::before {
+        content: '\e7ca';
+      }
+    }
+    
+    & .e-triangle {
+      &::before {
+        content: '\e89c';
+      }
+    }
+    
+    & .e-line {
+      &::before {
+        content: '\e819';
+      }
+    }
+  
+    & .e-add-text {
+      &::before {
+        content: '\e82e';
+      }
+    }
+    
+    & .e-free-pen {
+      &::before {
+        content: '\e7db';
+      }
+    }
+
+    & .e-arrow {
+      &::before {
+        content: '\e669';
+      }
+    }
+    
+    & .e-path {
+      &::before {
+        content: '\e931';
+      }
+    }
   }
 }
 
@@ -227,4 +347,16 @@
       content: '\e82e';
     }
   }
+
+  & .e-arrow {
+    &::before {
+      content: '\e669';
+    }
+  }
+  
+  & .e-path {
+    &::before {
+      content: '\e931';
+    }
+  }
 }

package/styles/image-editor/icons/_tailwind.scss

@@ -98,6 +98,126 @@
         }
       }
     }
+
+    & .e-custom {
+      &::before {
+        content: '\e8a9';
+      }
+    }
+    
+    & .e-circle {
+      &::before {
+        content: '\e7ca';
+      }
+    }
+    
+    & .e-square{
+      &::before {
+        content: '\e8aa';
+      }
+    }
+    
+    & .e-custom-a {
+      &::before {
+        content: '\e8ab';
+      }
+    }
+    
+    & .e-custom-b {
+      &::before {
+        content: '\e8ac';
+      }
+    }
+    
+    & .e-custom-c {
+      &::before {
+        content: '\e8ad';
+      }
+    }
+    
+    & .e-custom-d {
+      &::before {
+        content: '\e8ae';
+      }
+    }
+    
+    & .e-custom-e {
+      &::before {
+        content: '\e8af';
+      }
+    }
+  
+    & .e-horizontal-flip {
+      &::before {
+        content: '\e8a3';
+      }
+    }
+    
+    & .e-vertical-flip {
+      &::before {
+        content: '\e8a4';
+      }
+    }
+  
+    & .e-clock-wise {
+      &::before {
+        content: '\e8a6';
+      }
+    }
+  
+    & .e-anti-clock-wise {
+      &::before {
+        content: '\e8a5';
+      }
+    }
+  
+    & .e-rectangle {
+      &::before {
+        content: '\e723';
+      }
+    }
+    
+    & .e-circle {
+      &::before {
+        content: '\e7ca';
+      }
+    }
+    
+    & .e-triangle {
+      &::before {
+        content: '\e89c';
+      }
+    }
+    
+    & .e-line {
+      &::before {
+        content: '\e819';
+      }
+    }
+  
+    & .e-add-text {
+      &::before {
+        content: '\e82e';
+      }
+    }
+    
+    & .e-free-pen {
+      &::before {
+        content: '\e7db';
+      }
+    }
+
+    & .e-arrow {
+      &::before {
+        content: '\e669';
+      }
+    }
+    
+    & .e-path {
+      &::before {
+        content: '\e931';
+      }
+    }
   }
 }
 
@@ -215,4 +335,16 @@
       content: '\e82e';
     }
   }
+
+  & .e-arrow {
+    &::before {
+      content: '\e669';
+    }
+  }
+  
+  & .e-path {
+    &::before {
+      content: '\e931';
+    }
+  }
 }

package/styles/image-editor/material-dark.css

@@ -77,6 +77,66 @@
 .e-image-editor .e-fill.e-template .e-caret::before {
   content: "\e35c";
 }
+.e-image-editor .e-custom::before {
+  content: "\e964";
+}
+.e-image-editor .e-circle::before {
+  content: "\e671";
+}
+.e-image-editor .e-square::before {
+  content: "\e965";
+}
+.e-image-editor .e-custom-a::before {
+  content: "\e966";
+}
+.e-image-editor .e-custom-b::before {
+  content: "\e967";
+}
+.e-image-editor .e-custom-c::before {
+  content: "\e968";
+}
+.e-image-editor .e-custom-d::before {
+  content: "\e96a";
+}
+.e-image-editor .e-custom-e::before {
+  content: "\e96b";
+}
+.e-image-editor .e-horizontal-flip::before {
+  content: "\e95c";
+}
+.e-image-editor .e-vertical-flip::before {
+  content: "\e95d";
+}
+.e-image-editor .e-clock-wise::before {
+  content: "\e960";
+}
+.e-image-editor .e-anti-clock-wise::before {
+  content: "\e95f";
+}
+.e-image-editor .e-rectangle::before {
+  content: "\e670";
+}
+.e-image-editor .e-circle::before {
+  content: "\e671";
+}
+.e-image-editor .e-triangle::before {
+  content: "\e954";
+}
+.e-image-editor .e-line::before {
+  content: "\e668";
+}
+.e-image-editor .e-add-text::before {
+  content: "\e35b";
+}
+.e-image-editor .e-free-pen::before {
+  content: "\e737";
+}
+.e-image-editor .e-arrow::before {
+  content: "\e669";
+}
+.e-image-editor .e-path::before {
+  content: "\e931";
+}
 
 .e-dropdown-popup.e-image-popup .e-custom::before {
   content: "\e964";
@@ -132,6 +192,17 @@
 .e-dropdown-popup.e-image-popup .e-vertical-flip::before {
   content: "\e95d";
 }
+.e-dropdown-popup.e-image-popup .e-arrow::before {
+  content: "\e669";
+}
+.e-dropdown-popup.e-image-popup .e-path::before {
+  content: "\e931";
+}
+
+.e-ie-toolbar-upload-div.e-hide,
+.e-ie-toolbar-upload-btn.e-hide {
+  display: none;
+}
 
 .e-device.e-image-editor .e-img-font-style.e-template {
   margin-left: 0 !important; /* stylelint-disable-line declaration-no-important */
@@ -146,11 +217,6 @@
   height: 48px !important; /* stylelint-disable-line declaration-no-important */
   min-height: 48px !important; /* stylelint-disable-line declaration-no-important */
 }
-.e-bigger .e-image-editor .e-toolbar .e-toolbar-items,
-.e-image-editor.e-bigger .e-toolbar .e-toolbar-items {
-  height: 48px !important; /* stylelint-disable-line declaration-no-important */
-  min-height: 48px !important; /* stylelint-disable-line declaration-no-important */
-}
 .e-bigger .e-image-editor .e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn.e-tbtn-txt .e-icons.e-btn-icon,
 .e-image-editor.e-bigger .e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn.e-tbtn-txt .e-icons.e-btn-icon {
   font-size: 18px;
@@ -218,9 +284,6 @@
 .e-image-editor .e-toolbar .e-toolbar-items .e-image-upload .e-image-upload .e-upload {
   border: none;
 }
-.e-image-editor .e-toolbar .e-toolbar-items .e-image-upload .e-icons.e-upload-icon {
-  margin-top: 7px;
-}
 .e-image-editor .e-toolbar .e-toolbar-items .e-fill.e-template .e-dropdown-btn .e-icons.e-caret, .e-image-editor .e-toolbar .e-toolbar-items .e-stroke.e-template .e-dropdown-btn .e-icons.e-caret, .e-image-editor .e-toolbar .e-toolbar-items .e-pen-stroke-color.e-template .e-dropdown-btn .e-icons.e-caret, .e-image-editor .e-toolbar .e-toolbar-items .e-text-font-color.e-template .e-dropdown-btn .e-icons.e-caret, .e-image-editor .e-toolbar .e-toolbar-items .e-save.e-template .e-dropdown-btn .e-icons.e-caret {
   font-size: 16px;
 }
@@ -244,7 +307,7 @@
 .e-image-editor .e-toolbar-area + .e-canvas-wrapper {
   border-top: 1px solid #757575;
 }
-.e-image-editor .e-canvas-wrapper .e-textarea {
+.e-image-editor .e-toolbar-area + .e-canvas-wrapper .e-textarea {
   line-height: initial !important; /* stylelint-disable-line declaration-no-important */
 }
 .e-image-editor .e-bottom-toolbar {
@@ -263,11 +326,11 @@
 .e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item {
   height: auto !important; /* stylelint-disable-line declaration-no-important */
 }
-.e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item .filterwrapper {
+.e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item .filterwrapper, .e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item .filter-wrapper {
   border: 2px solid transparent;
   height: 100px;
 }
-.e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item:hover .filterwrapper, .e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item.e-selected .filterwrapper {
+.e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item:hover .filterwrapper, .e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item:hover .filter-wrapper, .e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item.e-selected .filterwrapper, .e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item.e-selected .filter-wrapper {
   border-top: 2px solid;
 }
 .e-image-editor .e-contextual-toolbar-wrapper .e-slider-container {
@@ -283,7 +346,7 @@
   border-top: 1px solid #757575;
   border-bottom: 1px solid #757575;
 }
-.e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item:hover .filterwrapper, .e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item.e-selected .filterwrapper {
+.e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item:hover .filterwrapper, .e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item.e-selected .filterwrapper, .e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item:hover .filter-wrapper, .e-image-editor .e-contextual-toolbar-wrapper .e-toolbar-item.e-selected .filter-wrapper {
   border-color: #7d7d7d;
 }
 .e-image-editor .e-toolbar .e-toolbar-items .e-tbar-btn.e-btn .e-icons {
@@ -296,24 +359,24 @@
   background: inherit;
   border: none;
   margin-top: 0;
-  background-color: #212121;
+  background: #212121;
   color: #fff;
 }
 .e-image-editor .e-toolbar .e-toolbar-items .e-dropdown-btn .e-caret-hide {
   display: none !important; /* stylelint-disable-line declaration-no-important */
 }
 .e-image-editor .e-toolbar .e-toolbar-items .e-dropdown-btn:hover {
-  background-color: #6e6e6e;
+  background: #6e6e6e;
   box-shadow: none;
   color: #fff;
 }
 .e-image-editor .e-toolbar .e-toolbar-items .e-dropdown-btn:focus {
-  background-color: #878787;
+  background: #878787;
   box-shadow: none;
   color: #fff;
 }
 .e-image-editor .e-toolbar .e-toolbar-items .e-dropdown-btn:active {
-  background-color: #7d7d7d;
+  background: #7d7d7d;
   box-shadow: none;
   color: #fff;
 }