Source code

src/showcase/pages/components/lists.html

This file is included in this documentation build. It is displayed as code and is not executed.

Download source

<!--
Demonstrate the lists component on its own lazy route.

@author Laurent Declercq l.declercq@agon-innovation.ch
@version 20260921
-->
<section x-data="componentCatalog" class="component-library">
  <include src="partials/components/page-header.html" locals='{"title":"componentLists"}'></include>
  <div class="catalog-grid">
    <article class="card">
      <header class="card-header"><h2 x-text="$t('galleryTeam')"></h2></header>
      <div class="card-body">
        <div class="list-group">
          <button
            class="list-group-item list-group-item-action d-flex justify-content-between"
            @click="$store.toasts.push($t('toastExample'))"
          >
            <span x-text="$t('notifications')"></span>
            <span class="badge" data-tone="accent">8</span>
          </button>
          <a
            class="list-group-item list-group-item-action"
            href="/users"
            x-link
            x-text="$t('users')"
          ></a>
          <button class="list-group-item" disabled x-text="$t('disabled')"></button>
        </div>
      </div>
    </article>
  </div>
</section>