Add support for customizing FAB dimensions

[patrickrodee]

With the new shape system for FAB, the radius that used to be applied as a percentage is now converted to a pixel value.

When the height of a FAB grows to something larger than the default, the pixel border radius no longer represents a proper circle and looks wrong.

Potential fixes

• add the ability to specify height and width in the mdc-fab-shape-radius mixin
• don't convert 50% border radius to a pixel value and just leave it as 50%

[abhiomkar]

Using pixel value is intentional the shape mixin calculates the corner size on compile time assuming the height of FAB doesn't change on run time.

If you use $mdc-fab-height variable to override the dimensions of FAB I guess the shape mixin for FAB works as expected.

[kfranqueiro]

The specs are pretty prescriptive about the size of the FAB, and this is the first I've heard of its size needing to be customizable - so I'm not sure whether it's actually intended to be.

If we do need to explicitly support customizing it, we need to think about a few things:

• Do we create separate width and height mixins and just let users do whatever, or do we try to enforce that the width and height match for non-extended FABs?
• If we try to enforce that the width and height match, how do we support customizing extended FAB height?
• If we need to support this, we also need to parameterize height in the FAB shape mixin, and users must remember to pass it there as well.

On the other hand, for this particular issue, it might be feasible to somehow add a flag to the shape API to not convert percentages to absolute values, to avoid this issue for regular FABs. That wouldn't solve the problem for extended FABs though; they need a specific height value in order to set border-radius correctly.

[kfranqueiro]

We just discussed this with design, and the design of the FAB does not allow for custom width/height.

That being said, if we need to smooth this over, we should probably do so in a way that doesn't add complexity to public APIs. Perhaps we can implement an optional flag within the shape system to avoid converting percent to px for regular/mini FABs.

[abhiomkar]

We might not need an opt-in flag in Shape System.

mdc-fab can expose two separate shape-radius mixins one for (regular + mini), another for (extended-fab). Where the former mixin doesn't resolve the percentage value.

Here is the prototype branch:
fab-radius-perc

[kfranqueiro]

Oh good point. I forgot that the percentage resolution was happening within each component and was thinking it was the other way around, which led to the flag suggestion.