Field labels in RED color

Mel Charles  you are right, the above code is applied indiscriminately to all fields on the current page, even in the pop-up window of each field's formatting options. What you suggest is the next logical step and I hope Ninox listens to us so that they can officially include these features in one of their next releases!

Mel Charles This is the only solution I can find right now

html("
<style>
    .form .component.editor.editor-string:nth-child(2) .nx-input,
    .form .component.editor.editor-string:nth-child(2) .nx-input__input {
        color: yellow;
        background-color: red;
    }
</style>
")

In this example it would style the second field on your form view. You would just need to change the number in nth-child() to the number of the field on your form.

Sotirios Zormpas if you precede your class list with .form like my example for Mel, it will only affect the elements on your form and not other elements in the app's UI

Sean I like it - I can use this !  i have set it to field 1

Don't know anything about html/css

So silly question would I repeat lines 3 to 6 if i wanted it to effect another text input as well ie field 1 and say field 6 - have tried it but it don't work - why would it? = I am just stabbing in the dark

Mel Charles 

Works in this way, maybe there are best way.

html("
<style>
    .form .component.editor.editor-string:nth-child(2) .nx-input,
    .form .component.editor.editor-string:nth-child(2) .nx-input__input {
        color: black;
        background-color: orange;
    }
</style>
<style>
    .form .component.editor.editor-string:nth-child(3) .nx-input,
    .form .component.editor.editor-string:nth-child(3) .nx-input__input {
        color: black;
        background-color: orange;
    }
</style>
<style>
    .form .component.editor.editor-date:nth-child(6) .nx-input,
    .form .component.editor.editor-date:nth-child(6) .nx-input__input {
        color: white;
        background-color: green;
    }
</style>
")

Mel Charles Layout fields have to be counted as well. If you have Headers, Spaces, Line breaks, etc., they will need to be counted. By the way, much of my learning is by trial and error 

Rafael you don't need separate style tags for each style. Additionally, you can combine tags if the same style will be used by multiple tags.

html("
<style>
    .component.editor.editor-string.error {
        background-color: lightgray;
    }
    .component.editor.editor-string.error label {
        color: red;
    }
    .component.editor.editor-date.error label {
        color: red;
    }
    .component.editor.editor-date.error {
        background-color: lightgray;
    }
    .form .component.editor.editor-string:nth-child(1) .nx-input,
    .form .component.editor.editor-string:nth-child(1) .nx-input__input,
    .form .component.editor.editor-string:nth-child(3) .nx-input,
    .form .component.editor.editor-string:nth-child(3) .nx-input__input {
        color: yellow;
        background-color: red;
    }
</style>
")

I used nth-child(1) and nth-child(3) because there is a Line break between Text and Text 2.

Sean Thanks again now when place the date  go to normal field

Rafael would you please post your code and let me know what you are trying to achieve.

Sean  hi, also I like it. A practical way to give emphasis on one or more input fields. Thank you 

Sean 

html("
<style>
    .component.editor.editor-string.error {
        background-color: lightgray;
    }
    .component.editor.editor-string.error label {
        color: black;
    }
    .component.editor.editor-date.error label {
        color: green;
    }
    .component.editor.editor-date.error {
        background-color: lightgray;
    }
    .form .component.editor.editor-string:nth-child(2) .nx-input,
    .form .component.editor.editor-string:nth-child(2) .nx-input__input,
    .form .component.editor.editor-string:nth-child(2) .nx-input,
    .form .component.editor.editor-string:nth-child(2) .nx-input__input {
        color: black;
        background-color: orange;
    }
</style>
")

 @sean Rafael Great work Guys !   

 I have yet to get to grips with html workings - can only do simple basics for my adverts ...

Have a more pressing problem trying to learn to play Fats Waller "Handful of keys"
but thats another story!  See here

Mel Charles This thread originally started with a request to change the colors for Required fields. If you don't need that then you can just delete those lines.

Try this for the Date field

    .form .component.editor.editor-date:nth-child(2) .nx-input,
    .form .component.editor.editor-date:nth-child(2) .nx-input__input {
        color: white;
        background-color: green;
    }

Change the number if you need to.

Sean ah now makes sense - cheers

Mel Charles 

Can you place a screenshot please  

Rafael This is just a test to prove the theory!

so in @Sean's script i have

.form .component.editor.editor-date:nth-child(1) .nx-input,
    .form .component.editor.editor-date:nth-child(8) .nx-input__input {
        color: yellow;
        background-color: red;
    }

as you can see sean said you have to count the number of item elements on the form. in my second case it is 8 (8th item along)

Mel Charles The colour is terrible but I chose to ensure it stand out for testing. and because i am colour blind if I had set it to  say cyan,  I would never know if it had worked or not 

My system has some whacky colours and my colleagues hate me when I am testing !!!

I wish Ninox would add some kind of "style" sheet control !!

Mel Charles 

You can use hex color and choice a good color 

Rafael I know mate.... just whilst i'm testing very bold colours help from a colour blind perspective -