{"version":3,"sources":["webpack://jerri-ui/src/components/imgViews/F:/All project/JR-UI-pub/src/components/imgViews/index.scss","webpack://jerri-ui/src/components/imgViews/F:/All project/JR-UI-pub/src/components/imgViews/imgViews.vue"],"names":[],"mappings":"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","file":"style.css","sourcesContent":["$--color-view:#252525;\r\n\r\n.j-mask {\r\n  z-index: 200;\r\n}\r\n\r\n.resize-btn {\r\n  position: absolute;\r\n  width: 15px;\r\n  height: 15px;\r\n  z-index: 15;\r\n\r\n  &.right-top {\r\n    right: -5px;\r\n    top: -5px;\r\n    cursor: ne-resize;\r\n  }\r\n\r\n  &.right-bottom {\r\n    right: -5px;\r\n    bottom: -5px;\r\n    cursor: se-resize;\r\n  }\r\n\r\n  &.left-top {\r\n    left: -5px;\r\n    top: -5px;\r\n    cursor: se-resize;\r\n  }\r\n\r\n  &.left-bottom {\r\n    left: -5px;\r\n    bottom: -5px;\r\n    cursor: ne-resize;\r\n  }\r\n}\r\n\r\n.resize-bar-horizontal {\r\n  position: absolute;\r\n  z-index: 15;\r\n  width: 100%;\r\n  height: 8px;\r\n  cursor: n-resize;\r\n\r\n  &.top {\r\n    top: -4px;\r\n  }\r\n\r\n  &.bottom {\r\n    bottom: -4px;\r\n  }\r\n}\r\n\r\n.resize-bar-vertical {\r\n  position: absolute;\r\n  z-index: 15;\r\n  width: 8px;\r\n  height: 100%;\r\n  cursor: w-resize;\r\n\r\n  &.left {\r\n    left: -4px;\r\n  }\r\n\r\n  &.right {\r\n    right: -4px;\r\n  }\r\n}\r\n\r\n.pic-content {\r\n  width: calc(100% - 10px);\r\n  height: calc(100% - 10px);\r\n  background-color: #393a3d;\r\n  position: fixed;\r\n  box-shadow: 0px 0px 3px 0px rgba($--color-c1, .3);\r\n  z-index: 9999;\r\n}\r\n\r\n.pic-box {\r\n  width: 100%;\r\n  height: 100%;\r\n  position: relative;\r\n  overflow: hidden;\r\n}\r\n\r\n.pic-info {\r\n  height: 44px;\r\n  width: 100%;\r\n  padding: 0 20px;\r\n  box-sizing: border-box;\r\n  background-color: $--color-view;\r\n  color: $--color-c6;\r\n  text-align: left;\r\n  display: flex;\r\n  z-index: 2;\r\n  position: relative;\r\n  vertical-align: middle;\r\n}\r\n\r\n.pic-info>span {\r\n  flex: 1;\r\n  height: 44px;\r\n  line-height: 46px;\r\n  text-overflow: ellipsis;\r\n  overflow: hidden;\r\n  white-space: nowrap;\r\n  text-align: left;\r\n}\r\n\r\n.pic-content .pic-close {\r\n  display: inline-block;\r\n  width: 25px;\r\n  height: 25px;\r\n  background-color: rgba($--color-c1, .7);\r\n  color: $--color-c6;\r\n  text-align: center;\r\n  line-height: 25px;\r\n  font-size: 21px;\r\n  top: 0px;\r\n  position: absolute;\r\n  right: 0px;\r\n  cursor: pointer;\r\n  z-index: 11;\r\n\r\n  &:hover {\r\n    background-color: $--color-c11;\r\n  }\r\n}\r\n\r\n.pic-info>p {\r\n  flex: 2;\r\n  height: 44px;\r\n  line-height: 44px;\r\n  text-align: right;\r\n  vertical-align: middle;\r\n}\r\n\r\n.pic-info>p>span {\r\n  margin-right: 18px;\r\n  cursor: pointer;\r\n  font-size: 23px;\r\n  color: #a6acb7;\r\n  line-height: 44px;\r\n  vertical-align: initial;\r\n}\r\n\r\n.pic-content .pic_scale {\r\n  width: 75px;\r\n  text-align: center;\r\n  background-color: rgba(0, 0, 0, 0.7);\r\n  color: $--color-c6;\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  height: 40px;\r\n  border-radius: 20px;\r\n  line-height: 40px;\r\n  animation-name: zoomIn;\r\n  animation-duration: 0.5s;\r\n  animation-fill-mode: both;\r\n}\r\n\r\n.icon-hover:hover {\r\n  color: $--color-c6;\r\n}\r\n\r\n\r\n.pre-list {\r\n  height: 86px;\r\n  padding: 10px 40px;\r\n  background-color: $--color-view;\r\n  position: absolute;\r\n  bottom: 0;\r\n  left: 0;\r\n  right: 0;\r\n  z-index: 11;\r\n\r\n  >span {\r\n    position: absolute;\r\n    font-size: 20px;\r\n    color: $--color-c6;\r\n    top: 50%;\r\n    cursor: pointer;\r\n    padding: 10px 4px;\r\n\r\n    &:first-of-type {\r\n      left: 5px;\r\n      transform: translateY(-50%) rotate(180deg);\r\n    }\r\n\r\n    &:last-of-type {\r\n      right: 5px;\r\n      transform: translateY(-50%);\r\n    }\r\n  }\r\n\r\n  >div {\r\n    overflow: auto;\r\n    overflow-y: hidden;\r\n    height: 72px;\r\n    position: relative;\r\n\r\n    &::-webkit-scrollbar {\r\n      width: 11px;\r\n      height: 5px;\r\n    }\r\n\r\n    &::-webkit-scrollbar-button {\r\n      display: none;\r\n      width: 11px;\r\n      height: 5px;\r\n    }\r\n\r\n    &::-webkit-scrollbar-thumb {\r\n      border-radius: 3px;\r\n      background-color: #3b3b3b;\r\n    }\r\n\r\n    &::-webkit-scrollbar-track {\r\n      background-color: $--color-view;\r\n    }\r\n  }\r\n\r\n  ul {\r\n    white-space: nowrap;\r\n    display: inline-block;\r\n\r\n    li {\r\n      width: 60px;\r\n      height: 60px;\r\n      margin-left: 6px;\r\n      display: inline-block;\r\n      cursor: pointer;\r\n\r\n      &.selected-border img {\r\n        border: 3px solid $--color-c9;\r\n      }\r\n    }\r\n\r\n    &:first-child {\r\n      margin-left: 0;\r\n    }\r\n\r\n    img {\r\n      object-fit: cover;\r\n      width: 100%;\r\n      height: 100%;\r\n      border: 1px solid $--color-c3;\r\n    }\r\n  }\r\n}\r\n\r\n\r\n.pic-info .gray {\r\n  color: #707277;\r\n  cursor: no-drop;\r\n}\r\n\r\n.pic-info .gray_hover:hover {\r\n  color: $--color-c6;\r\n}\r\n\r\n.pic-info .pic-num {\r\n  font-size: 14px;\r\n  font-style: normal;\r\n  display: inline-block;\r\n  vertical-align: super;\r\n  user-select: none;\r\n}\r\n\r\n.pic-info .page-count {\r\n  position: absolute;\r\n  right: 0;\r\n}\r\n\r\n.pic-info .operate {\r\n  position: relative;\r\n  width: 100%;\r\n  text-align: center;\r\n}\r\n\r\n.pic-num>span {\r\n  vertical-align: bottom;\r\n}\r\n\r\n.img-box {\r\n  position: absolute;\r\n  z-index: 2;\r\n  width: 100% !important;\r\n  height: 100% !important;\r\n}\r\n\r\n.pic-box>img {\r\n  max-height: 101%;\r\n  max-width: 100%;\r\n  position: absolute;\r\n  z-index: 1;\r\n  -webkit-user-select: none;\r\n\r\n}\r\n\r\n.pic-left-wrap {\r\n  width: 100px;\r\n  height: 100%;\r\n  position: absolute;\r\n  left: 0px;\r\n  top: 0px;\r\n  z-index: 10;\r\n}\r\n\r\n.pic-right-wrap {\r\n  width: 100px;\r\n  height: 100%;\r\n  position: absolute;\r\n  right: 0px;\r\n  top: 0px;\r\n  z-index: 10;\r\n}\r\n\r\n.pic-content span.pic-left,\r\n.pic-content span.pic-right {\r\n  width: 47px;\r\n  height: 47px;\r\n  display: inline-block;\r\n  background-color: rgba($--color-c1, .5);\r\n  border-radius: 100%;\r\n  color: $--color-c6;\r\n  text-align: center;\r\n  line-height: 47px;\r\n  font-size: 42px;\r\n  position: absolute;\r\n  top: calc(50%);\r\n  z-index: 10;\r\n  cursor: pointer;\r\n}\r\n\r\n.pic-left {\r\n  left: 20px;\r\n  transform: rotate(180deg);\r\n}\r\n\r\n.pic-right {\r\n  right: 20px;\r\n}\r\n\r\n.pic-right:hover,\r\n.pic-left:hover {\r\n  background-color: rgba($--color-c1, .6);\r\n}\r\n\r\n.pic-disabled {\r\n  color: rgba($--color-c6, .3) !important;\r\n  cursor: no-drop !important;\r\n}\r\n\r\n.move {\r\n  cursor: move;\r\n}\r\n\r\n.pic-content .pic-scale {\r\n  width: 75px;\r\n  text-align: center;\r\n  background-color: rgba($--color-c1, .7);\r\n  color: $--color-c6;\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  height: 40px;\r\n  border-radius: 20px;\r\n  line-height: 40px;\r\n  animation-name: zoomIn;\r\n  animation-duration: 0.5s;\r\n  animation-fill-mode: both;\r\n  z-index: 1;\r\n}\r\n\r\n.pageTurning-disabled {\r\n  color: rgba($--color-c6, .3) !important;\r\n  cursor: no-drop !important;\r\n}\r\n","/* 颜色变量 几种常见的颜色 参考图片\r\n-------------------------- */\r\n// 亮晶晶\r\n$--color-c0: transparent !default;\r\n// 黑色\r\n$--color-c1: #000 !default;\r\n// 输入框占位字体颜色\r\n$--color-c2: #999 !default;\r\n// 分割线/标签描边/滚动条/icon禁用\r\n$--color-c3: #abc0ba !default;\r\n// 表头背景\r\n$--color-c4: #e2e9e7 !default;\r\n// 内容区域底色\r\n$--color-c5: #f9fbf9 !default;\r\n// 白色\r\n$--color-c6: #fff !default;\r\n// 菜单栏/各类大标题\r\n$--color-c7: #003f2d !default;\r\n// 按钮/图标/字体点亮\r\n$--color-c8: #067f42 !default;\r\n// VI色/按钮hover色\r\n$--color-c9: #1aa849 !default;\r\n// 下拉条选中/弹窗选中\r\n$--color-c10: #e3f7e3 !default;\r\n// 强调/提醒/警示\r\n$--color-c11: #ff5c54 !default;\r\n// 强调/提醒\r\n$--color-c12: #ff8e00 !default;\r\n// 下拉选项字体颜色\r\n$--color-c13: #333 !default;\r\n// 滚动条背景色\r\n$--color-c14: #eff4ef !default;\r\n// 弹窗标题背景色\r\n$--color-c15: #1f6c44 !default;\r\n// 禁用输入框背景色\r\n$--color-c16: #f7f9f9 !default;\r\n// 禁用输入框字体颜色\r\n$--color-c17: #666 !default;\r\n// 白色按钮禁用字体颜色 滚动条hover颜色 + -号按钮默认字体颜色\r\n$--color-c18: #7e9e94 !default;\r\n// 弹窗关闭icon的hover色\r\n$--color-c19: #00ff06 !default;\r\n\r\n/* 字体大小，以衣服尺码数来区分大小 XXS、XS、S、M、L、XL、XXL、XXXL\r\n-------------------------- */\r\n$--font-xxl: 32px !default;\r\n$--font-xl: 26px !default;\r\n$--font-l: 24px !default;\r\n$--font-m: 16px !default;\r\n$--font-s: 15px !default;\r\n$--font-xs: 14px !default;\r\n$--font-xxs: 13px !default;\r\n$--font-xxxs: 12px !default;\r\n\r\n/* 圆角\r\n-------------------------- */\r\n$--border-radius-base: 3px !default;\r\n// ellipse tab圆角\r\n$--border-radius-tabs: 13px !default;\r\n// 滚动条\r\n$--border-radius-scroll: 2px !default;\r\n\r\n/* 阴影\r\n-------------------------- */\r\n$--box-shadow-base: 0px 1px 10px 0px rgba($--color-c1, 0.2) !default;\r\n// 按钮阴影\r\n$--box-shadow-btn: 0px 3px 3px 0px rgba(0, 63, 45, 0.45) !default;\r\n// 输入框阴影\r\n$--box-shadow-input: 0 0 0 2px rgba(26, 168, 73, 0.3) !default;\r\n// tabs阴影\r\n$--box-shadow-tabs: 0px -1px 1px 0px rgba($--color-c1, 0.06) !default;\r\n$--box-shadow-ellipse: 0px 2px 6px 0px rgba(38, 50, 56, 0.16) !default;\r\n\r\n/* 高度\r\n-------------------------- */\r\n// 输入框高度\r\n$--height-input: 32px !default;\r\n\r\n/* 宽度\r\n-------------------------- */\r\n// 外框菜单宽度\r\n$--width-menu: 180px !default;\r\n\r\n/* 距离\r\n-------------------------- */\r\n// 表单之间默认距离\r\n$--distance-form: 16px !default;\r\n\r\n// 需适配屏幕分辨率\r\n$--screen-s: 1366px !default;\r\n$--screen-m: 1600px !default;\r\n\r\n// cdn地址\r\n$--cdn-url: \"//cdn.ymm.cn/CDN\";\r\n$--cdn-images: \"#{$--cdn-url}/jerri-ui/assets/images\";\r\n\n// 弹性布局居中\r\n@mixin center {\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n}\r\n\r\n// 占位符混入\r\n@mixin placeholder($color) {\r\n  &::-webkit-input-placeholder {\r\n    color: $color;\r\n  }\r\n}\r\n\r\n// 消除字体上下间距\r\n@mixin removeSpace($size) {\r\n  font-size: $size;\r\n  line-height: $size;\r\n}\r\n\r\n// 多行文本显示省略号\r\n@mixin rowHide($row) {\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  word-break: break-all;\r\n  display: -webkit-box;\r\n  -webkit-box-orient: vertical;\r\n  -webkit-line-clamp: $row;\r\n  cursor: default;\r\n}\r\n\r\n// 单行文本显示省略号\r\n@mixin ellip {\r\n  white-space: nowrap;\r\n  text-overflow: ellipsis;\r\n  overflow: hidden;\r\n}\r\n\r\n// 滚动条混入\r\n@mixin scroll-bar {\r\n  ::-webkit-scrollbar {\r\n    width: 15px;\r\n    height: 15px;\r\n  }\r\n\r\n  /*定义滚动条轨道*/\r\n  ::-webkit-scrollbar-track {\r\n    background-color: $--color-c14;\r\n  }\r\n\r\n  /*定义滑块*/\r\n  ::-webkit-scrollbar-thumb {\r\n    border-radius: $--border-radius-scroll;\r\n    background-color: $--color-c3;\r\n\r\n    &:hover {\r\n      background-color: $--color-c18;\r\n    }\r\n  }\r\n}\r\n\r\n// 媒体查询最大宽度混入 默认1600\r\n@mixin less-resolution($max-width: $--screen-m) {\r\n  @media screen and (max-width: $max-width) {\r\n    @content;\r\n  }\r\n}\r\n\r\n// 弹性布局垂直居中 水平根据参数对齐 默认靠两端平分\r\n@mixin flex-justify($align: space-between) {\r\n  display: flex;\r\n  justify-content: $align;\r\n  align-items: center;\r\n}\r\n\n\r\n@import \"./index.scss\";\r\n"]}