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

Files

Brandy Carney e5c8c10029 fix(components): include mode classes on components for use in shadow (#17838 )

- removes mode-less component classes from the internal CSS, use element instead
- adds mode specific classes `md` or `ios` for styling inside of shadow components
- adds e2e test that verifies mode classes exist on all ionic components, plus checks for specific classes that the components need for internal styling

fixes #17608

2019-04-16 17:28:21 -04:00

item-option.ios.scss

fix(all): safe margins for fab, item-header, tabbar

2018-09-26 20:56:09 +02:00

item-option.ios.vars.scss

refactor(components): update to use shadow DOM and work with css variables

2018-07-09 12:57:21 -04:00

item-option.md.scss

fix(sliding): fix core gesture logic + priority configuration

2018-08-07 17:14:04 +02:00

item-option.md.vars.scss

refactor(components): update to use shadow DOM and work with css variables

2018-07-09 12:57:21 -04:00

item-option.scss

fix(item-option): styling and behaviour for disabled item-option (#17909 )

2019-03-28 14:20:29 -04:00

item-option.tsx

fix(components): include mode classes on components for use in shadow (#17838 )

2019-04-16 17:28:21 -04:00

item-option.vars.scss

chore(packages): move the packages to root

2018-03-12 16:02:25 -04:00

readme.md

docs(): Add documentation for slots (#17441 )

2019-02-12 15:51:01 -05:00

readme.md

ion-item-option

The option button for an ion-item-sliding. Must be placed inside of an <ion-item-options>. You can combine the ionSwipe event and the expandable directive to create a full swipe action for the item.

Properties

Property	Attribute	Description	Type	Default
`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 item option.	`boolean`	`false`
`expandable`	`expandable`	If `true`, the option will expand to take up the available width and cover any other options.	`boolean`	`false`
`href`	`href`	Contains a URL or a URL fragment that the hyperlink points to. If this property is set, an anchor tag will be rendered.	`string \| undefined`	`undefined`
`mode`	`mode`	The mode determines which platform styles to use.	`"ios" \| "md"`	`undefined`

Slots

Slot	Description
	Content is placed between the named slots if provided without a slot.
`"bottom"`	Content is placed below the option text.
`"end"`	Content is placed to the right of the option text in LTR, and to the left in RTL.
`"icon-only"`	Should be used on an icon in an option that has no text.
`"start"`	Content is placed to the left of the option text in LTR, and to the right in RTL.
`"top"`	Content is placed above the option text.

CSS Custom Properties

Name	Description
`--background`	Background of the item option
`--color`	Color of the item option

Built with StencilJS