Styled#
ScrollArea CSS Classes#
List of class names used in the styled mode.
| className | description |
|---|---|
| p-scrollarea | Class name of the root element |
| p-scrollarea-viewport | Class name of the viewport element |
| p-scrollarea-scrollbar | Class name of the scrollbar element |
| p-scrollarea-thumb | Class name of the thumb element |
| p-scrollarea-corner | Class name of the corner element |
Design Tokens#
List of design tokens.
| token | CSS Variable | description |
|---|---|---|
| scrollpanel.transition.duration | --p-scrollpanel-transition-duration | Transition duration of root |
| scrollpanel.bar.size | --p-scrollpanel-bar-size | Size of bar |
| scrollpanel.bar.border.radius | --p-scrollpanel-bar-border-radius | Border radius of bar |
| scrollpanel.bar.focus.ring.width | --p-scrollpanel-bar-focus-ring-width | Focus ring width of bar |
| scrollpanel.bar.focus.ring.style | --p-scrollpanel-bar-focus-ring-style | Focus ring style of bar |
| scrollpanel.bar.focus.ring.color | --p-scrollpanel-bar-focus-ring-color | Focus ring color of bar |
| scrollpanel.bar.focus.ring.offset | --p-scrollpanel-bar-focus-ring-offset | Focus ring offset of bar |
| scrollpanel.bar.focus.ring.shadow | --p-scrollpanel-bar-focus-ring-shadow | Focus ring shadow of bar |
| scrollpanel.bar.background | --p-scrollpanel-bar-background | Background of bar |
Unstyled#
Theming is implemented with the pass through properties in unstyled mode.