<link href="assets/plugins/lity/dist/lity.min.css" rel="stylesheet">
<script src="assets/plugins/lity/dist/lity.min.js"></script>

<div class="card">
  <div class="list-group list-group-flush">
    <a href="#" class="list-group-item list-group-item-action d-flex align-items-center text-black">
      <div class="flex-fill pe-3">
        <div class="fw-semibold">Library (20)</div>
        <div class="small text-body text-opacity-50">3,192 Image Found</div>
      </div>
      <div>
        <i class="fa fa-chevron-right fa-lg text-body text-opacity-50"></i>
      </div>
    </a>
  </div>
  <div class="card-body">
    <div class="widget-img-list">
      <div class="widget-img-list-item"><a href="/assets/img/gallery/gallery-1.jpg" data-lity><span class="img" style="background-image: url(/assets/img/gallery/gallery-1.jpg)"></span></a></div>
      ...
    </div>
  </div>