{~@json=json_decode(@this->raw(@post.json), true)~}
{~@pics=count(@json)~}
  <div class="card shadow border-0" data-aos="zoom-out" data-aos-duration="500">
    <div class="p-2">
      <div class="gridpreviewserie rounded-2 overflow-hidden">
        <repeat group="{{@json}}" value="{{@ph}}" counter="{{@i}}">
          <check if="{{@i < 4}}">
            {~@duration=1000+(@i*300)~}
            <div>
              <img src="{{@set_home . @ph.thumb}}" style="width:100%;height:100%;"  data-aos="zoom-in" data-aos-duration="{{@duration}}" alt="{{@post.title}}" />
            </div>
          </check>
        </repeat>
        <div>
        </div>
      </div>
    </div>
    <div class="card-body pt-0">
      <span class="badge text-secondary rounded-0 bg-primary text-uppercase"><i class="bi bi-images  me-1"></i> {{@lang.mainmodules.content.serie.name}}</span>
      <span class="badge text-primary rounded-0 bg-secondary">{{@pics}} {{licz(@pics, @lang.mainmodules.content.serie.count1, @lang.mainmodules.content.serie.count2, @lang.mainmodules.content.serie.count3)}}</span>
      <h3 class="mt-1"><a class="text-decoration-none text-dark stretched-link" href="{{@homesite . @lang.params.links.browser.gallery . @post.id}}">{{@post.title}}</a></h3>
      <div class="text-muted small">
        {{@post.note | raw}}
      </div>
    </div>
    <div class="card-footer text-dark">
      <div class="d-flex align-items-center justify-content-between">
        <div></div>
        <span class="small opacity-50"><i class="bi bi-calendar-event me-1"></i> {{@post.date}}</span>
      </div>
    </div>
  </div>