Skip to content
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.

Sign up for GitHub

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

Jump to bottom

fix(item): update to match Material Design spec #16182

Merged
merged 17 commits into from
Nov 4, 2018
Merged

fix(item): update to match Material Design spec #16182

merged 17 commits into from
Nov 4, 2018

Conversation

brandyscarney
Copy link
Member

@brandyscarney brandyscarney commented Nov 1, 2018 •
edited
Loading

Updates the list items to closer match the Material Design spec:

Includes some of the following:

  • splits the item min height by mode (md is now 48px)
  • removes padding end from the slotted end components in favor of using 16px on the item
  • updates the icon color to lighter gray (rgb) and reduces slotted icon size
  • removes font size change from text wrapped labels (per spec)
  • adds styles for an .item-multi-line class which will align the slotted elements at the top this could possibly be wrapped up with text-wrap to handle both but since it's just css probably not as a property

fixes #14799

master list-item-design
master list-item-design

@brandyscarney
test(spec): add list spec test to include MD examples
8de2326
@brandyscarney
fix(item): update to match material design spec
9fda61f 
- splits the item min height by mode
- removes padding end from the slotted end components in favor of using 16px on the item
- updates the icon color to lighter gray (rgb)
- removes font size change from text wrapped labels

fixes #14799
@ionitron-bot ionitron-bot bot added the package: core @ionic/core package label Nov 1, 2018
brandyscarney and others added 15 commits November 1, 2018 13:23
@brandyscarney
test(list): update spec test to standalone
b64d65d
@brandyscarney
test(list): update icon slot
9951ae5
@brandyscarney
style(item): fix lint errors
788cf0a
@brandyscarney
Merge branch 'master' into list-item-design
26fcef1
@brandyscarney
fix(item-divider): update padding start
9809857
@brandyscarney
fix(item): use font-size in icon so it doesn't break large icons
795ae5d
@brandyscarney
fix(select): increase icon width so it isn't cut off
dd98823
@brandyscarney
Merge branch 'master' into list-item-design
e408c25
@brandyscarney
Merge branch 'master' into list-item-design
519c9b6
@brandyscarney
Merge branch 'master' into list-item-design
e6edd3d
@brandyscarney
Merge branch 'list-item-design' of https://github.com/ionic-team/ionic …
f77aad6 
…into list-item-design
@brandyscarney
style(sass): fix lint errors
3ff05b5
@brandyscarney
Merge branch 'master' into list-item-design
06e8cb4
@brandyscarney
Merge branch 'master' into list-item-design
b8c96ee
@brandyscarney
Merge branch 'master' into list-item-design
7fefc80
@brandyscarney brandyscarney merged commit e416c23 into master Nov 4, 2018
@brandyscarney brandyscarney deleted the list-item-design branch November 4, 2018 15:59
@simonhaenisch simonhaenisch mentioned this pull request Nov 22, 2018
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
package: core @ionic/core package
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

ion-item with icons spacing does not match Material Design guidelines (post shadow dom only)
1 participant
@brandyscarney