lingji-work-fe/src/components/custom-table-column-modal/style.scss

.custom-table-column-modal {
  .ant-modal-body {
    .modal-body {
      height: 504px;
      border-radius: 8px;
      border: 1px solid var(--BG-300, #e6e6e8);
      display: flex;
      flex-direction: row;
      .left {
        flex: 1;
        padding: 20px;
        border-right: 1px solid #eee;
        overflow-y: auto;
        .group-item {
          .title-row {
            border-radius: 4px;
            background: var(--BG-100, #f7f8fa);
            display: flex;
            height: 44px;
            padding: 0px 12px;
            align-items: center;
            margin-bottom: 16px;
            .text {
              color: var(--Text-1, #211f24);
              font-family: $font-family-medium;
              font-size: 16px;
              font-style: normal;
              font-weight: 400;
              line-height: 24px; /* 150% */
            }
          }
          .fields {
            width: 100%;
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 16px;
          }
          &:not(:last-child) {
            margin-bottom: 24px;
          }
        }
      }
      .right {
        width: 280px;
        padding: 16px 12px;
        display: flex;
        flex-direction: column;
        .checked-title {
          color: var(--Text-1, #211f24);
          font-family: $font-family-medium;
          font-size: 16px;
          font-style: normal;
          font-weight: 400;
          line-height: 24px;
          .count {
            font-weight: 500;
          }
        }
        .checked-list {
          flex: 1;
          overflow-y: auto;
          .checked-item {
            cursor: move;
            border-radius: 4px;
            background: var(--BG-100, #f7f8fa);
            display: flex;
            height: 32px;
            padding: 0px 12px;
            align-items: center;
            .text {
              color: var(--Text-1, #211f24);
              font-family: $font-family-medium;
              font-size: 14px;
              font-style: normal;
              font-weight: 400;
              line-height: 22px; /* 157.143% */
            }
            &:not(:last-child) {
              margin-bottom: 12px;
            }
          }
          .draggable-list {
            min-height: 40px;
          }
        }
      }
    }
  }
  .arco-modal-footer {

  }
}