@mcurros2/microm 1.1.335-0 → 1.1.337-0

package/dist/index.css

@@ -1,230 +1,15 @@
 .image-editor {
-  color: #868686;
-  border: 1px solid #2b2a30;
-  max-height: 100%;
-}
-
-.image-editor__preview {
-  background: #000;
-  border: 1px solid #2b2a30;
-  border-radius: 50%;
-  width: 45px;
-  height: 45px;
-  position: absolute;
-  top: 20px;
-  left: 20px;
+  width: 100%;
 }
 
 .image-editor__cropper {
   background: #0f0e13;
-  height: 400px;
-  max-height: 100%;
-  position: relative;
-}
-
-.image-editor__slider {
   width: 100%;
-  position: absolute;
-  bottom: 20px;
-  left: 50%;
-  transform: translateX(-50%);
-}
-
-.image-editor__cropper-overlay {
-  transition: all .5s;
-}
-
-.image-editor__cropper-overlay--faded {
-  color: #000000e6;
-}
-
-.image-editor__service {
-  pointer-events: none;
-  position: absolute;
-  left: -100%;
-}
-
-.image-editor__reset-button {
-  background: #ffffff1a;
-  position: absolute;
-  top: 20px;
-  right: 20px;
-}
-
-.image-editor__reset-button:hover {
-  fill: #868686;
-  background: #fff3;
-}
-
-.image-editor__reset-button--hidden {
-  opacity: 0;
-  visibility: hidden;
-}
-
-.image-editor-slider {
-  cursor: pointer;
-  background: #1b1a2166;
-  border-radius: 10px;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  max-width: 380px;
-  height: 20px;
-  padding-left: 16px;
-  padding-right: 16px;
-  display: flex;
-}
-
-.image-editor-slider__wrapper {
-  align-items: center;
-  width: 100%;
-  max-width: 400px;
-  display: flex;
-}
-
-.image-editor-slider__line {
-  background: #ffffff80;
-  align-items: center;
-  width: 100%;
-  height: 2px;
-  display: flex;
+  height: min(60vh, 32rem);
+  min-height: 18rem;
+  display: block;
   position: relative;
-}
-
-.image-editor-slider__fill {
-  background: #fff;
-  flex-direction: column;
-  flex-shrink: 0;
-  flex-basis: auto;
-  align-self: stretch;
-  height: 2px;
-  position: absolute;
-}
-
-.image-editor-slider__dot {
-  background: #fff;
-  border-radius: 50%;
-  width: 8px;
-  height: 8px;
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-}
-
-.image-editor-slider__value {
-  color: #fff;
-  vertical-align: bottom;
-  justify-content: center;
-  align-items: center;
-  font-size: 10px;
-  font-weight: 500;
-  transition-property: font-size, opacity;
-  transition-duration: .5s;
-  display: flex;
-  position: absolute;
-  top: -20px;
-  transform: translate(-50%);
-}
-
-.image-editor-slider__handler {
-  background-color: #fff;
-  justify-content: center;
-  align-items: center;
-  width: 2px;
-  height: 8px;
-  transition-property: height;
-  transition-duration: .2s;
-  display: flex;
-  position: absolute;
-}
-
-.image-editor-slider__handler:hover, .image-editor-slider__handler--focus {
-  height: 10px;
-}
-
-.image-editor-slider__handler--hidden {
-  height: 4px;
-}
-
-.image-editor-navigation {
-  background: #1b1a21;
-  border-top: 1px solid #2b2a30;
-  justify-content: space-between;
-  align-items: center;
-  height: 84px;
-  padding-left: 16px;
-  padding-right: 16px;
-  display: flex;
-}
-
-.image-editor-navigation__button {
-  margin-left: 8px;
-  margin-right: 8px;
-}
-
-.image-editor-navigation__button__ok {
-  color: #00e300 !important;
-}
-
-.image-editor-navigation__buttons {
-  justify-content: center;
-  align-items: center;
-  display: flex;
-}
-
-.image-editor-navigation__upload-input {
-  display: none;
-}
-
-@media (width <= 540px) {
-  .image-editor-navigation {
-    padding-left: 8px;
-    padding-right: 8px;
-  }
-
-  .image-editor-navigation__button {
-    margin-left: 4px;
-    margin-right: 4px;
-  }
-}
-
-.image-editor-button {
-  fill: #88888b;
-  cursor: pointer;
-  color: currentColor;
-  background: none;
-  border: none;
-  border-radius: 50%;
-  outline: none;
-  justify-content: center;
-  align-items: center;
-  width: 46px;
-  height: 46px;
-  padding: 0;
-  transition: all .5s;
-  display: flex;
-}
-
-.image-editor-button--active {
-  fill: currentColor;
-  background: #ffffff08;
-}
-
-.image-editor-button:hover, .image-editor-button:focus {
-  background: #ffffff08;
-}
-
-@media (width <= 540px) {
-  .image-editor-button {
-    width: 32px;
-    height: 32px;
-  }
-}
-
-.adjustable-image-source {
-  display: none;
+  overflow: hidden;
 }
 
 @font-face {