split.component.scss

@import '../../../variables';

:host {
  z-index: 100;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  cursor: row-resize;

  &:hover {
    //transform: translateY(-$s);
  }

  .handle {
    position: absolute;
    width: 100%;
    height: 6px;
    top: -3px;
    display: block;
    //box-shadow: 0 -4px 12px 0 rgba(0, 0, 0, .3);
    box-shadow:  0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12), 0 -3px 12px 0 rgba(0, 0, 0, .4);
  }

  button {
    position: absolute;
    transform: translate(-50%, -50%);
    left: 50%;
  }
}