Styling: Icons

Oracle® JavaScript Extension Toolkit (JET)


  • 8.3.0
Class(es) Description Example Usage

Jet supports sass variables like $iconColorDefault, $iconColorHover, $iconColorActive, etc. When this class is used in conjunction with icon fonts the variable values will be used for default/hover/active/etc.

WARNING: this class is contextual, the colors will be seen if any ancestor is either a link or uses marker classes like oj-default, oj-hover, oj-active, etc.

<a href=""><span class="oj-clickable-icon demo-icon-font demo-home-icon-24"></span> home</a>
oj-clickable-icon-nocontext similar to oj-clickable-icon, except it is not contextual, so it must go directly on the anchor or on element with markers oj-default, oj-hover, oj-active, etc. <a href="" class="oj-clickable-icon demo-icon-font demo-home-icon-24" title="home"></a>