pureline.slim

.promo-page class="age-{{currentAge}}"
  .promo-page__super-text v-if="currentSlide == 'on-start'" transition="minimized"
    .tbl
      .col
        strong Посмотри, как меняется
        div лицо женщины с возрастом
  .promo-page__head
    = render 'slider'

  .promo-page__hint.choose-age v-if="currentSlide == 'on-start'": .col Выберите <br />возраст

  .promo-page__body class="{{currentSlide}}"
    .slide.slide-main v-if="currentSlide == 'on-start' || currentSlide == 'main' || currentSlide == 'hexagons' || currentSlide == 'getcream'" v-bind:class="{'with-cream': showCreamHand}"
      .women-wrap v-if="women[currentAge].showImages"
        img.women :src="women[currentAge].after"
        img.women.erasable :src="women[currentAge].before"

      .hexagon-group v-if="women[currentAge].showHexTop || currentSlide == 'hexagons'" transition="fade"
        .hexagon.hexagon_top
          .hexagon__inner {{{women[currentAge].hexagon_top}}}
        .hexagon.hexagon_top.flower
          img :src="women[currentAge].hexagon_top_flower"

      .hexagon-group v-if="women[currentAge].showHexRight || currentSlide == 'hexagons'" transition="fade"
        .hexagon.hexagon_right
          .hexagon__inner {{{women[currentAge].hexagon_right}}}
        .hexagon.hexagon_right.flower
          img :src="women[currentAge].hexagon_right_flower"

      .hexagon-group v-if="women[currentAge].showHexBottom || currentSlide == 'hexagons'" transition="fade"
        .hexagon.hexagon_bottom
          .hexagon__inner {{{women[currentAge].hexagon_bottom}}}
        .hexagon.hexagon_bottom.flower
          img :src="women[currentAge].hexagon_bottom_flower"

      .cream-pot v-if="women[currentAge].showCreamPot" v-on:click="getCream"
      .cream-pot-shadow v-if="women[currentAge].showCreamPot" v-on:click="getCream"
      .cream-pot-arrow v-if="women[currentAge].showCreamPot && !isMobile"

      .skin-arrows v-if="showSkinArrows" transition="slide-up"

      .promo-page__hint.big v-if="women[currentAge].showHint"
        .col {{{women[currentAge].hint}}}

      .promo-page__hint.big v-if="showHintUseCream"
        .col Не забудьте <br> нанести крем на шею и зону декольте!

      .mobile-main-footer v-if="showMobileFooter"
        .text v-if="!showCreamHand" transition="fade" {{{women[currentAge].hint}}}
        .text v-if="showCreamHand" transition="fade" Наш крем <br> подходит для шеи <br> и зоны декольте

    .slide.slide-main v-if="currentSlide == 'mobile-hexagons'"
      .hexagon.hexagon_top
        .hexagon__inner {{{women[currentAge].hexagon_top}}}
      .hexagon.hexagon_top.flower
        img :src= "women[currentAge].hexagon_top_flower"

      .hexagon.hexagon_right
        .hexagon__inner {{{women[currentAge].hexagon_right}}}
      .hexagon.hexagon_right.flower
        img :src= "women[currentAge].hexagon_right_flower"

      .hexagon.hexagon_bottom
        .hexagon__inner {{{women[currentAge].hexagon_bottom}}}
      .hexagon.hexagon_bottom.flower
        img :src= "women[currentAge].hexagon_bottom_flower"

      .mobile-cream-pot
      .mobile-cream-pot-shadow

    .slide.slide-superiority v-if="currentSlide == 'superiority'"
      .cream-pot-expensive
      .cream-pot-chip-left
      .cream-pot-chip-right
      .shout Думаете, только недоступные кремы способны на такое?

    .slide.slide-product v-if="currentSlide == 'product'"
      .time-badge v-if="!isMobile" Результат уже через 16 дней!<sup>*</sup>
      .product
        img.product-cream-pot src="/anticollagen/product-cream-pot.png"
        img.product-image-day :src="women[currentAge].product_image_day"
        img.product-image-night :src="women[currentAge].product_image_night"
      div
        /a.btn-deals href="/crm_promos" ПОЛУЧИ КРЕМ БЕСПЛАТНО!
        a.btn-catalog :href="women[currentAge].product_link" v-on:click="checkedGA(['send', 'event', 'user', 'go_to_the_catalog']), checkedYA('go_to_the_catalog')" Переход в каталог
      .shout Теперь ваш любимый крем "ЧИСТАЯ ЛИНИЯ" содержит комплекс [ФИТОколлаген] из ростков и семян пшеницы!
      .slide-product-footer
        a.btn-more-left href="/articles/antivozrastnye-kremy" v-on:click="checkedGA(['send', 'event', 'user', 'go_to_article']), checkedYA('go_to_article')" УЗНАТЬ БОЛЬШЕ О КОМПЛЕКСЕ - [ФИТОКОЛЛАГЕН]
        a.btn-more-right href="/collagen/video" v-on:click="checkedGA(['send', 'event', 'user', 'go_to_the_video']), checkedYA('go_to_the_video')" Видеоуроки для правильного массажа
    .scroll-hint v-if="isMobile && currentSlide != 'product'" Далее

  .promo-page__track v-if="currentSlide != 'on-start' && !isMobile"
    span.point v-bind:class="{ active: inPath('main') }" v-on:click="currentSlide = 'main'"
    span.point v-bind:class="{ active: inPath('getcream') }" v-on:click="currentSlide = 'getcream'"
    span.point v-bind:class="{ active: inPath('hexagons') }" v-on:click="currentSlide = 'hexagons'"
    span.point v-bind:class="{ active: inPath('superiority') }" v-on:click="currentSlide = 'superiority'"
    span.point v-bind:class="{ active: inPath('product') }" v-on:click="currentSlide = 'product'"

  .promo-page__footer
    span.next-slide v-if="!isMobile && currentSlide != 'product'" v-on:click="nextSlide(slides)" Далее
    div v-if="!isMobile"
      span Художественная иллюстрация.
      '
      span v-if="currentSlide == 'product'" <sup>*</sup>По результатам потребительского тестирования комплекса «дневной крем + ночной крем»: 100 респондентов, мин. 71% согласившихся, Россия, 2016.