Module: styles
Table of contents
Variables
Variables
globalStyles
• Const
globalStyles: ReactElement
<any
, string
| JSXElementConstructor
<any
>>
Applies global CSS styles across the entire application using the Emotion Global component. This setup includes styles that disable user selection by default to enhance the UI/UX for elements where text selection is not necessary, while specifically enabling user selection for input fields and editable content.
Additionally, it defines CSS custom properties for handling safe area insets on modern devices with notches or rounded corners, and customizes the scrollbar appearance to blend seamlessly into the design, providing a tailored scrollbar for both light and dark modes.
Usage of globalStyles should be included at the root level of your application to ensure all components inherit these styles.
Defined in
node_modules/@captn/joy/dist/esm/styles/index.js:18