Understanding the Universal Theme

Universal Theme - 42 (Universal Theme) features a responsive design and enables developers to create web applications without extensive knowledge of HTML, CSS, or JavaScript.

Tip: To view more details and best practices when using the Universal Theme, run the Universal Theme Reference app. See Accessing the Universal Theme Reference App.

About the Universal Theme

The Universal Theme features a responsive design, versatile UI components, and can be easily customized.

Applications you create with the Create Application Wizard use the Universal Theme. Advantages of the Universal Theme include:

• Responsive Design - Designed to work just as well on small screen devices (such as smartphones and tablets) as it does on larger screen devices (including laptops and desktops). The UI components in Universal Theme work across varying screen resolutions while maintaining the same or similar functionality. In addition, Universal Theme takes full advantage of ultra high screen resolutions by utilizing vector graphics where possible, and relying upon CSS3 features for UI styling.

• Versatile User Interface - Provides all the components and building blocks necessary to build practically any type of business application user interface.

  Tip: To browse all of the components provided with Universal Theme, run the Universal Theme Reference app. From the Main Navigation menu, select Components.

• Easy Customization - Effortlessly customize and fully control the look and feel of your applications without becoming an expert in UI design, HTML, CSS, or JavaScript. Using Theme Roller and Template Options, you can easily customize your application to fit your company’s brand and customize the look and feel of various components using Template Options.

• Support for Theme Styles - The Universal Theme includes support for theme styles. A theme style is a CSS style sheet that is added to the base CSS. Developers can change the appearance of an application by altering the theme style using the Theme Roller utility.

About Responsive Design

The Universal Theme is an example of a responsive user interface theme.

Responsive design enables you to design web pages so that the layout fits the available space regardless of the device on which page displays (for example, a desktop computer, laptop computer, tablet, or smartphone).

By implementing a responsive design, the user gets the same full experience as they would on larger screens. On smartphones and tablets, the layout adjusts to the size of the specific device. During this resizing process, elements shift position, re-size, or become hidden. The goal of responsive design is to present all essential content in a user friendly way for all possible screen sizes. Keep in mind, that responsive design is not just a matter of picking the correct set of templates. As the application developer, you are responsible for using the templates and the available components to design a page that is truly responsive.

See Also:

• Accessing the Universal Theme Reference App

• Understanding Template Options

• Using Theme Styles

About Updating or Migrating to the Universal Theme

Update or migrate existing apps to the newest Universal Theme to take advantage of new features and updates.

Compared to themes in previous releases of Oracle APEX, the Universal Template features cleaner templates, improved grid support, and responsive behavior.

Universal Theme migration paths include:

• Refresh the Universal Theme - If your app already uses the Universal Theme, you can easily update it to take advantages of new features and enhancements.

• Migrate from Other Themes - Update your application to use the latest version of Universal Theme and keep current with the latest features, enhancements and bug fixes. See Also: Migration Guide page in the Universal Theme Reference app.

Refreshing the Universal Theme

Update an application to use the latest Universal Theme to take advantage of new features, enhancements, and bug fixes as well as styling for new APEX components.

Tip: Before starting this procedure, Oracle recommends backing up your application by either exporting it or creating a copy. See Exporting an Application and Copying an Application.

To update an application to use the latest Universal Theme

1. Navigate to the App Builder home page:

   1. On the Workspace home page, click the App Builder icon.

   2. Select an application.

      If the Universal Theme is not up-to-date, the App Builder home page displays a banner at the top of the page that reads:

      There is a new version of Universal Theme available! You can refresh your theme to take advantage of new features, enhancements, and bug fixes.

2. Click Refresh Theme.

3. Run and test your application.

See Also: Migration Guide page in the Universal Theme Reference app.