Scrollables

Revola handles content overflow with different scrolling patterns and sticky positioning techniques that work across both drawer and dialog modes.

Native Scrollbar

A scrollable dialog using the browser's native scrollbar for familiar OS-native behavior.

npx shadcn@latest add https://revola.sameerjs.com/r/native-scrollbar.json

Custom Scrollbar

A scrollable dialog with custom styled scrollbar using ScrollArea for consistent cross-browser styling.

npx shadcn@latest add https://revola.sameerjs.com/r/custom-scrollbar.json

Sticky Header

A scrollable dialog with a sticky header that remains visible while content scrolls.

npx shadcn@latest add https://revola.sameerjs.com/r/sticky-header.json

Sticky Footer

A scrollable dialog with a sticky footer containing action buttons that stay accessible.

npx shadcn@latest add https://revola.sameerjs.com/r/sticky-footer.json

Terms & Conditions (Sticky Header & Footer)

A scrollable dialog demonstrating both sticky header and footer with scroll-based interaction.

npx shadcn@latest add https://revola.sameerjs.com/r/terms-and-conditions.json