Skip to content

Enhance the usability and responsiveness of HTML tables on an accessible way.

License

Notifications You must be signed in to change notification settings

backdrop-contrib/tabled

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Tabled

This module activates the Tabled plugin to attempt to transform data tables in your content to be more accessible.

Installation

Usage

  • Simply enable the module to activate the plugin. Activation will be attempted for all tables except those that have been given the class untabled, only on non-admin pages. Additional jQuery style selectors to exclude can be added at Administer > Configuration > User interface > Tabled (admin/config/user-interface/tabled).
  • If the table cannot be converted into Tabled format due to unmet requirements or faulty HTML code, it will be given the class tabled--stacked and displayed using "Stacked rows" mode on smaller widths.
  • Tabled uses some CSS custom properties / variables that can be overridden in your theme or custom CSS.
:root {
  // This is the width for most columns, adjust this value as needed.
  --tabled-column-min-width: 163px;
  // If the cell height surpasses the threshold, the width is changed to this
  // larger size. (using JS)
  --tabled-column-min-width-large: 300px;
  --tabled-column-min-width-small: 80px;

  --tabled-v-space-4xs: 1rem;
  --tabled-v-space-3xs: 1.5rem;
  --tabled-v-space-2xs: 2rem;
  --tabled-v-space-xs: 2.5rem;
  --tabled-v-space-s: 3rem;

  --tabled-color-white: #ffffff;
  --tabled-color-black: #000000;
  --tabled-color-50: #f6f8f9;
  --tabled-color-150: #dde4e9;
  --tabled-color-500: #3f6076;
  --tabled-color-600: #19405b;
  --tabled-color-700: #15354c;
  --tabled-color-ascent: #e0a624;
  --tabled-color-focus: #3d8eff;
  --tabled-color-disabled: #a1a1a1;
  --tabled-color-border: var(--tabled-color-700);
}

Issues

Bugs, UI-config requests and other feature requests should be reported in the Issue Queue

Current Maintainers

Credits

License

This project is GPL v2 software. See the LICENSE.txt file in this directory for complete text.