magic-page-designer/src/components/resize-container/resize-container.less

magic-page-designer 是一个基于 vue 的在线页面快速开发平台，主要把所有的 vue 代码都改为在线配置，最终获得一个 json 格式的页面，你可以把它存放到服务器的任何地方：数据库、静态文件、redis 等。最方便的是可以在线修改页面，再也不用担心生产出问题了，还得打开 IDE，修改测试打包，直接在线编码，所见即所得。还可以配合 [magic-api](https://gitee.com/ssssssss-team/magic-api) 使用，完全抛弃 IDE，随时随地 code w

.mpd-resize-container {
  position: relative;

  .mpd-resize-block {
    position: absolute;
    --mpd-resize-block-size: 3px;
    --mpd-resize-block-offect: -1px;
    &.top {
      top: var(--mpd-resize-block-offect);
    }
    &.bottom {
      bottom: var(--mpd-resize-block-offect);
    }
    &.top,
    &.bottom {
      left: 0;
      width: 100%;
      height: var(--mpd-resize-block-size);
      cursor: s-resize;
      z-index: 9999;
    }
    &.left {
      left: var(--mpd-resize-block-offect);
    }
    &.right {
      right: var(--mpd-resize-block-offect);
    }
    &.left,
    &.right {
      top: 0;
      width: var(--mpd-resize-block-size);
      height: 100%;
      cursor: w-resize;
      z-index: 9999;
    }
  }
}