Int3g3r Posted October 2, 2020 Share Posted October 2, 2020 Hello, I'm struggeling at changing the background-color of a TUnimButton. // ExtEvent function added(sender, container, index, eOpts) { sender.addCls('mainBtnBg') } /* CustomCSS */ .mainBtnBg { width:120px; height:30px; background: #1E90FF; /* blue */ border: 5px solid #1E90FF; /* borda branca em volta */ margin: auto; /* centraliza com bordas automáticas nas laterais */ text-align: center; /* centraliza o texto */ font-family: Source Sans Pro; /* fonte */ font-size: 16px; /* tamanho da fonte */ color: #1E90FF; /* cor fonte */ border: 1px solid #ccc; border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25); border-color: #e6e6e6 #e6e6e6 #bfbfbf; border-bottom-color: #b3b3b3; border-radius: 4px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05); } The font-color changes to blue, but the background-color is still btnFace it should be blue. I copied the code from the example attachment. Regards, Int3g3r btnmobile.zip Link to comment Share on other sites More sharing options...
GoldLine Posted October 4, 2020 Share Posted October 4, 2020 Hello, try this and you'll see how it works: /* special button design */ .mainBtnBg { border-radius:0px !important; border: 2px !important; } .mainBtnBg .x-inner-el { icon-color: #ffffff !important; background-color: orange; border-radius:0px !important; /*padding-top: 0 !important;*/ } .mainBtnBg:hover { background-color: green; border-radius:0px !important; border: 2px !important; } .mainBtnBg .x-badge-el { color: green; background-color: lime; background-image: none; border-radius: 10px; } 1 Link to comment Share on other sites More sharing options...
Int3g3r Posted October 5, 2020 Author Share Posted October 5, 2020 13 hours ago, GoldLine said: .mainBtnBg .x-inner-el { icon-color: #ffffff !important; background-color: orange; border-radius:0px !important; /*padding-top: 0 !important;*/ } This works, thank you. How can i select the .x-inner-el in a uniEvent without a css-class ? For example: function beforeInit(sender, config) { config.style = {'background-color':'#D3D3D3'} config.style.x-inner-el = {'background-color':'#D3D3D3'} //does not work } Link to comment Share on other sites More sharing options...
Sherzod Posted October 5, 2020 Share Posted October 5, 2020 5 hours ago, Int3g3r said: How can i select the .x-inner-el in a uniEvent without a css-class ? For example: function beforeInit(sender, config) { config.style = {'background-color':'#D3D3D3'} config.style.x-inner-el = {'background-color':'#D3D3D3'} //does not work } Hello, Maybe you want to use something like this: function afterCreate(sender) { sender.element.select('.x-inner-el').setStyle('background-color', '#D3D3D3'); } 1 Link to comment Share on other sites More sharing options...
Int3g3r Posted October 5, 2020 Author Share Posted October 5, 2020 Perfect that is what i'm looking for! 1 Link to comment Share on other sites More sharing options...
asapltda Posted October 22, 2020 Share Posted October 22, 2020 Goodnight, 1. When it shows the color button it does not show the text, it should be white for example, could you explain how to do it 2.It is possible to put a complete example, I have not been able to make them work thanks Link to comment Share on other sites More sharing options...
Int3g3r Posted October 23, 2020 Author Share Posted October 23, 2020 On 10/22/2020 at 3:16 AM, asapltda said: Goodnight, 1. When it shows the color button it does not show the text, it should be white for example, could you explain how to do it 2.It is possible to put a complete example, I have not been able to make them work thanks TMainmForm -> AligmentControl : uniAligmentClient TUnimButton -> ClientEvents -> UniEvents ... -> function afterCreate(sender) { sender.element.select('.x-inner-el').setStyle('background-color','#FF0000'); } TUnimButton -> Font ... -> - Select Color, Bold, Size and Style This works for me atleast. Link to comment Share on other sites More sharing options...
asapltda Posted October 24, 2020 Share Posted October 24, 2020 GRACIAS FUNCIONA COMBINADO AMBAS Link to comment Share on other sites More sharing options...
Recommended Posts