Files
Brandy Carney fa87e35a05 fix(toolbar): update md toolbar button spacing and padding to match spec (#17537)
- Removes the padding from the main toolbar and individually style the components inside of it
- Adds a `has-icon-only` class to button, this is used to switch between `unbounded` and `bounded` ripples on buttons in a toolbar. If the button is clear and only has an icon, we use the unbounded "circular" ripple effect, otherwise still use the bounded one. This matches the MD spec, without making the other buttons look off.
- Using the class above, style the button differently to match the MD spec
- Updates the back button and menu button to use the proper size / icon size
- Removes the opacity on an activated back button, it should use the ripple for activated
- Moves the margin to the slots in a toolbar by grabbing the "first" and "last" slot and applying a class to them
- Makes the segment in a toolbar use the min height from the toolbar
- Updates the back button so that it matches the MD spec
- Updates the header box shadow to use the old v3 datauri 

fixes #16950 fixes #14444
2019-05-17 14:54:21 -04:00
..

ion-menu-button

Menu Button is component that automatically creates the icon and functionality to open a menu on a page.

Properties

Property Attribute Description Type Default
autoHide auto-hide Automatically hides the menu button when the corresponding menu is not active boolean true
color color The color to use from your application's color palette. Default options are: "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", and "dark". For more information on colors, see theming. string | undefined undefined
menu menu Optional property that maps to a Menu's menuId prop. Can also be start or end for the menu side. This is used to find the correct menu to toggle string | undefined undefined
mode mode The mode determines which platform styles to use. "ios" | "md" undefined

CSS Custom Properties

Name Description
--color Color of the menu button
--padding-bottom Padding bottom of the button
--padding-end Padding end of the button
--padding-start Padding start of the button
--padding-top Padding top of the button

Built with StencilJS