.resizable {
  &-wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    position: relative;
    align-items: center
  }

  &-aside {
    height: 100%;
    position: relative;
    border-right: 1px solid #ddd;
  }
  
  &-resizer {
    top: calc(~'(100% - (var(--resizer-size) / 2)) / 2');
    right: calc(~'-0px - (var(--resizer-size) / 2)');
    cursor: ew-resize;
    z-index: 10;
    position: absolute;
    font-size: var(--resizer-size);
    user-select: none;
  }
}