Options
All
  • Public
  • Public/Protected
  • All
Menu

Interface IBorderWidthSides

The interface for the border widths. Provides style mixins that can be used to apply border width styles to components.

example
Using the mixins ```ts import { ViewStyle } from 'react-native'; import { Constants, BorderWidthSides } from '@ef-carbon/react-native-style'; const constants = new Constants(); // BorderWidthSides implements IBorderWidthSides const width = new BorderWidthSides({ width: constants.border.width }); const style: ViewStyle = { ...width.top.normal, ...width.left.larger, ...width.right.smaller, ...width.bottom.small, } ```
example
Mixins on the theme ```ts import { ViewStyle } from 'react-native'; import { Theme } from '@ef-carbon/react-native-style'; const theme = new Theme(); const style: ViewStyle = { ...theme.border.width.top.normal, ...theme.border.width.left.larger, ...theme.border.width.right.smaller, ...theme.border.width.bottom.small, } ```

Hierarchy

  • ILengthSides<IAll, ITop, ILeft, IRight, IBottom>
    • IBorderWidthSides

Implemented by

Index

Properties

Properties

bottom

bottom: ILength<IBottom>

The bottom spacing

huge

huge: IAll

Usually accesses division 900

large

large: IAll

Usually accesses division 600

larger

larger: IAll

Usually accesses division 700

largest

largest: IAll

Usually accesses division 800

left

left: ILength<ILeft>

The left spacing

normal

normal: IAll

Usually accesses division 500

right

right: ILength<IRight>

The right spacing

small

small: IAll

Usually accesses division 400

smaller

smaller: IAll

Usually accesses division 300

smallest

smallest: IAll

Usually accesses division 200

tiny

tiny: IAll

Usually accesses division 100

top

top: ILength<ITop>

The top spacing