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.

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

fix(fab): Separate mixins for regular FAB and Extended FAB #4082

Merged
merged 6 commits into from
Nov 14, 2018

Conversation

abhiomkar
Copy link
Contributor

BREAKING CHANGE: Fab now has 2 separate mixins - mdc-fab-shape-radius for regular & mini Fab variants & mdc-fab-extended-shape-radius for Extended FAB variant.

Before:

mdc-fab-shape-radius(50%) => border-radius: 28px;

After:

mdc-fab-shape-radius(50%) => border-radius: 50%;

Where, mdc-fab-shape-radius doesn't resolve percentage to absolute value.

  • mdc-fab-shape-radius sets rounded shape to regular & mini FAB.
  • mdc-fab-extended-shape-radiussets rounded shape to only Extended FAB.

Fixes #3989


@mixin mdc-fab-extended-shape-radius($radius, $rtl-reflexive: false) {
Copy link
Contributor

Choose a reason for hiding this comment

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

Is the &.mdc-fab--extended selector now redundant since this is only expected to be used within that context?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Makes sense.

Also, added not() selector for regular/mini fab variant so extended variant don't get extra styles.

<html lang="en">
<head>
<meta charset="utf-8">
<title>extended-padding FAB Mixin - MDC Web Screenshot Test</title>
Copy link
Contributor

Choose a reason for hiding this comment

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

Update titles in new screenshot test pages

Copy link
Contributor

@kfranqueiro kfranqueiro left a comment

Choose a reason for hiding this comment

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

@mdc-web-bot
Copy link
Collaborator

@abhiomkar abhiomkar merged commit 003e95f into master Nov 14, 2018
@abhiomkar abhiomkar deleted the fab-radius-perc branch November 14, 2018 16:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add support for customizing FAB dimensions
4 participants