Table of Contents | ||||
---|---|---|---|---|
|
...
the page subject is identified in the header area.
a list of available parameters for the main content are available on the left.
the main content is shown in the central workspace.
additional details on selected elements within the main content are displayed on the right.
Spacing
In order to provide visual and implementation consistency, an eight-point soft grid should be used for the spacing, sizing, and hierarchy of elements. This means that the spacing between items, padding, and margins should all be made up of multiples of eight: 8 px, 16 px, 24 px etc.
...
A division of 4 px is allowed for very small areas, but should be avoided where possible.
Some LUX objects have their own defined sizes, such as button widths and table row heights. These should not be resized to the 8 pt grid.
Where objects do not have a defined size they should adhere to the 8 pt grid,for consistency.
Margins
Pages will have margins of:
32px on both the left and right.
24px beneath the VerinTop and at the bottom.
Popups will have the following margins, which exclude the border:
40px on both the left and right.
24px in the header and footer.
Spacing examples
Full page layout | Popup and Popover | Text and lists |
---|---|---|
Structure
Layouts consist of:
...