TablerBundle card `collapsible` VS Tabler `Accordion` about tablerbundle HOT 5 CLOSED

It is a feature carried over from AdminLTE and adapted to work with Tabler.

Accordions are using card internally, but to me they are two different features.

The issue appears if you use other card action buttons (I will update the demo app to include examples):

So if we change it, it must go hand in hand with additional buttons and change their appearance as well.

I updated the demo app to showcase the issue in combination with the available action_cardtoolbutton macro:

If you use action buttons in card headers, they should all look the same. The accordion button style is different.
And regular end user already have an issue finding action buttons, let alone if we would remove the border.

Probably we should add an embed and helper macros for the accordion and then come back here? Or do you have another proposal?

from tablerbundle.

IMO from a dev perspective (not Bundle dev),
action buttons in "card headers" and "collapsible" cannot be together.

With your example, it's weird to be able to a edit card that is not "open" or readable.
Even if the edit button trigger the collapse event.

Anyway,
with what Tabler has done on the accordion, we cannot add multiple button on the header.
Because the title is one GIANT button.

What is cool with that is the click event which open the "card" is binded anywhere on the "header".

At the end, I don't know what is the better 😄
Collapsible card is useful, but out of bound from Tabler.
Accordion is cool, but need a full implementation like card embed today..

I don't know if I have the time, but I can take a look how to make a macro about that

from tablerbundle.

I've achieved to make a false "card" from an accordion. (live code with Firefox from Tabler.io)

<div class="page-body">
  <div class="container-xl">
    <div id="accordion-example" class="card accordion">
      <div class="">
        <h2 class="accordion-header" id="heading-1">
          <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapse-1" aria-expanded="true">
            <i class="fas fa-search me-1"></i>Filtre </button>
        </h2>
        <div id="collapse-1" data-bs-parent="#accordion-example" style="" class="accordion-collapse border-top collapse show">
          <div class="accordion-body">
            <div class="row">
              <div class="col-auto">
                <div class="mb-3">
                  <label class="form-label" for="tiers_filter_type">Type</label>
                  <select id="tiers_filter_type" name="tiers_filter[type]" class="form-select">
                    <option value="">Tous</option>
                    <option value="client">Client</option>
                    <option value="entreprise">Entreprise</option>
                  </select>
                </div>
              </div>
              <div class="col">
                <div class="mb-3">
                  <label for="tiers_filter_socialReason" class="form-label">Raison sociale</label>
                  <input type="text" id="tiers_filter_socialReason" name="tiers_filter[socialReason]" placeholder="Raison sociale" class="form-control">
                </div>
              </div>
            </div>
          </div>
          <div class="card-footer">
            <div class="d-flex">
              <button type="submit" id="tiers_filter_reset" name="tiers_filter[reset]" class="btn btn-warning reset-cookie-form-action btn">
                <i class="fas fa-eraser me-1"></i>Effacer filtre </button>
              <button type="submit" id="tiers_filter_filter_data" name="tiers_filter[filter_data]" class="btn btn-primary ms-auto btn">
                <i class="fas fa-search me-1"></i>Filtrer </button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

from tablerbundle.

@kevinpapst new version of Cards from Tabler.io is here : https://preview.tabler.io/card-actions.html

There's now an .card-actions class to allow buttons and other.

ATE, we should implement accordions and new cards

from tablerbundle.

The class card-actions is already in use in the card embed.
I updated to the latest beta release and there were no changes showing.
Maybe you can double check.
Yes to the accordion! I'd like to have that as well, then we can remove the collapsible button from the card.

from tablerbundle.