How to change tab backgroup color using af.ui.css

[Muhammad_Y_Efendi]

I am using af.ui.css style now, and I try to change panel (tob and bottom ) background color as attachment file.

I tried to use my own style.css, but changed the page background.

Sorry, maybe this issue is not part of your support, if you don't mind please help this issue.

Thanks,

[Diego_Calp]

Hi,

There is a simple way to change the background color without touching af.ui.css

1. In designer, select the footer or header.

2. On STYLES section at left, drop down Custom and select New..

3. Name the style, for example, header-bg

4. On the style code, write this:

.footer-bg {
background: white;
}

5. Save style.

That's all, you may use the same style definition in other controls just selecting it from Custom list.

Regards

Diego

[Muhammad_Y_Efendi]

Thanks for respond, Diego.

I don't use Designer, I use native HTML5 and Cordova.

I tried to add your css, but it doesn't work.

.footer-bg {
background: white;
}

Thanks,

[Diego_Calp]

Hi Muhammad,

What I did with designer make these changes in code:

1. Add to file css/index_main.less.css the code you posted above.

2. Assign to the header/footer element the style name, in my test is like this:

<footer class="wrap-element uib_w_13 footer-bg" data-uib="app_framework/footer" data-ver="1" id="af-footer-1"></footer>

If you reproduce manually both steps should work.

Regards

Diego

[Chris_P_Intel]

Don't make modifications directly to index_main.less.css  As it says in the opening comment, that file is auto-generated from a .less file.  Any changes you make there are liable to be lost.

Just make a new .css file, include it into the HTML _after_ index_main.less.css is bound in.