cc-core-cli/template/admin/public/static/styles/collections.less

Command Line Interface tool for generating project templates for the (Your Platform's Name) platform.

.file-collections-items {
  padding      : 12px;
  border       : 1px solid #d9d9d9;
  border-radius: 4px;
  cursor       : pointer;
  position     : relative;

  &.selected {
    border-color: @primary-color  !important;

    .bulk-container {
      display: block;
    }
  }

  .bulk-container {
    display : none;
    position: absolute;
    top     : 10px;
    left    : 10px;
    z-index : 2;
  }

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

  .file-title-container {
    display    : flex;
    flex-flow  : row nowrap;
    align-items: center;

    .file-name {
      flex-grow: 2;
      width    : 0px;

      .name {
        max-width: 100%;
      }
    }

    .file-type {
      margin-left     : 10px;
      padding         : 2px 4px 2px 4px;
      border-radius   : 2px;
      background-color: rgb(242, 243, 244);


      .type {
        max-width: 100%;
        color    : rgb(158, 167, 184);
      }
    }
  }

  .file-ext-size {
    max-width: 100%;
    color    : #707070;
  }
}

.file-collections-items:hover {
  border-color: #afafaf;

  .bulk-container {
    display: block;
  }
}

.file-detail-container {
  .file-description-container {
    padding         : 10px 10px 4px;
    background-color: #f7f7f7;
    border-radius   : 2px;

    .ant-typography {
      max-width: 100%;
      font-size: 12px;
      color    : #707070;
    }
  }
}

.file-preview-container {
  display        : flex;
  justify-content: center;
  align-items    : center;
  border-radius  : 2px;
  border         : 1px solid #d9d9d9;
  padding        : 8px;
  width          : 100%;
  height         : 100%;
  max-height     : 400px;
  position       : relative;

  .file-actions {
    position: absolute;
    top     : 10px;
    right   : 10px;
  }
}

.image-preview-container {
  display        : flex;
  justify-content: center;
  align-items    : center;  
  padding        : 8px;
  width          : 100%;
  height         : 100%;
  max-height     : 400px;
  position       : relative;
  min-height     : 200px;

  .file-actions {
    position: absolute;
    top     : 10px;
    right   : 10px;
  }
}