Skip to main content
1-Visitor
April 26, 2018
Solved

CSS for Text Input Widget

  • April 26, 2018
  • 1 reply
  • 3088 views

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

 

Best answer by ytella

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.

1 reply

17-Peridot
April 26, 2018

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.

 

atifkhan1-VisitorAuthor
1-Visitor
April 26, 2018

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

ytella17-PeridotAnswer
17-Peridot
April 26, 2018

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.