Skip to main content

# Barre d'actions

# Boutons centrés

    <div class="row action-block">
      <button class="btn btn-link">Abandonner</button>
      <button class="btn btn-default">Instancier</button>
      <button class="btn btn-primary">Valider</button>
    </div>

# Boutons à gauche

    <div class="row action-block">
      <div class="action-group-left">
      ...
      </div>
    </div>

# Boutons à droite

    <div class="row action-block">
      <div class="action-group-right">
      ...
      </div>
    </div>

# Boutons séparés

    <div class="row action-block">
      <div class="action-group-left">
        <button class="btn btn-link">Abandonner</button>
      </div>
      <div class="action-group-right">
        <button class="btn btn-default">Instancier</button>
        <button class="btn btn-primary">Valider</button>
      </div>
    </div>

    <nav id="zone-de-travail-footer">
      <a href="#" class="btn btn-link">Lien vers une application</a>
      <a href="#" class="btn btn-link">Autre lien</a>
      <a href="#" class="btn btn-link">Lien vers un processus</a>
      <a href="#" class="back-to-top btn">
        <span>Haut de page</span>
        <span class="am-icon icon-arrow-up"></span>
      </a>
      </div>
    </nav>

# Actions de tableau

        <div class="table-action-block">
      <div data-toggle="dropdown" class="action-group-left dropdown">
        <button type="button" aria-label="rafarichir le tableau" class="btn btn-icon">
          <span class="am-icon icon-refresh"></span>
        </button>
        <button type="button" aria-haspopup="true" role="menu" aria-expanded="false" aria-label="Choisir les colonnes à afficher" class="btn btn-icon"><span class="am-icon icon-eye"></span></button>
        <div role="menu" class="dropdown-menu">
          <div class="dropdown-header">
            <h2 id="select-view-columns">Afficher les colonnes</h2>
          </div>
          <ul role="menu" class="dropdown-body keep-open">
            <li role="menuitem" class="dropdown-item form-check-inline">
              <label class="form-check-label">
                <input type="checkbox" class="form-check-input"><span>Tout sélectionner</span>
              </label>
            </li>
            <li role="menuitem" class="dropdown-item form-check-inline">
              <label class="form-check-label">
                <input type="checkbox" aria-checked="false" aria-invalid="false" class="form-check-input"><span>nir</span>
              </label>
            </li>
            <li role="menuitem" class="dropdown-item form-check-inline">
              <label class="form-check-label">
                <input type="checkbox" aria-checked="false" aria-invalid="false" class="form-check-input"><span>nom</span>
              </label>
            </li>
            <li role="menuitem" class="dropdown-item form-check-inline">
              <label class="form-check-label">
                <input type="checkbox" aria-checked="false" aria-invalid="false" class="form-check-input"><span>prénom</span>
              </label>
            </li>
            <li role="menuitem" class="dropdown-item form-check-inline">
              <label class="form-check-label">
                <input type="checkbox" aria-checked="false" aria-invalid="false" class="form-check-input"><span>date de naissance</span>
              </label>
            </li>
          </ul>
          <div class="dropdown-footer">
            <button class="btn btn-sm btn-default">Annuler</button>
            <button class="btn btn-sm btn-default">Valider              </button>
          </div>
        </div>
      </div>
      <div class="action-group-right search-block">
        <div class="input-group input-group-sm">
          <input type="text" placeholder="Recherche" class="form-control">
          <div class="input-group-append">
            <button type="button" class="btn btn-default"><span class="am-icon icon-detailview"></span></button>
          </div>
        </div>
        <button class="btn btn-link">Réinitialiser      </button>
      </div>
      </div>