nukeop/nuclear

@import '../../../vars';

.similar_artists_container {
  display: flex;
  flex: 1 1 auto;
  flex-flow: column;

  margin: 0 0.5rem;
  cursor: pointer;

  .header {
    margin-bottom: 1rem;

    font-size: 24px;
    font-variant: all-small-caps;
  }

  .artist_row {
    display: flex;
    align-items: center;
    flex-flow: row;

    margin: 2px 0;
    padding: 0.5rem;

    transition: $short-duration;

    border-radius: 2px;
    background: $background2;

    img {
      flex: 0 0 auto;

      width: 3rem;
      height: 3rem;

      border-radius: 50%;
    }

    div {
      margin: 0.25rem 0.5rem;
    }

    &:hover {
      background: lighten($background2, 10%);
    }
  }
}