Skip to content

fix(material/table): switch back to class-based styling for flex tables #22350

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Jul 12, 2021

Conversation

crisbeto
Copy link
Member

In an earlier PR we switched the flex-based table styles to target the tag names, rather than classes in order to support flex tables in MDC. The problem with targeting tag names is that it doesn't allow our styles to be applied to other elements within the table. E.g. in #22349 the user isn't able to target the "no data" row.

These changes switch back to targeting classes and add some styles to prevent the flex-specific styles from bleeding into the table-based ones.

Fixes #22349.

@crisbeto crisbeto added P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent merge: caretaker note Alert the caretaker performing the merge to check the PR for an out of normal action needed or note target: patch This PR is targeted for the next patch release labels Mar 26, 2021
@crisbeto crisbeto requested a review from andrewseguin as a code owner March 26, 2021 17:39
@google-cla google-cla bot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Mar 26, 2021
@crisbeto
Copy link
Member Author

crisbeto commented Mar 26, 2021

Caretaker note: these changes will increase the specificity of some selectors which can break people's style overrides. We should determine whether to move forward with the fix based on the amount of breakages in g3.

In an earlier PR we switched the flex-based table styles to target the tag names, rather than classes in order to support flex tables in MDC. The problem with targeting tag names is that it doesn't allow our styles to be applied to other elements within the table. E.g. in angular#22349 the user isn't able to target the "no data" row.

These changes switch back to targeting classes and add some styles to prevent the flex-specific styles from bleeding into the table-based ones.

Fixes angular#22349.
@crisbeto crisbeto force-pushed the 22349/table-styling branch from 5cb3860 to 18ba520 Compare March 26, 2021 19:32
@crisbeto crisbeto added the action: merge The PR is ready for merge by the caretaker label Mar 29, 2021
@wagnermaciel wagnermaciel merged commit c76a09e into angular:master Jul 12, 2021
wagnermaciel pushed a commit that referenced this pull request Jul 12, 2021
…es (#22350)

In an earlier PR we switched the flex-based table styles to target the tag names, rather than classes in order to support flex tables in MDC. The problem with targeting tag names is that it doesn't allow our styles to be applied to other elements within the table. E.g. in #22349 the user isn't able to target the "no data" row.

These changes switch back to targeting classes and add some styles to prevent the flex-specific styles from bleeding into the table-based ones.

Fixes #22349.

(cherry picked from commit c76a09e)
wagnermaciel added a commit that referenced this pull request Jul 12, 2021
wagnermaciel added a commit that referenced this pull request Jul 12, 2021
wagnermaciel added a commit to wagnermaciel/components that referenced this pull request Jul 16, 2021
wagnermaciel added a commit to wagnermaciel/components that referenced this pull request Jul 21, 2021
wagnermaciel added a commit that referenced this pull request Jul 21, 2021
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Aug 12, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
action: merge The PR is ready for merge by the caretaker cla: yes PR author has agreed to Google's Contributor License Agreement merge: caretaker note Alert the caretaker performing the merge to check the PR for an out of normal action needed or note P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent target: patch This PR is targeted for the next patch release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

bug(MatTable): *matNoDataRow not properly styling in flex mode
4 participants