{{ if site.Params.env_bookshop_live }}

<section class="section projects" id="projects">
  <div class="container">
    <div class="row">
      <div class="col col-12">
        <div class="contaniner__inner animate">

          <div class="section__info">
            <div class="section__head">
              <h2 class="section__title">{{ .title }}</h2>
              <a class="section__link" href="{{ .link_url }}">{{ T "view_all" "View all" }} <ion-icon name="arrow-forward" aria-hidden="true"></ion-icon></a>
            </div>
            <div class="section__description">{{ .description_html | safeHTML }}</div>
          </div>

          <div class="row">

            {{ range seq 3 }}
            {{ $c := "c-project-card" }}
            <div class="{{$c}} col col-4 col-d-6 col-t-12">
              <div class="{{$c}}__inner">
                <div class="{{$c}}__image-wrap">
                  <a class="{{$c}}__image" href="/">
                    <img loading="lazy" src="{{ partial "jsdelivr-url.html" "/static/images/post-9.webp" }}" alt="title">
                  </a>
                </div>
            
                <div class="{{$c}}__content">
            
                  <div class="{{$c}}__tags-box">
                      <a href="/" class="{{$c}}__tag">travel</a>
                      <a href="/" class="{{$c}}__tag">lifestyle</a>
                  </div>
            
                  <h2 class="{{$c}}__title">
                    <a href="/">This is an example compositions card so you can see what it could look like</a>
                  </h2>
            
                  <p class="{{$c}}__excerpt">
                    Your actual compositions posts will be displayed on the page rather than these example cards which cannot be edited here.
                  </p>
            
                  <div class="{{$c}}__meta">
                    <div class="{{$c}}__author-image">
                      <img loading="lazy" src="{{ partial "jsdelivr-url.html" "/static/images/page-1.webp" }}" alt="Author Name">
                    </div>
                    <div class="{{$c}}__info">
                      <div class="{{$c}}__author-name">Author Name</div>
                      <span class="{{$c}}__date"><time datetime="2018-11-05 15:01:35 +0300">2018-11-05 15:01:35 +0300</time></span>
                    </div>
                  </div>
            
                </div>
              </div>
            </div>
            {{ end }}
          </div>
        </div>
      </div>
    </div>
  </div>
</section>


{{ else }}
<!-- begin projects -->
<section class="section projects" id="projects">
  <div class="container">
    <div class="row">
      <div class="col col-12">
        <div class="contaniner__inner animate">

          <div class="section__info">
            <div class="section__head">
              <h2 class="section__title">{{ .title }}</h2>
              <a class="section__link" href="{{ .link_url }}">{{ T "view_all" "View all" }} <ion-icon name="arrow-forward" aria-hidden="true"></ion-icon></a>
            </div>
            <div class="section__description">{{ .description_html | safeHTML }}</div>
          </div>

          {{ if .show_projects }}
          <div class="row">
            {{ range where site.RegularPages "Section" "projects" | first 3 }}
              {{ partial "bookshop" (slice "project-card" (dict
                "url" .RelPermalink
                "image" .Params.image
                "title" .Params.title
                "subtitle" .Params.subtitle
                "description" .Params.description
                "date" .Date
                "tags" (.GetTerms "blog_tags")
              )) }}
            {{ end }}
          </div>
          {{ end }}

        </div>
      </div>
    </div>
  </div>
</section>
{{ end }}
<!-- end projects -->