Inline
The inline component is used to style inline content such as text.
To add the Inline
component to your app:
import {Inline} from '@stripe/ui-extension-sdk/ui';
Inline components are styleable inline elements, equivalent to a span
in HTML. They support custom styles. If you’d like to render or style block-level elements, see the Box component.
<Inline css={{ font: 'body', fontWeight: 'semibold', color: 'success', marginY: 'large', }} > This is an example of the inline component. </Inline>
Emphasized text
<Inline css={{font: 'body', color: 'primary', fontWeight: 'semibold'}}> This text is emphasized </Inline>
Secondary text
<Inline css={{font: 'caption', color: 'secondary'}}> This text is styled using the caption text style and the secondary color. </Inline>