acud/es/img-crop/style/index.css

acg react 组件库

/* color */
/* 默认颜色 */
/* 通用-icon */
/* 标签 */
/* 默认颜色 */
/* 其他颜色 */
/* 通用 */
/* 水平 */
/* 垂直 */
/* 序号水平 */
/* 序号垂直 */
.acud-imgcrop-modal .acud-imgcrop-container {
  position: relative;
  width: 100%;
  height: 300px;
}
.acud-imgcrop-modal .acud-imgcrop-control {
  display: flex;
  align-items: center;
  width: 60%;
  margin-right: auto;
  margin-left: auto;
}
.acud-imgcrop-modal .acud-imgcrop-control:first-of-type {
  margin-top: 16px;
}
.acud-imgcrop-modal .acud-imgcrop-control:last-of-type {
  margin-bottom: -8px;
}
.acud-imgcrop-modal .acud-imgcrop-control button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  font-style: normal;
  background: transparent;
  border: 0;
  outline: 0;
  cursor: pointer;
}
.acud-imgcrop-modal .acud-imgcrop-control button[disabled] {
  cursor: default;
}
.acud-imgcrop-modal .acud-imgcrop-control button + div:only-of-type {
  flex: 1;
  margin: 0 8px;
}
.acud-imgcrop-modal .acud-imgcrop-control-zoom button {
  font-size: 18px;
}
.acud-imgcrop-modal .acud-imgcrop-control-rotate button {
  font-size: 16px;
}
.acud-imgcrop-modal .acud-imgcrop-control-rotate button:first-of-type {
  transform: rotate(-20deg);
}
.acud-imgcrop-modal .acud-imgcrop-control-rotate button:last-of-type {
  transform: rotate(20deg);
}