Styling: Scale

Oracle® JavaScript Extension Toolkit (JET)
16.1.0
F92237-01

Description

Applications serve different needs and have different scale requirements, classes have been added to support the following scales:

  • Default, no class needed - Large (Consumer) - This is the default and preferred scale for Redwood applications. It is designed for lower density pages to embrace simplicity, openness, readability, and human scale.
  • oj-scale-md - Medium (Pro-sumer) - more compact proportions. Designed to increase efficiency by allowing more data to be shown above the fold.
  • oj-scale-sm - Small (Pro Tools) - highly compact proportions. Designed for canvas style tools with a high level of information and UI density. Small is not touch friendly and should therefore only be used on desktop applications.

These classes must be put on the html element. The entire page must be one of these scales – specifying different scales on a single page is not supported.


Category: Scale

Note: This category of style classes is not supported in the following themes: Alta,Stable

Sets the Scale.

Class template:

.oj-scale-[scale-size]

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

Values for [scale-size]

Value (required) Name Description
sm Small Small Scale
md Medium Medium Scale

Example
<html  class="oj-scale-md">
   <!-- content -->
</html>