@import '../../style/index';

@minimap-prefix-cls: ~'@{x6-prefix}-widget-minimap';

.@{minimap-prefix-cls} {
  position: relative;
  display: table-cell;
  box-sizing: border-box;
  overflow: hidden;
  text-align: center;
  vertical-align: middle;
  background-color: #fff;
  user-select: none;

  .@{x6-prefix}-graph {
    display: inline-block;
    box-shadow: 0 0 4px 0 #eee;
    cursor: pointer;

    > svg {
      pointer-events: none;
      shape-rendering: optimizeSpeed;
    }

    .@{x6-prefix}-node * {
      /* stylelint-disable-next-line */
      vector-effect: initial;
    }
  }

  &-viewport {
    position: absolute;
    box-sizing: content-box !important;
    margin: -2px 0 0 -2px;
    border: 2px solid #31d0c6;
    cursor: move;
  }

  &-viewport-zoom {
    position: absolute;
    right: 0;
    bottom: 0;
    box-sizing: border-box;
    width: 12px;
    height: 12px;
    margin: 0 -6px -6px 0;
    background-color: #fff;
    border: 2px solid #31d0c6;
    border-radius: 50%;
    cursor: nwse-resize;
  }
}