@import "../../style/var.scss";

$icon-size: 32px;

.file-item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: $padding-xs 0;

  .file-item__icon {
    width: $icon-size;
    height: $icon-size;
    flex: 0 0 auto;
    background-size: contain;
    background-repeat: no-repeat;
  }
  .file-item__base-info {
    flex: 1 1 auto;
    margin-left: $padding-xs;
    overflow: hidden;

    .file-item__name {
      color: $text-color;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .file-item__size {
      color: $gray-6;
      font-size: $font-size-xs;
    }
  }
  .file-item__action {
    flex: 0 0 auto;
    padding: 0 8px;
  }
}