cancel
Showing results for 
Search instead for 
Did you mean: 
cancel
Showing results for 
Search instead for 
Did you mean: 

CSS for Text Input Widget

SOLVED
Garnet

CSS for Text Input Widget

What are the CSS scripts for the "Text Input" Widget.

I have the label position set to 'Stacked Label' and I am trying to change the colour of the label text color and text color.

 

At the moment I am using:

.dataLabel {
  background-color : #346596;
  font-weight : bold;
  color : #FFF;  
}
  

The background color and font weight works fine, but the color (font color) does not work. 

Is there anything specific I am mising?

Thanks

 

1 ACCEPTED SOLUTION

Accepted Solutions

Re: CSS for Text Input Widget

Hi Atif,

 

Thanks for sharing the screenshot. Please use the below code to change the color of the label:

 

.dataLabel .input-label {
color: #FFF;
}

 

Let me know if this works.

View solution in original post

4 REPLIES 4

Re: CSS for Text Input Widget

Hi @atifkhan,

I have used the below code to change the color of the text:

.dataLabel {
background-color : #346596;
font-weight : bold;
}

.dataLabel input {
color: #FFF;
}

 

This is one of the ways to achieve the functionality. Please let me know if this works.

 

Re: CSS for Text Input Widget

Thanks @ytella

 

This is half of what I need, using this method changes the text inside the text input but I still cannot get the 'Label' to change font color.

As shown in the screenshot, the text (43%) is showing white, but the label input (Target) is still black.  ThingWorx Studio - Text Input.png

 

Thanks,

Atif

Re: CSS for Text Input Widget

Hi Atif,

 

Thanks for sharing the screenshot. Please use the below code to change the color of the label:

 

.dataLabel .input-label {
color: #FFF;
}

 

Let me know if this works.

View solution in original post

Highlighted

Re: CSS for Text Input Widget

Thanks @ytella, thats perfect.

 

Much appreciated,

Atif

 

 

Announcements
Topics available:
AR/VR for Data Optimization AR/VR for Security and Control AR/VR for Inspection