-
Notifications
You must be signed in to change notification settings - Fork 17
Size
Mark Reeves edited this page Mar 21, 2018
·
4 revisions
The com.github.bordertech.wcomponents.Size
enum is used to enforce consistent spaces between (using Margin) and amongst (see Theme intra component spacing) components.
The Size
enum has the following settings:
-
ZERO
represents a zero space (which may be used to remove theme based or inbuilt margins, for example); -
SMALL
represents a small space; -
MEDIUM
represents a medium sized space; -
LARGE
represents a large space; and -
XL
represents a very large space.
The actual dimensions (and units) of these spaces is determined by the theme and may vary with viewport size.
In the default theme with responsive design enabled and with reduced spaces for narrow viewports enabled the sizes are as shown in the table below.
enum value | default size | small viewport size |
---|---|---|
ZERO |
0 | 0 |
SMALL |
0.25rem | 0.125rem |
MEDIUM |
0.5rem | 0.25rem |
LARGE |
1rem | 0.5rem |
XL |
1.5rem | 0.75rem |
To change these values use /src/main/sass/_theme-vars.scss
or override /src/main/sass/vars/_space.scss
NOTE though that if you do override /src/main/sass/vars/_space.scss
do not change $wc-gap-suffix-list
.