Table layout utilities classes also apply to descendant elements; add table layout example docs #5070
Conversation
Demo
Jenkins 
demos.haus 
|
@lyubomir-popov Suggested that this change may be scoped a bit too large. Allowing the css to apply to all tables descended from the utility class element, as Bartek suggested in the Jira card, may be a bit too wide-reaching as this would allow, for example, applying the utility class at the Perhaps we should revise this to only apply to direct child elements, like so: @if ($table-layout-fixed) {
.u-table-layout--auto {
&,
& > table {
table-layout: auto !important;
}
}
} @else {
.u-table-layout--fixed {
&,
& > table {
table-layout: fixed !important;
}
}
}Will review this with @bartaz upon his return from vacation. |
templates/docs/examples/utilities/table-layout/table-layout-default.html
Outdated
Show resolved
Hide resolved
…y classes regardless of app settings
| @@ -0,0 +1,4 @@ | |||
| @import '../vanilla'; | |||
There was a problem hiding this comment.
We only use standalone styles for base and components. Utitilies are not featured at all on standalone examples page (https://vanillaframework.io/docs/examples/standalone), as they are kind of independent by nature.
So this file, and references to it in example templates can be removed.
There was a problem hiding this comment.
Removed file & references to it
|
|
||
| - If `$table-layout-fixed` is set to `true` (the default), you can use `u-table-layout--auto` to override it. | ||
| - if `$table-layout-fixed` is set to `auto` it adds a utility called `u-table-layout--fixed`. | ||
| - `u-table-layout--auto` sets a table and its descendant tables to `table-layout: auto`. |
There was a problem hiding this comment.
We don't want people to nest tables, so "its descendant tables" may be a bit misleading, so we should say that this utility sets "the table or any descendant tables of the element it's put on" to auto layout.
There was a problem hiding this comment.
Updated documentation language accordingly
bartaz
added
Review: QA +1
Review: Code -1
and removed
Review: QA needed
Review: Code needed
labels
Done
u-table-layout--autoandu-table-layout--fixedutility classes to apply to nested / descendedtableelements as well as elements with those classes directly applied.$table-layout-fixed: trueand no utility class applied directly to a table)$table-layout-fixed: trueandu-table-layout--autoapplied directly to a table)$table-layout-fixed: trueandu-table-layout--autoapplied to an ancestor element of a tableFixes #2374 , WD-10925
QA
table-layout: autoapplied.Check if PR is ready for release
If this PR contains Vanilla SCSS code changes, it should contain the following changes to make sure it's ready for the release:
Feature 🎁,Breaking Change 💣,Bug 🐛,Documentation 📝,Maintenance 🔨.package.jsonshould be updated relative to the most recent release, following semver convention:Screenshots