@import "../../../../styles/var.less";
.editorMain {
  display: flex;
  flex: 1;
  flex-direction: column;
  width: 500px; // 很奇怪  设置了width后flex=1才生效
  height: calc(100vh - 152px);
  color: hsl(0, 0%, 58%);
  border-left: 1px solid @border-color;

  .context {
    height: 30vh;
    background-color: #ccc;
  }

  .sqlResult {
    position: relative;
    flex: 1;

    .title {
      position: absolute;
      top: 32px;
      width: 32px;
      height: 100%;
      padding-top: 8px;
      border-right: 1px solid #ccc;

      .saveIcon {
        color: @primary-color;
      }
    }

    .resultTabs {
      .tabList {
        width: calc(100vw - 433px);
        height: 32px;
        border-bottom: 1px solid #ccc;

        :global .ant-tabs {
          &:nth-child(1) {
            margin-left: 20px;
          }
          .ant-tabs-tab {
            padding: 5px 0;
          }
        }
        :global .ant-tabs-top > .ant-tabs-nav {
          margin-bottom: 0px;
        }
      }
    }

    .luckysheet {
      position: relative;
      height: calc(40vh - 32px - 32px);
    }
  }

  .empty {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }

  :global .ant-spin-nested-loading {
    height: 100%;
    :global .ant-spin-container {
      display: flex;
      flex-direction: column;
      height: 100%;
    }
  }
}
