Discuss anything related to web development but no technical support questions


Post by paulofrwk »

Hi,
I'm trying to change the text color to white (or #fff) and it's not working. How could I change text color in this tbar ? The prop "color" just change the icon color.

tbar: [
            {

            type: 'button',
            color: 'b-white',
            text: 'Salvar',
            layout: 'fit',
            style: 'background-color: #006c4f; left: 93%',
            icon: 'fa fa-save',
            ...
            

Image


Post by tasnim »

Hello,
Inside the style, you could add color : white

{
	type : 'button',
	...,
	style : 'background-color: #006c4f; left: 93%; color: white'
}

Or you could add a cls to this and then style the class

{
	type : 'button',
	cls : 'custom-cls'
}

You can style it inside of the CSS

.custom-cls {
	background-color : red;
	color : white;
}

Docs https://bryntum.com/products/gantt/docs/api/Core/widget/Button#config-cls

Good Luck :),
Tasnim


Post by paulofrwk »

Hello!
Thanks for the answer.
But, I tried both ways and they didn't work. Only the icon changes color correctly but the text does not. Do you have any other idea?

tasnim wrote: Fri Nov 25, 2022 2:45 pm

Hello,
Inside the style, you could add color : white

{
	type : 'button',
	...,
	style : 'background-color: #006c4f; left: 93%; color: white'
}

Or you could add a cls to this and then style the class

{
	type : 'button',
	cls : 'custom-cls'
}

You can style it inside of the CSS

.custom-cls {
	background-color : red;
	color : white;
}

Docs https://bryntum.com/products/gantt/docs/api/Core/widget/Button#config-cls

Good Luck :),
Tasnim


Post by marcio »

Hey paulofrwk,

You can use the cls property, and with the following snippet you can change the color font:

// Assuming that you're setting a class with the name 'test'

.test label {
    color: white;
}

Best regards,
Márcio


Post Reply