You are viewing limited content. For full access, please sign in.

Discussion

Discussion

Form Field Input Text Color

posted on September 6, 2018

How can change the color of the input text for all fields of a form?  I set the Body Text under Fields to the desired color but this only changes the font for radio buttons. I'd like to change the font color of the text that the user types into the form.

 

Thanks,

0 0
replied on September 6, 2018

You could just do something like the following

input[type=text] {
    color:red;
}

If you don't include [type=text] it could affect other items like upload buttons, if you also want it to cover multi-lines, dropdowns, etc., you could do the following

input[type=text], textarea, select {
    color: red;
}
1 0
replied on September 6, 2018

Thank you Jason.  That is exactly what I needed.

0 0
replied on September 6, 2018

Anyone know how to get these new settings to show on the form saved in Laserfiche?  It is only affecting the text as they type it in.  The saved form has the old settings.

0 0
replied on September 6, 2018

The saved form is a bit different because when Forms renders the document for storage in the repository, the fields are no longer "input" elements.

I can't remember off the top of my head what type of element they become for rendering, but you could try the following selectors to see if any work, or if they do work, which works best.

.cf-field > div > :first-child
.cf-field > div > *
.cf-field *

The thing to test is if you have text above/under the fields because the less specific selectors would change the color of that text as well.

0 0
replied on September 6, 2018

None of those are working.  I'll keep playing around with it and post if I find the right one.

0 0
replied on September 6, 2018

Try adding !important and test them again

color:red !important;

Those selectors don't have the highest specificity so something in the default styling might be overriding what you're testing.

0 0
replied on September 6, 2018

I must have typed something wrong the first time.  I just tried the following and it works!  Thanks for your help

.cf-field * {font-size:16px; font-style:bold; color: black;}
input[type=text], textarea, select {font-size:16px; font-style:bold; color: black;}

 

2 0
replied on September 6, 2018 Show version history

You'd use custom CSS with the selector input. Sample (modified from here):

input { color: red; }

 

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.