This repository was archived by the owner on Sep 5, 2024. It is now read-only.
fix(chips): update to latest Material Design spec (2017) updates #11989
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
googlebot
added
the
cla: yes
Splaktar
added
P3: important
wagnermaciel
approved these changes
Jul 31, 2020
- use the `md-cancel` button instead of the `md-close` button - `$chip-font-size` reduced to `13px` from `16px` - `$chip-remove-padding-right` increased to `28px` from `22px` - in light mode, remove chip icon should be black w/ 87% opacity - update custom remove chip template demo - show remove icon on hover/focus only - remove unnecessary CSS - update to new size guidelines and remove color on hover/focus - fix remove chip icon color when chip is focused Fixes #9883 BREAKING CHANGE: Chips have been updated to latest Material Design spec (2017). `$chip-font-size` was reduced to `13px` from `16px`. `$chip-remove-padding-right` was increased to `28px` from `22px`. These changes may cause your chips to have a smaller, denser layout now. In certain scenarios, this may require minor changes to your app's layout. You can change these variables back to their old values if your app consumes Sass. Additionally, the remove chip icon has been changed, but you can use the custom chip template demo as a guide to changing back to the old icon, if desired.
Splaktar
force-pushed
the
chips-spec-update
branch
from
f3d0489 to
ece21ca
Compare
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
PR Checklist
Please check that your PR fulfills the following requirements:
PR Type
What kind of change does this PR introduce?
What is the current behavior?
See the issue for some of the ways that
md-chipsis out of date with the latest version of the 2017 MD chips spec.Issue Number:
Fixes #9883
What is the new behavior?
md-cancelbutton instead of themd-closebutton$chip-font-sizereduced to13pxfrom16px$chip-remove-padding-rightincreased to28pxfrom22pxDoes this PR introduce a breaking change?
BREAKING CHANGE: Chips have been updated to latest Material Design spec (2017).
$chip-font-sizewas reduced to13pxfrom16px.$chip-remove-padding-rightwas increased to28pxfrom22px. These changes may cause your chips to have a smaller, denser layout now. In certain scenarios, this may require minor changes to your app's layout. You can change these variables back to their old values if your app consumes Sass. Additionally, the remove chip icon has been changed, but you can use the custom chip template demo as a guide to changing back to the old icon, if desired.Other information
Before
After