Repository navigation
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
github-actions
Bot
added
package: core
… dynamic height test
thetaPC
requested changes
Nov 12, 2026
This branch was successfully deployed
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Issue number: resolves #20177
What is the current behavior?
Currently, the fab button always rotates and scales between its content and the close icon when a fab list opens. That transition lives in the shadow DOM, so there's no way to turn it off, and it ignores both the global
animated: falseconfig andprefers-reduced-motion.What is the new behavior?
animatedprop toion-fab-button. When it'sfalse, or the globalanimatedconfig isfalse, the button doesn't transition at all.prefers-reduced-motion: reduce, the content and close icon crossfade instead of rotating and scaling, and the iOS press no longer scales the button. This follows the reduced motion rule in the animations and gestures design doc, which is to remove movement and scaling but keep short opacity changes.Does this introduce a breaking change?
But it is a new feature, which is why it's pointed at
feature-9.1Other information
The prop only affects the button it's set on, so buttons inside an
ion-fab-listneed it too. The md ripple still plays withanimated="false"because it comes fromion-ripple-effectrather than the button's transitions, but the globalanimated: falseconfig already turns it off.To check reduced motion, turn on "Emulate CSS media feature prefers-reduced-motion" in the DevTools Rendering panel.
Current dev build:
Animation test page (MD)
Animation test page (iOS)
Animation test page with
animated: falseconfigDocs
Related docs PR