ionic-framework

mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00

Files

Adam Bradley 69e10de718 refactor(ionicons): update to ionicons v5 (#19670 )

* refactor(ionicons): update to ionicons v5

* refactor(back-button): update back button icon to v5 ionicons

* refactor(item): update default detail icon to chevron-forward

* refactor(reorder): update reorder icon for ionicons v5

* refactor(searchbar): use search-sharp

* refactor(searchIcon): update v5 ionicon

* refactor(clearIcon): update searchbar clear icon

* refactor(cancelButton): update to arrow-back-sharp

* refactor(menuIcon): update to v5 ionicons

* api readme updates

* update react and vue ionicons

* add ionicons to react deps

* add ionicons to ionic/vue deps

* add icon to react test

* updates

* fix back button regression for no icon

* update tests

* fix more tests

* fix more icons

* update ionicons version

* fix circle icons

* add correct ellipsis

2019-11-20 09:53:32 -05:00

test

fix(menu-button): hide menu button when auto hide or split pane (#18702 )

2019-07-03 11:51:30 -04:00

menu-button.ios.scss

fix(menu-button): move font-size to host for easier customization (#18699 )

2019-07-02 15:37:16 -04:00

menu-button.md.scss

fix(menu-button): move font-size to host for easier customization (#18699 )

2019-07-02 15:37:16 -04:00

menu-button.scss

fix(menu-button): hide menu button when auto hide or split pane (#18702 )

2019-07-03 11:51:30 -04:00

menu-button.tsx

refactor(ionicons): update to ionicons v5 (#19670 )

2019-11-20 09:53:32 -05:00

readme.md

fix(menu-button): hide menu button when auto hide or split pane (#18702 )

2019-07-03 11:51:30 -04:00

readme.md

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`
`disabled`	`disabled`	If `true`, the user cannot interact with the menu button.	`boolean`	`false`
`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`
`type`	`type`	The type of the button.	`"button" \| "reset" \| "submit"`	`'button'`

CSS Custom Properties

Name	Description
`--background`	Background of the menu button
`--background-focused`	Background of the menu button when focused with the tab key
`--background-hover`	Background of the menu button on hover
`--border-radius`	Border radius of the menu button
`--color`	Color of the menu button
`--color-focused`	Color of the menu button when focused with the tab key
`--color-hover`	Color of the menu button on hover
`--padding-bottom`	Bottom padding of the button
`--padding-end`	Right padding if direction is left-to-right, and left padding if direction is right-to-left of the button
`--padding-start`	Left padding if direction is left-to-right, and right padding if direction is right-to-left of the button
`--padding-top`	Top padding of the button

Dependencies

Depends on

ion-icon
ion-ripple-effect

Graph

graph TD;
  ion-menu-button --> ion-icon
  ion-menu-button --> ion-ripple-effect
  style ion-menu-button fill:#f9f,stroke:#333,stroke-width:4px

Built with StencilJS