Jump to content

custom css


jahlxx

Recommended Posts

Hi.

 

I'm trying some things with customcss.

 

I do this and works as expected:

 

.x-form-field {
    font: 12px tahoma !important;
}

 

 

I have tried with .x-form-checkbox, .x-form-label,.x-form-field-label,.x-form-radio, but don't work.

 

Are these the elements equivalents to unicheckbox, unilabel, uniradiobutton and field labels?

 

How can I do this?

 

Thanks in advance.




 

Link to comment
Share on other sites

You can right click on the checkbox label in Chrome and select "Inspect element". Then you would be able to see in the developer panel what the actual CSS selector is for the checkbox label and not the check.

 

 

For the Triton theme for example:

 

.x-form-cb-label-default {

   margin-top: 6px;

   font: 400 13px/17px Fira Sans Condensed, sans-serif;

   color: #404040;

}

 

In your CustomCSS if you just want the font size to be different you only need to have the following then:

 

.x-form-cb-label-default {

   font: 400 13px/17px Open Sans, sans-serif;

}

 

 

You don't always have to include !important - have to use it very wisely as you force an overriding.

 


Link to comment
Share on other sites

Sorry, but this don't work:

 

---------

In your CustomCSS if you just want the font size to be different you only need to have the following then:
 
.x-form-cb-label-default {
   font: 400 13px/17px Open Sans, sans-serif;
}
-----------
 
I put it in servermodule-customcss, but does nothing different.
Link to comment
Share on other sites

As I said - "You can right click on the checkbox label in Chrome and select "Inspect element". Then you would be able to see in the developer panel what the actual CSS selector is for the checkbox label and not the check."

 

Doing the above ... you can inspect the composition of the element. Typically for check boxes and radio buttons it is composed of a label and an image / FontAwsome meaning two CSS selectors, one for each. See the image for details...what you are looking for is in the class attribute.

post-4617-0-98038200-1523555269_thumb.png

post-4617-0-38035100-1523555282_thumb.png

Link to comment
Share on other sites

Ok.

 

Is not that I'm looking for, because this needs to restart the server.

 

Could be better to load the css at sesion init, like when the user changes the theme. changin theme, no restar is needed, only session restart.

Link to comment
Share on other sites

  • 1 year later...
1 hour ago, Masteritec said:

How to set the checkbox label text color when the checkbox is disable using CSS?

Hello,

1. UniServerModule.CustomCSS:

.myChBox.x-item-disabled .x-form-item-label {
   color: green;
   font-weight: bold;
}

2. UniCheckBox.LayoutConfig.Cls = myChBox

?

Link to comment
Share on other sites

2 hours ago, Masteritec said:

Any update on this?

 

11 hours ago, Masteritec said:

If i set using checkbox property, also cannot set checkbox text color

Sorry, please explain in more details.

Create a test case, let's say on the VCL, if possible, because I don’t fully understand your request.

Link to comment
Share on other sites

30 minutes ago, Sherzod said:

 

Sorry, please explain in more details.

Create a test case, let's say on the VCL, if possible, because I don’t fully understand your request.

When check box enabled = false, I just want change the check box color to blue .

Link to comment
Share on other sites

2 minutes ago, Sherzod said:

Can you reproduce on VCL and attach the testcase?

Just drop a unicheckbox set the enabled to false, then I want the text color to blue. And enabled to true just change back to black

I want to use CSS to control only. 

 

Link to comment
Share on other sites

7 hours ago, Masteritec said:

Click the Radio button Enabled = False then TuniEdit Text will change to Blue using CSS but Checkbox label no change at all

Can you check with this CSS?

._x-item-disabled .x-form-field {
    opacity: 1;
    -moz-opacity: 1;
    filter: alpha(opacity=100);
    color: blue; 
    background: #F0F0F0;
}

._mydisabledCheckBox .x-form-cb-label-default {
   opacity: 1;
    -moz-opacity: 1;
    filter: alpha(opacity=100);
    color: blue; 
    background: #F0F0F0;   
}

 

  • Like 1
Link to comment
Share on other sites

51 minutes ago, Sherzod said:

Can you check with this CSS?


._x-item-disabled .x-form-field {
    opacity: 1;
    -moz-opacity: 1;
    filter: alpha(opacity=100);
    color: blue; 
    background: #F0F0F0;
}

._mydisabledCheckBox .x-form-cb-label-default {
   opacity: 1;
    -moz-opacity: 1;
    filter: alpha(opacity=100);
    color: blue; 
    background: #F0F0F0;   
}

 

Great, is work.

Thanks your 

Link to comment
Share on other sites

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now
×
×
  • Create New...