portfolio_li_card.html 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. {{ $item := .item }}
  2. {{ $widget := .widget }}
  3. {{ $link := .link }}
  4. {{ $target := .target }}
  5. {{/* Get summary. */}}
  6. {{ $summary := "" }}
  7. {{ if $item.Params.summary }}
  8. {{ $summary = $item.Params.summary | markdownify | emojify }}
  9. {{ else if .Params.abstract }}
  10. {{ $summary = .Params.abstract | markdownify | emojify | truncate (site.Params.abstract_length | default 135) }}
  11. {{ else if $item.Summary }}
  12. {{ $summary = $item.Summary }}
  13. {{ end }}
  14. {{ $resource := ($item.Resources.ByType "image").GetMatch "*featured*" }}
  15. {{ $js_tag_classes := delimit (apply (apply $item.Params.tags "replace" "." " " "-") "printf" "js-id-%s" ".") " " }}
  16. <div class="project-card project-item isotope-item {{ $js_tag_classes | safeHTMLAttr }}">
  17. <div class="card">
  18. {{ with $resource }}
  19. {{ $filters := slice (images.GaussianBlur 21) (images.Pixelate 8) }}
  20. {{ $image := .Resize "550x" }}
  21. {{ $image_lq := (.Resize "550x q1").Filter $filters }}
  22. <a href="{{ $link }}" {{ $target | safeHTMLAttr }} class="card-image hover-overlay">
  23. <img src="{{ $image_lq.RelPermalink }}" data-src="{{ $image.RelPermalink }}" alt="{{ $item.Title }}" class="img-responsive lazyload">
  24. </a>
  25. {{ end }}
  26. <div class="card-text">
  27. <h4><a href="{{ $link }}" {{ $target | safeHTMLAttr }}>{{ $item.Title | markdownify | emojify }}</a></h4>
  28. {{ with $summary }}
  29. <div class="article-style">
  30. <p>{{ . }}</p>
  31. </div>
  32. {{ end }}
  33. </div>
  34. </div>
  35. </div>