Skip to content

feat(description-list): added description list component - #3243

Merged
mcoker merged 7 commits into
patternfly:masterfrom
mattnolting:feat-description-list
Jul 9, 2020
Merged

mcoker merged 7 commits into
patternfly:masterfrom
mattnolting:feat-description-list

Conversation

@mattnolting

Copy link
Copy Markdown
Collaborator

closes #1919

@patternfly-build

patternfly-build commented Jul 2, 2020 •

Copy link
Copy Markdown
Collaborator

Preview: https://patternfly-pr-3243.surge.sh

A11y report: https://patternfly-pr-3243-coverage.surge.sh

CSS Size Report
NameCurrentPreviousDiff %
components/DescriptionList/description-list-order.css6.4 kBNaN kBNaN
components/DescriptionList/description-list.css5.3 kBNaN kBNaN
patternfly.min.css653.0 kB648.1 kB0.75
patternfly-no-reset.css739.6 kB734.3 kB0.72
patternfly.css741.5 kB736.2 kB0.72

@mattnolting mattnolting changed the title WIP feat: added description list component feat: added description list component Jul 9, 2020
@mattnolting mattnolting changed the title feat: added description list component feat(description-list): added description list component Jul 9, 2020
Comment thread src/patternfly/components/DescriptionList/examples/DescriptionList.md Outdated
Comment thread src/patternfly/components/DescriptionList/examples/DescriptionList.md Outdated
@christiemolloy

Copy link
Copy Markdown
Member

example is going outside of the container
Screen Shot 2020-07-09 at 4 47 04 PM

@mcarrano

mcarrano commented Jul 9, 2020

Copy link
Copy Markdown
Member

This looks great @mattnolting . The only thing I'd say is that for the horizontal list, it gets pretty ugly when you get above 2 columns so not sure whether we should show those examples or not. Up to you.

@christiemolloy

Copy link
Copy Markdown
Member

I don't really understand how this inline grid is working?

Screen Shot 2020-07-09 at 4 49 23 PM

Comment thread src/patternfly/components/DescriptionList/description-list.scss Outdated
Comment thread src/patternfly/components/DescriptionList/description-list.scss Outdated
Comment thread src/patternfly/components/DescriptionList/description-list.scss Outdated
@mattnolting

Copy link
Copy Markdown
Collaborator Author

I don't really understand how this inline grid is working?

Screen Shot 2020-07-09 at 4 49 23 PM

It doesn't limit 100% width. Because the columns are fr units, they consume available space.

@mcoker mcoker Jul 9, 2020 •

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Is it necessary to set this? also the var is --pf-global--FontWeight--normal. If it looks OK now with the declaration broken because of the var name maybe it's safe to remove?

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

do you want to use a ch unit here?

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

ch here too?

@mattnolting

Copy link
Copy Markdown
Collaborator Author

@mcarrano

This looks great @mattnolting . The only thing I'd say is that for the horizontal list, it gets pretty ugly when you get above 2 columns so not sure whether we should show those examples or not. Up to you.

I updated the examples to use 3 and 4 column layouts at -lg and -xl breakpoints. That should look better.

@mcoker mcoker left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Fantastic!

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants