{{define "home:items"}}

{{ $itemCount := 0 }}

{{ range.items }}
  <div class="w3-col l4 m6 s12 item" style="margin-bottom: 10px;"
  {{ $itemCount = incr $itemCount}}
    {{ if eq $itemCount 10 }}
    {{ $offset := addI $.offset $itemCount}}
    hx-get="/?offset={{ $offset }}&out=items"
    hx-trigger="revealed"
    hx-swap="afterend"
    {{ end }}
  >
    <div class="w3-card w3-display-container w3-round-large" style="padding: 10px; background-color: #fff;">
      <div class="w3-row">
        <div class="w3-col l11 m11 s11">
          <h5 style="color: #2b5797">
            <a
              class="w3-hide-small"
              href="/item/view/{{.Id}}"
              hx-get="/item/view/{{.Id}}"
              hx-target="#modal-container"
              ><i class="{{.Type_icon}}" title="{{.Type_title}}"></i> {{.Title}}</a>
    
            <a
            class="w3-hide-medium w3-hide-large"
            href="/item/read/{{.Id}}"
            hx-get="/item/read/{{.Id}}"
            hx-target="#page-content"
            hx-push-url="true"
            ><i class="{{.Type_icon}}" title="{{.Type_title}}"></i> {{.Title}}</a>
         
          </h5>
          <div class="home-card-summary">
            {{.Summary | markdownfy | safeHTML}}
          </div>
        </div>
        <div class="w3-col l1 m1 s1">
          <a
          class="w3-btn w3-medium w3-round-large"
          style="float: right; padding: 8px 8px"
          hx-get="/item/update/{{.Id}}"
          hx-push-url="true"
          hx-target="#page-content"
          href="/item/update/{{.Id}}"
          title="Edit"><i class="bi bi-pencil"></i>
        </a>
        
        <a
        class="w3-btn w3-medium w3-round-large"
        style="float: right; padding: 8px 8px"
        href="#"
        hx-target="#modal-container"
        hx-get="/item/share/{{.Id}}"
        title="Share"><i class="bi bi-share-fill"></i>
        </a>
        
        <a
        class="w3-btn w3-medium w3-round-large"
        style="float: right; padding: 8px 8px"
        href="#"
        hx-delete="/item/remove-from-dashboard/{{.Id}}"
        hx-target="closest .item"
        hx-swap="outerHTML swap:1s"
        hx-trigger="confirmed"
        onClick="bm_show_confirm(this, 'Dashboard', 'Remove this item from the dashboard ?')"
        title="Remove from dashboard"> <i class="bi bi-pin"></i>
        </a>
        </div>
      </div>

    </div>
  </div>
  {{ end }}

  {{ end }}