mg-vue-cropper/lib/index.css

A mg vue-cropper Component.

.cropper-tool[data-v-3008b434]{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;height:100%;background-color:#000c}.material-container[data-v-3008b434]{position:relative;width:100%;height:100%;text-align:center}.material-container>img[data-v-3008b434]{max-width:100%;max-height:100%;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.material-container>.cut-box[data-v-3008b434]{position:absolute;left:0;top:0;border:1px solid #6676FF;cursor:move}.material-container>.cut-box>.resize-btn[data-v-3008b434]{position:absolute;width:8px;height:8px;background-color:transparent}.material-container>.cut-box>.resize-btn.nw[data-v-3008b434]{left:-1px;top:-1px;cursor:nw-resize}.material-container>.cut-box>.resize-btn.nw>.handle-x[data-v-3008b434]{left:-2px;top:-2px}.material-container>.cut-box>.resize-btn.nw>.handle-y[data-v-3008b434]{left:-2px;top:-2px}.material-container>.cut-box>.resize-btn.ne[data-v-3008b434]{right:-1px;top:-1px;cursor:ne-resize}.material-container>.cut-box>.resize-btn.ne>.handle-x[data-v-3008b434]{right:-2px;top:-2px}.material-container>.cut-box>.resize-btn.ne>.handle-y[data-v-3008b434]{right:-2px;top:-2px}.material-container>.cut-box>.resize-btn.se[data-v-3008b434]{right:-1px;bottom:-1px;cursor:se-resize}.material-container>.cut-box>.resize-btn.se>.handle-x[data-v-3008b434]{right:-2px;bottom:-2px}.material-container>.cut-box>.resize-btn.se>.handle-y[data-v-3008b434]{right:-2px;bottom:-2px}.material-container>.cut-box>.resize-btn.sw[data-v-3008b434]{left:-1px;bottom:-1px;cursor:sw-resize}.material-container>.cut-box>.resize-btn.sw>.handle-x[data-v-3008b434]{left:-2px;bottom:-2px}.material-container>.cut-box>.resize-btn.sw>.handle-y[data-v-3008b434]{left:-2px;bottom:-2px}.material-container>.chartlet-container[data-v-3008b434]{position:absolute;left:0;top:0}.material-container>.chartlet-container>img[data-v-3008b434]{width:100%;height:100%}.handle-x[data-v-3008b434]{position:absolute;width:16px;height:3px;background-color:#6676ff}.handle-y[data-v-3008b434]{position:absolute;width:3px;height:16px;background-color:#6676ff}.rotate-container[data-v-3008b434]{display:flex;position:absolute;bottom:-36px;left:0;color:#7b8088}.rotate-title[data-v-3008b434]{margin-right:20px}.rotate-btns>span[data-v-3008b434]{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.rotate-btns>span[data-v-3008b434]:not(.is-disabled):hover{opacity:.66}.rotate-btns>span.is-disabled[data-v-3008b434]{cursor:not-allowed}.rotate-btns>span[data-v-3008b434]:first-child{margin-right:16px}.cropper-preview[data-v-56e3a6cf]{display:inline-block;position:relative;width:28.57%;height:100%;color:#343537}.canvas-container[data-v-56e3a6cf]{width:100%;height:42%;max-height:calc(100% - 22px);background-color:transparent;margin:6px 0;overflow:hidden}.preview-info[data-v-56e3a6cf]{display:flex;justify-content:space-between;white-space:nowrap}.info-label[data-v-56e3a6cf]{color:#7b8088}.info-value[data-v-56e3a6cf]{color:#343537}.original-canvas-container[data-v-56e3a6cf]{display:none;position:absolute;z-index:-1;width:100%;opacity:0}.mg-cropper[data-v-dbd1a6f4]{display:flex;flex-direction:row;align-items:flex-start;justify-content:center;font-size:12px;text-align:left}.mg-cropper[data-v-dbd1a6f4] *{box-sizing:border-box}.mg-cropper[data-v-dbd1a6f4] img{vertical-align:middle}.right-slot[data-v-dbd1a6f4]{display:inline-block;position:relative;width:28.57%;height:100%}