Styling: AppShellHybridMobilePadding

Oracle® JavaScript Extension Toolkit (JET)
17.1.0
G12196-01

Description

The hybrid mobile page structure does not have any inherent padding since some components need to stretch to the edge of the screen. We instead provide a set of oj-hybrid-padding classes that allow developers to easily control and ensure the consistency of the padding throughout their application.


.oj-hybrid-padding
Place on an element to add padding to all sides.
Example
<div class="oj-hybrid-padding oj-hybrid-applayout-content">
</div>

Category: Hybrid Mobile App Padding Specified Edges

Place on an element to add padding with different edges.

Class template:

.oj-hybrid-padding-[edge]

Note: Square brackets signify required token substitutions whereas parentheses signify optional token substitutions.

Values for [edge]

Value (required) Name Description
start Start Applies to start edge (left edge in ltr mode, right edge in rtl mode)
end End Applies to end edge (right edge in ltr mode, left edge in rtl mode)
top Top Applies to top edge
bottom Bottom Applies to bottom edge
horizontal Horizontal Applies to start and end edges
vertical Vertical Applies to top and and bottom edges

Example
<div class="oj-hybrid-padding-vertical oj-hybrid-applayout-content">
</div>