-
Notifications
You must be signed in to change notification settings - Fork 0
Entity Table
I added col and colgroup to the prototype (see: https://github.com/ucla/WebBlocks/commit/0169d1ea67284117e1f7a383b19c3338f0444b16). I was planning on also adding colspan, rowspan, headers, and scope attributes, although I think those will have less impact on the framework (but I thought I would research just in case as adding col had an impact I did not expect at first).
Consider condensed, my thought is that rather than just extending Bootstrap's table-condensed, we actually go a step further and add a width:auto. This won't affect the fact that max-width:100% to prevent overflow in fluid layout, but it will actually tighten the table up completely, whereas table-condensed still spreads the table to 100% scale, which doesn't seem "condensed" to me but rather just "unstyled".
It's confirmed that it's no longer required for tfoot to appear before tbody:
http://stackoverflow.com/questions/5574057/why-do-internal-table-sections-have-to-go-thead-tfoot-tbody-to-validate
Since there is no standard (and ostensibly support for both methods), I think browser testing would be the next step to confirm which implementation is more widely supported.
Alright, here we go:
Twitter Bootstrap includes a "condensed" CSS class (http://twitter.github.com/bootstrap/base-css.html#tables) to strip padding and margins from the table. This feels a little odd/arbitrary to me: it seems like something that would be better left to the individual developer/designer using Web Blocks, but if it's useful then, hell, why not include it?
(I'm leaning towards including it)
I've always been under the impression that tfoot (if included) comes directly after thead in a table, creating the following order:
tabletheadtfoottbody
The W3C HTML4 standard requires this (http://www.w3.org/wiki/HTML/Elements/tfoot and http://www.w3.org/TR/html4/struct/tables.html#edef-TFOOT), but the WHATWG examples do not follow this convention (so I'm wondering if this requirement has been stripped in HTML5?): http://www.whatwg.org/specs/web-apps/current-work/multipage/tabular-data.html#examples-0
We all knew we would have to face this eventually. There's no great solution here, but we should continue researching and see if we can come up with an optimal solution:
- http://filamentgroup.com/examples/rwd-table-patterns/
- http://css-tricks.com/responsive-data-table-roundup/
- http://css-tricks.com/examples/ResponsiveTables/responsive.php
- http://www.zurb.com/playground/playground/responsive-tables/index.html
Related to the responsive issue above, I was working on a Bootstrap project recently where it would have been useful to have scrollable tables with fixed headers out of the box (http://www.imaputz.com/cssStuff/bigFourVersion.html). This could potentially shorten a lot of tables to work better on smaller viewport designs (although I'm wondering now if paging would be more appropriate given scrolling issues).
Not sure if this is something better left to a Web Blocks plug-in.
These should be added to the prototype.