Skip to content
This repository has been archived by the owner on Sep 5, 2024. It is now read-only.

fix(list): dense lists cut off descenders of letters like gjqpy #11806

Merged
merged 1 commit into from
Mar 5, 2020

Conversation

Splaktar
Copy link
Member

PR Checklist

Please check that your PR fulfills the following requirements:

  • The commit message follows our guidelines
  • Tests for the changes have been added or this is not a bug fix / enhancement
  • Docs have been added, updated, or were not required

PR Type

What kind of change does this PR introduce?

[x] Bugfix
[ ] Enhancement
[ ] Documentation content changes
[ ] Code style update (formatting, local variables)
[ ] Refactoring (no functional changes, no api changes)
[ ] Build related changes
[ ] CI related changes
[ ] Infrastructure changes
[ ] Other... Please describe:

What is the current behavior?

  • dense lists cut off descenders of letters like gjqpy
  • The basic list demo doesn't layout properly and overlaps on mobile

Issue Number:
Fixes #8890

What is the new behavior?

  • dense lists do not cut off descenders of letters like gjqpy
  • dense list spacing better aligns with the Material Design Spec
  • update demo to include letters with descenders
  • The basic list demo lays out properly and does not overlap on mobile

Does this PR introduce a breaking change?

[ ] Yes
[x] No

However, for some apps there may be a very small spacing change within list items. The overall list item height should not change except for very long text content with the md-long-text class which will increase by 4px.

Other information

Before

Note the cut off descenders, especially on the gs.
Screen Shot 2019-09-30 at 12 30 08

After

Screen Shot 2019-09-30 at 12 27 58

Before

Note that 2 phone numbers are cut off at the bottom.
Screen Shot 2019-09-30 at 12 22 05

After

Screen Shot 2019-09-30 at 12 22 21

Before

Screen Shot 2019-09-30 at 12 24 12

After

Screen Shot 2019-09-30 at 12 23 33

update demo to include letters with descenders
fix demo layout on mobile

Fixes #8890
@Splaktar Splaktar added type: bug ui: CSS P2: required Issues that must be fixed. type: spec alignment For issues related to aligning with the Material Design Spec labels Sep 30, 2019
@Splaktar Splaktar added this to the 1.1.21 milestone Sep 30, 2019
@Splaktar Splaktar self-assigned this Sep 30, 2019
@googlebot googlebot added the cla: yes PR author has signed Google's CLA: https://opensource.google.com/docs/cla/ label Sep 30, 2019
@Splaktar Splaktar added the pr: merge ready This PR is ready for a caretaker to review label Sep 30, 2019
@Splaktar Splaktar modified the milestones: 1.1.21, 1.1.22 Oct 22, 2019
@Splaktar Splaktar requested a review from jelbourn March 4, 2020 19:24
Copy link
Member

@jelbourn jelbourn left a comment

Choose a reason for hiding this comment

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

LGTM

@Splaktar Splaktar merged commit 0ab73bd into master Mar 5, 2020
@Splaktar Splaktar deleted the list-cutoffSubtext branch March 5, 2020 23:52
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
cla: yes PR author has signed Google's CLA: https://opensource.google.com/docs/cla/ P2: required Issues that must be fixed. pr: merge ready This PR is ready for a caretaker to review type: bug type: spec alignment For issues related to aligning with the Material Design Spec ui: CSS
Projects
None yet
Development

Successfully merging this pull request may close these issues.

list: dense list cuts off some letters like 'g'
4 participants