codevise/pageflow

ul.files_gallery {
  margin-top: 10px;

  > li {
    margin-bottom: 2px;
    position: relative;
    overflow: hidden;
    float: left;
    text-align: center;
    padding: space(2);
    width: 120px;
    cursor: pointer;
    border: solid 3px transparent;
    border-radius: rounded();

    &:hover {
      background-color: var(--ui-selection-color-lighter);
    }

    &.active {
      background-color: var(--ui-selection-color-lighter);
      border: solid 3px var(--ui-selection-color);
    }

    &.disabled {
      background-color: transparent;
      opacity: 0.5;
      cursor: default;

      @include background-icon-right(var(--ui-primary-color), 22px, 18px);
      @include check-icon;
    }
  }

  li.blank_slate {
    text-align: center;
    padding: 10px 5px 20px 5px;
    color: var(--ui-primary-color-light);
  }

  .file_thumbnail {
    height: 100px;
    width: 100px;
    display: block;
    margin: auto;
    border-radius: rounded();
    overflow: hidden;
  }

  .file_name {
    margin-top: 5px;
    display: block;

    height: 1.3em;
    @include label;
  }
}