Questa pagina non è disponibile nella lingua desiderata. Lingue disponibili:
The component represents an action element contained by the sbb-menu component.
Slots
It is possible to provide a label via an unnamed slot; the component can optionally display a sbb-icon
at the component start using the iconName property or via custom content using the icon slot.
<sbb-menu-action>Text</sbb-menu-action>
<sbb-menu-action icon-name="pie-small">Another text</sbb-menu-action>An amount can be rendered at the end of the action element as white text in a red circle via the amount property.
<sbb-menu-action amount="123">Amount text</sbb-menu-action>Link / button properties
As the sbb-link and the sbb-button,
the component can be internally rendered as a button or as a link,
depending on the value of the href property, so the associated properties are available
(href, target, rel and download for link; type, name, value and form for button).
<sbb-menu-action href="#info" target="_blank">Link</sbb-menu-action>
<sbb-menu-action type="button" value="menu" name="menu">Button</sbb-menu-action>Style
For cases where smaller outer paddings are needed,
you can set the css variable --sbb-menu-action-outer-horizontal-padding to your desired outer padding.
Properties
| Name | Attribute | Privacy | Type | Default | Description |
|---|---|---|---|---|---|
iconName | icon-name | public | string | undefined | undefined | The name of the icon, choose from the small icon variants from the ui-icons category from here https://icons.app.sbb.ch. | |
amount | amount | public | string | undefined | undefined | Value shown as badge at component end. | |
href | href | public | string | undefined | The href value you want to link to (if it is not present menu action becomes a button). | |
target | target | public | LinkTargetType | string | undefined | undefined | Where to display the linked URL. | |
rel | rel | public | string | undefined | undefined | The relationship of the linked URL as space-separated link types. | |
download | download | public | boolean | undefined | Whether the browser will show the download dialog on click. | |
type | type | public | ButtonType | undefined | The type attribute to use for the button. | |
disabled | disabled | public | boolean | false | Whether the button is disabled. |
name | name | public | string | undefined | The name attribute to use for the button. | |
value | value | public | string | undefined | The value attribute to use for the button. | |
form | form | public | string | undefined | The |
Slots
| Name | Description |
|---|---|
Use the unnamed slot to add content to the sbb-menu-action. | |
icon | Use this slot to provide an icon. If icon-name is set, a sbb-icon will be used. |