Toggle sidebar

Responsive table

Pentru a face un tabel responsive este nevoie de mici tweaks:
  1. flux:table class="collapsable-table" clasa pe flux:table
  2. Opțional, flux:table.columns class="mobile-table-header" pentru a afișa un header pentru mobil
  3. pe fiecare celulă din flux:table.rows trebuiesc setate dimensiunile și/sau ordinea, după cum urmează:
    • Pentru dimensiune: basis-* (docs). Se poate și cu w-* dar dacă se merge pe asta, adaugă prefix pentru responsive, e.g. max-md:w-12 + w-20 (pentru ecrane mari). E recomand să ai cel puțin o celulă fără lățime specificată.
    • Pentru reordonare, adaugă la fiecare flux:table.cell clasa order-[număr], unde număr este un ... număr. Recomand un increment de minim 5, e.g. order-[5], order-[10] etc. Când vrei să reordonezi o celulă, schimbi ordinea cu un număr între cele folosite (e.g. order-[6]).

Serviciu
Status
Buget
Agenție
Trafic
Conversii
Revenue
Detalii
aaa bbb ccc ddd eee fff ggg hhh xxxx
aaa bbb ccc ddd eee fff ggg hhh xxxx
aaa bbb ccc ddd eee fff ggg hhh xxxx
aaa bbb ccc ddd eee fff ggg hhh xxxx
aaa bbb ccc ddd eee fff ggg hhh xxxx