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

@scroller-prefix-cls: ~'@{x6-prefix}-graph-scroller';

.@{scroller-prefix-cls} {
  position: relative;
  box-sizing: border-box;
  overflow: scroll;
  outline: none;

  &-content {
    position: relative;
  }

  &-background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }

  .@{x6-prefix}-graph {
    position: absolute;
    display: inline-block;
    margin: 0;
    box-shadow: none;

    > svg {
      display: block;
    }
  }

  &&-paged {
    .@{x6-prefix}-graph {
      box-shadow: 0 0 4px 0 #eee;
    }
  }

  &&-pannable[data-panning='false'] {
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
  }

  &&-pannable[data-panning='true'] {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
    user-select: none;
  }
}

.@{x6-prefix}-graph-pagebreak {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  &-vertical {
    position: absolute;
    top: 0;
    bottom: 0;
    box-sizing: border-box;
    width: 1px;
    border-left: 1px dashed #bdbdbd;
  }

  &-horizontal {
    position: absolute;
    right: 0;
    left: 0;
    box-sizing: border-box;
    height: 1px;
    border-top: 1px dashed #bdbdbd;
  }
}