nukeop/nuclear

@import '../../mixin.scss';
@import '../../vars.scss';

.local_files_view {
  display: flex;
  flex-flow: column;
  height: 100%;

  .search_field_row {
    display: flex;
    flex-flow: row;
    justify-content: space-between;
    flex: 0 0 auto;

    .input {
      @include roundCorners;
      @include transition;
      border: 1px solid $white;
      padding: .67861429em 1em;

      &:hover,
      &:focus,
      &:active {
        border: 1px solid rgba($blue, 0.9);
      }

      i {
        margin-left: 0.7em !important;
      }
    }
  }

  .library_contents {
    position: relative;
    display: flex;
    flex-flow: column;
    flex: 1 1 auto;
    height: 0;

    .album_cards,
    .album_grid {
      flex: 1 1 auto;
    }

    .album_cards {
      padding-right: 2em;
    }
  }

  .tracks_container {
    padding: 0;
    overflow: auto;
  }

  .tracks_container .library_simple_list {
    margin-top: 0;
    padding-left: 0;
    padding-right: 0;

    // fix for react-list excluding header from its height-calc
    div:nth-child(2) { margin-bottom: 58px; }
  }
}