2.17.0A content container that delivers important messages to the user.
Banner component. Part of the Bolt “Components” CSS framework that powers the Bolt Design System.
npm install @bolt/components-banner
{% include "@bolt-components-banner/banner.twig" with {
content: "This is the banner content."
} only %}
Note: when assigning component props as HTML attributes on a web component, make sure to use kebab-case.
| Prop Name | Description | Type | Default Value | Option(s) |
|---|---|---|---|---|
|
|
A Drupal attributes object. Applies extra HTML attributes to the outer <bolt-menu> tag. |
object
| — |
|
|
|
Renders the content of the banner. While any element can be passed, only text and links are recommended because banner messages are supposed to be concise. |
any
| — |
|
|
|
Sets the status that the banner is trying to convey. |
string
|
information
|
|
|
|
Sets the text alignment of the content. |
string
|
center
|
|
|
|
Sets the width of the banner to take up 100% of the screen width. |
boolean
|
false
|
|