@import "../settings.colors";

@import "tools.functions";
@import "components.scroll-menu";

@mixin c-market-ticker--expanded($height: rem(100)) {
  @include c-market-ticker-height($height);
  .c-market-ticker {
    @include c-scroll-menu-show-arrows-when-required;
  }
  .c-market-ticker-card {
    border-right: 1px solid $color-stone-200;
  }
  .c-market-ticker-card__content {
    flex-direction: column;
    align-items: baseline;
  }
  .c-market-ticker-card__arrow {
    display: inline-block;
  }
  .c-market-ticker-card__row--name {
    padding-right: 0;
    padding-bottom: rem(6);
  }
  .c-market-ticker-card__row--time,
  .c-market-ticker-card__row--price {
    display: block;
  }
}

@mixin c-market-ticker-height($height) {
  .c-market-ticker .c-scroll-menu {
    @include c-scroll-menu-height($height);
  }
  .c-market-ticker-card {
    height: $height;
  }
}
