8000 Chore table padding by mattnolting · Pull Request #6294 · patternfly/patternfly · GitHub
[go: up one dir, main page]

Skip to content

Chore table padding#6294

Merged
mcoker merged 1 commit intopatternfly:v6from
mattnolting:chore-table-padding
Feb 20, 2024
Merged

Chore table padding#6294
mcoker merged 1 commit intopatternfly:v6from
mattnolting:chore-table-padding

Conversation

@mattnolting
Copy link
Collaborator
@mattnolting mattnolting commented Feb 8, 2024

relates to #5728

This PR updates padding, margin, and fitting of table elements.

Preview: https://patternfly-pr-6294.surge.sh/components/table

@mattnolting mattnolting force-pushed the chore-table-padding branch 2 times, most recently from 6f0f95d to 8f944ef Compare February 8, 2024 21:04
@patternfly-build
Copy link
Collaborator
patternfly-build commented Feb 8, 2024

@mattnolting mattnolting force-pushed the chore-table-padding branch 10 times, most recently from 1463bfb to 7602350 Compare February 16, 2024 19:02
@mattnolting mattnolting marked this pull request as ready for review February 16, 2024 19:03
@mattnolting mattnolting marked this pull request as draft February 17, 2024 14:20
@mattnolting mattnolting marked this pull request as ready for review February 19, 2024 16:51
Copy link
Contributor
@mcoker mcoker left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Left some comments as I was looking at the code but nothing that needs action, feel free to address later if you think any of the comments are relevant.

padding-block-end: var(--#{$table}__button--PaddingBottom);
padding-inline-start: var(--#{$table}__button--PaddingLeft);
padding-inline-end: var(--#{$table}__button--PaddingRight);
margin-inline-start: calc(var(--#{$table}__button--PaddingLeft) * -1);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Bold strategy, but let's see how it plays out! ☄️

Comment on lines +933 to +939
thead & {
vertical-align: bottom;
}

tbody & {
vertical-align: top;
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

just a thought, but you could probably add vertical-align: top as the base style under the display declaration and just change that in thead?

--#{$check}__input--TranslateY: var(--#{$table}__thead__check--input--TranslateY);
// TODO: remove label wrapper at breaking change
label {
display: contents;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I wonder if this will cause an a11y issue since last I read, display: contents still isn't a great thing for elements with semantic value specifically around remaining in the a11y tree properly.

margin-inline-start: var(--#{$table}__favorite--c-button--MarginLeft);
margin-inline-end: var(--#{$table}__favorite--c-button--MarginRight);

@at-root .pf-m-favorited#{&} {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

just a nit but since this isn't nested, I think you could just write it normally?

Suggested change
@at-root .pf-m-favorited#{&} {
&.pf-m-favorited {

Comment on lines +1151 to +1152
> td,
> th {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do we need to add the class selector here?

Comment on lines +1301 to 1304
@import 'themes/dark/table';

@include pf-v5-theme-dark {
@include pf-v5-theme-dark-table;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

you can take these out of all the stylesheets. maybe that's part of some future work?

@mcoker mcoker merged commit 1f1f44e into patternfly:v6 Feb 20, 2024
@patternfly-build
Copy link
Collaborator

🎉 This PR is included in version 6.0.0-alpha.89 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

0