wanderer/assets/js/hooks/Mapper/components/ui-kit/WindowManager/WindowManager.module.scss

.windowContainer {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.window {
  position: absolute;
  //background: #fff;
  //border: 1px solid #000;
  //box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  user-select: none;

  pointer-events: initial;
}

.resizeHandle {
  position: absolute;
  //background: rgba(0, 0, 0, 0.2);
  width: 15px;
  height: 15px;
}

.topRight,
.bottomLeft {
  cursor: nesw-resize;
}

.topLeft,
.bottomRight {
  cursor: nwse-resize;
}

.topLeft {
  top: -7.5px;
  left: -7.5px;

  &::after {
    position: relative;
    top: 7.5px;
    left: 7.5px;
    display: block;
    content: " ";
    width: 5px;
    height: 5px;
    border-left: 1px solid var(--window-corner);
    border-top: 1px solid var(--window-corner);
    pointer-events: none;
  }
}

.topRight {
  top: -7.5px;
  right: -7.5px;

  &::after {
    position: relative;
    top: 7.5px;
    right: -2.5px;
    display: block;
    content: " ";
    width: 5px;
    height: 5px;
    border-right: 1px solid var(--window-corner);
    border-top: 1px solid var(--window-corner);
    pointer-events: none;
  }
}

.bottomLeft {
  bottom: -7.5px;
  left: -7.5px;

  &::after {
    position: relative;
    top: 2.5px;
    left: 7.5px;
    display: block;
    content: " ";
    width: 5px;
    height: 5px;
    border-left: 1px solid var(--window-corner);
    border-bottom: 1px solid var(--window-corner);
    pointer-events: none;
  }
}

.bottomRight {
  bottom: -7.5px;
  right: -7.5px;

  &::after {
    position: relative;
    top: 2.5px;
    right: -2.5px;
    display: block;
    content: " ";
    width: 5px;
    height: 5px;
    border-right: 1px solid var(--window-corner);
    border-bottom: 1px solid var(--window-corner);
    pointer-events: none;
  }
}

.top {
  top: -5px;
  left: 0;
  right: 0;
  height: 10px;
  cursor: ns-resize;
}

.bottom {
  bottom: -5px;
  left: 0;
  right: 0;
  height: 10px;
  cursor: ns-resize;
}

.left {
  top: 0;
  bottom: 0;
  left: -5px;
  width: 10px;
  cursor: ew-resize;
}

.right {
  top: 0;
  bottom: 0;
  right: -5px;
  width: 10px;
  cursor: ew-resize;
}