31
Views
2
Comments
Solved
Change font color from a datepicker inside an animated label widget
Application Type
Reactive
Service Studio Version
11.54.38 (Build 63033)
Platform Version
11.25.0 (Build 41743)

While adding a datepicker inside an animated label widget I found out I am not able to change font color as I can when adding a text input widget.

I have tried to apply a CSS class forcing "color: #fff" but it was unsuccessfully.


My surprise was when editing the HTML code in the browser.

When adding "color: rgb(255, 255, 255)" in the style of the second <input> it worked


How do I apply this style from Service Studio?

2019-09-30 07-35-56
Aurelio Junior
Solution

Hello,

Try adding this piece of CSS to your theme:

.animated-label-input .osui-datepicker .input {
  color: #fff;
}

Of course, this will change the color for all date pickers insinde animated labels in your app. If you only want to change it in some cases, you can add an Extended Class to your animated label and style it accordingly. For instance, if you add the Extended Class "white-text", you can then use this CSS:

.animated-label.white-text .osui-datepicker .input {
  color: #fff;
}

UserImage.jpg
Ferran Barceló

Hi @Aurelio Junior ,

It worked.

Thank you!

Ferran

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.