layout: default


<!– banner start –> {%- assign banners = site.posts | where: “categories”, “banner” | slice: 0, 4 -%} <div class=“container-fluid bg-grad mb-5 pb-3 pb-md-0 px-0”>

<div class="container">
  <div id="mainbanner" class="carousel slide carousel-fade banner-carousel" data-ride="carousel">
    <ol class="carousel-indicators  d-none d-md-flex">
      {%- for post in banners -%}
      <li data-target="#mainbanner" data-slide-to="{{ forloop.index | minus: 1 }}" {% if forloop.first %}class="active"{% endif %}></li>
      {%- endfor -%}
    </ol>
    <div class="carousel-inner">
      {%- for post in banners -%}
      <div class="carousel-item {% if forloop.first %}active{% endif %}">
        <div class="row">
          <div class="col-md-9 p-0">
            <a href="{{ post.url }}"><div class="img-43 gtm-landing-banner" data-title="{{ post.title }}" style="background-image:url('{{ post.img_h }}')"></div></a>
            <!-- <img src="{{ post.img_h }}" class="d-block w-100" alt="{{ post.title }}"> -->
          </div>
          <div class="col-md-5 p-0 overlap-right position-relative d-flex align-items-center h-100">
            <div class="text-center text-md-left w-100">
              <div class="py-1 px-4 py-md-3 px-md-3 bnr-wrapper text-left">
                <h2>{{ post.title }}</h2>
                <p class="mb-0">{{ post.excerpt | strip_html | truncate: 150 }}</p>
              </div>
              <a href="{{ post.url }}" class="btn btn-secondary float-md-right mt-3 gtm-landing-banner" data-title="{{ post.title }}">View post</a>
            </div>
          </div>
        </div>
      </div>
      {%- endfor -%}
    </div>
    <div class="carousel-control-wrapper d-none d-md-block">
      <a class="carousel-control-prev" href="#mainbanner" role="button" data-slide="prev">
        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
      </a>
      <a class="carousel-control-next" href="#mainbanner" role="button" data-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
      </a>
    </div>
  </div>
</div>

</div> <!– banner end –> <!– shop outfit start –> {% if site.landing.shop %}

{{ site.landing.shop }}

{% else %} <p class=“section-heading”><span>My outfits</span></p> {% assign thumbs = site.posts | slice: 0, 5 %} <div class=“container mb-5”>

<div class="row sm-gutters">
  {%- for post in thumbs -%}
  <div class="col-4 col-md">
    {%- if post.img_t contains 'insta_sc|' -%}
      {%- capture t_url -%}https://instagram.com/p/{{ post.img_t | replace_first: "insta_sc|", "" }}/media/?size=l{%- endcapture -%}
    {%- else -%}
      {%- assign t_url = post.img_t -%}
    {%- endif -%}
    <div class="thumb-post gtm-landing-shop" data-title="{{ post.title }}" data-toggle="modal" data-target="#mdShop{{ forloop.index }}" style="background-image:url('{{ t_url }}')"></div>
  </div>
  {%- endfor -%}
</div>

</div> {% endif %} <!– shop outfit start end –> <!– section 3 start –> {%- assign featured = site.posts | where: “categories”, “featured” -%} <div class=“container mb-5”>

{%- for post in featured -%}
{%- assign ri = forloop.index | modulo: 2 -%}
<div class="row my-7 position-relative">
  <div class="col-md-7 {% if ri==0 %}order-md-2 offset-md-5{% endif %}">
    <a href="{{ post.url }}"><div class="img-34 gtm-landing-featured" data-title="{{ post.title }}" style="background-image:url('{{ post.img_v }}')"></div></a>
    <!-- <img src="{{ post.img_v }}" class="d-block w-100" alt="{{ post.title }}"> -->
  </div>
  <div class="col-md-6 p-md-0 pt-3 {% if ri==0 %}overlap-left order-md-1{% else %}overlap-right{% endif %} d-flex align-items-center h-100">
    <div class="row">
      <div class="col-md-12 d-none d-md-block">
        <a href="{{ post.url }}"><div class="img-43 img-overlap gtm-landing-featured" data-title="{{ post.title }}" style="background-image:url('{{ post.img_h }}')"></div></a>
        <!-- <img src="{{ post.img_h }}" class="d-block w-100 img-overlap" alt="{{ post.title }}"> -->
      </div>
      <div class="col-md-10 mt-md-2 px-5 {% if ri==1 %}offset-md-2{% endif %}">
        <h2>{{ post.title }}</h2>
        <p class="mb-2 outfits-info">
        {%- assign unique_outfits = post.outfits | uniq -%}
        {%- for outfit in unique_outfits -%}
        <span class="px-2 text-primary">{{ outfit.title }}</span>
        {%- endfor -%}
        </p>
        <p>{{ post.excerpt | strip_html | truncate: 80 }}</p>
        <!-- outfits carousel -->
        {%- if post.outfits -%}
        <div id="outfitBanner{{forloop.index}}" class="carousel slide default-carousel" data-ride="carousel">
          <div class="carousel-inner">
          {%- for outfit in post.outfits -%}
          {%- assign rio = forloop.index0 | modulo: 3 -%}
          {%- if rio!=0 -%}{%- continue -%}{%- else -%}
          {%- assign i1 = forloop.index0 | plus: 1 -%}
          {%- assign i2 = forloop.index0 | plus: 2 -%}
          <div class="carousel-item {% if forloop.first %}active{% endif %}">
            <div class="row sm-gutters">
              <div class="col"><a href="{{ post.outfits[forloop.index0].link }}" target="_blank"><div class="thumb-post gtm-shop-item" data-title="{{ post.outfits[forloop.index0].title }} | {{ post.outfits[forloop.index0].link }}" style="background-image:url('{{ post.outfits[forloop.index0].img }}')"></div></a></div>
              <div class="col"><a href="{{ post.outfits[i1].link }}" target="_blank"><div class="thumb-post gtm-shop-item" data-title="{{ post.outfits[i1].title }} | {{ post.outfits[i1].link }}" style="background-image:url('{{ post.outfits[i1].img }}')"></div></a></div>
              <div class="col"><a href="{{ post.outfits[i2].link }}" target="_blank"><div class="thumb-post gtm-shop-item" data-title="{{ post.outfits[i2].title }} | {{ post.outfits[i2].link }}" style="background-image:url('{{ post.outfits[i2].img }}')"></div></a></div>
            </div>
          </div>
          {%- endif -%}
          {%- endfor -%}
          </div>
          <div class="carousel-control-wrapper">
            <a class="carousel-control-prev" href="#outfitBanner{{forloop.index}}" role="button" data-slide="prev">
              <span class="carousel-control-prev-icon" aria-hidden="true"></span>
              <span class="sr-only">Previous</span>
            </a>
            <a class="carousel-control-next" href="#outfitBanner{{forloop.index}}" role="button" data-slide="next">
              <span class="carousel-control-next-icon" aria-hidden="true"></span>
              <span class="sr-only">Next</span>
            </a>
          </div>
        </div>
        {%- endif -%}
        <!-- outfits carousel -->
        <a href="{{ post.url }}" class="btn btn-secondary mt-3 gtm-landing-featured" data-title="{{ post.title }}">View post</a>
      </div>
    </div>
  </div>
</div>
{%- endfor -%}

</div> <!– section 3 end –>

{%- include qv_modal.html data=thumbs modalId=“mdShop” -%}