ConfirmDialog Theming
Theming documentation for ConfirmDialog component
Styled#
CSS Classes#
List of class names used in the styled mode.
| className | description |
|---|---|
| p-confirmdialog | Class name of the root element |
| p-confirmdialog-trigger-button | Class name of the trigger button element |
| p-confirmdialog-content | Class name of the content element |
| p-confirmdialog-header | Class name of the header element |
| p-confirmdialog-footer | Class name of the footer element |
| p-confirmdialog-title | Class name of the title element |
| p-confirmdialog-icon | Class name of the icon element |
| p-confirmdialog-message | Class name of the message element |
| p-confirmdialog-close-button | Class name of the close button element |
| p-confirmdialog-action-button | Class name of the action button element |
Design Tokens#
List of design tokens.
| token | CSS Variable | description |
|---|---|---|
| confirmdialog.icon.size | --p-confirmdialog-icon-size | Size of icon |
| confirmdialog.icon.color | --p-confirmdialog-icon-color | Color of icon |
| confirmdialog.content.gap | --p-confirmdialog-content-gap | Gap of content |
| confirmdialog.message.color | --p-confirmdialog-message-color | Color of message |
| confirmdialog.message.font.weight | --p-confirmdialog-message-font-weight | Font weight of message |
| confirmdialog.message.font.size | --p-confirmdialog-message-font-size | Font size of message |
Unstyled#
Theming is implemented with the pass through properties in unstyled mode.