113
Views
6
Comments
Solved
What is the css class that controls the animated label when the widget is disabled.
Question

Greetings,


I'm trying to change the style of the animated label when the widget is disabled.


The base theme doesn't have a class for that. How can I edit it?


For example we have,


  .animated-label.active .animated-label-text {

            color: blue;

  }


To change the color of the label to blue when the input is selected.


I imagine it would be something like 


  .animated-label.disabled .animated-label-text {

            color: blue;

  }


I tried .disabled, :disabled, .inactive. And nothing works.


Thank you

Nuno Pereira

mvp_badge
MVP
Rank: #61
Solution

Hi Nuno,

Ok. I see.

Why don't you do everything "inside" OutSystems?

  • define a boolean variable that says if the input is enabled or not.

  • use that variable to set the style of the label.

I've attached an oml with this.

Cheers,

José

AnimatedLabel.oml

Rank: #44

Hi Nuno,


Please check below screen shot.You can change color of textbox for disabled in my example that way


mvp_badge
MVP
Rank: #61

Hi Nuno,

If the label and the input widget are at the same level you can do something like:

input[type="text"]:disabled + <selector to the element that you want to change> {
    color: blue;
}

Is this what you want?

Cheers,

José

mvp_badge
MVP
Rank: #61
Solution

Hi Nuno,

Ok. I see.

Why don't you do everything "inside" OutSystems?

  • define a boolean variable that says if the input is enabled or not.

  • use that variable to set the style of the label.

I've attached an oml with this.

Cheers,

José

AnimatedLabel.oml