oracle-jet

How to customize the color of oj-button?


I have a problem with customizing the color of one button defined by oj-button:

<div id='buttons-container'>
       <oj-button id='in'
       style="background-color: #670067;">My Button</oj-button>
</div>

What I want is to change the color of the button but it did not work.

Do we have any simple way to change the color of oj-button?

Thanks in advance!


Solution

  • What you're trying won't work; there's no easy way to change the colors of OJET buttons.

    OJET gives you 2 options:

    1. Use the primary and confirm classes to get blue and green colors. Demo.
    2. Create your own theme using their Themebuilder tool. You have a lot of freedom here to change the colors, dimensions, fonts, shadows etc. But it's a lot of work if you just want to change the color of 1 button.

    Themebuilder (Instructions available in the top right tab, reload page if nothing shows after a few seconds): http://www.oracle.com/webfolder/technetwork/jet/public_samples/JET-Theme-Builder/public_html/index.html?viewer=true