ze-react-component-library/lib/ZEDashboard/ZEDashboard.less

ZeroETP React Component Library

@import "~antd/es/style/themes/default.less";
@import "~react-grid-layout/css/styles.css";
@import "~react-resizable/css/styles.css";

.full-rest-height {
  height: 100%;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.ze-dashboard {
  width: 100%;
  &.active {
    .ze-dashboard-item {
      box-shadow: 0 1px 12px rgb(var(--ant-primary-color), 0.2);
    }
  }
  .react-grid-placeholder {
    background: rgb(var(--ant-primary-color), 0.5);
  }
  .ze-dashboard-item {
    overflow: hidden;
    background: white;
    position: relative;
    .ze-dashboard-draggable-handler {
      cursor: move;
    }
    > .ze-card {
      height: 100%;
    }
    .ant-spin-nested-loading {
      height: 100%;
      .ant-spin-container {
        height: 100%;
        .ze-card {
          height: 100%;
        }
      }
    }
    .ant-card {
      height: 100%;
      display: flex;
      flex-direction: column;
      .ant-card-body {
        .full-rest-height();
        overflow-y: auto;
        .ze-card-main-content {
          .full-rest-height();
          .ze-card-detail-tabs {
            .full-rest-height();
            .ant-tabs-content-holder {
              .full-rest-height();
              .ant-tabs-content-top {
                height: 100%;
                .ant-tabs-tabpane-active {
                  height: 100%;
                  .ant-spin-container {
                    display: flex;
                    flex-direction: column;
                  }
                }
              }
            }
          }
          .ze-chart,
          .ze-table {
            height: 100%;
          }
        }
      }
    }

    .ze-dashboard-actions {
      position: absolute;
      right: 2px;
      top: 2px;
      z-index: 1;
      cursor: pointer;
    }
  }
}