[Support request] Form 'Placeholder' color support in GP

Home Forums Support Form 'Placeholder' color support in GP

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #1079743
    Alex

    Hello GP,

    I’ve been customizing some Gravity Forms and I was happy to see that most colors set in the GP colors are supported. There is only one color that is not supported and it is the ‘Placeholder’ color. The null value text of the input controls. I’ve a dug a little and it seems this is set per browser. Something like this:

    input::-webkit-input-placeholder {
        color: #9B9B9B;
    }
    
    input:-ms-input-placeholder {
        color: #9B9B9B;
    }
    
    input::-moz-placeholder {
        color: #9B9B9B;
    }

    It would be nice to have that color configurable in the GP Customizer\Colors\Forms\Placeholder.

    Thanks!

    Alex

    #1080494
    Tom
    Lead Developer
    Lead Developer

    Hi Alex,

    I agree, it’s just too bad it requires so much CSS for such a simple thing. Will consider this in 1.10 🙂

    Thanks!

    #1081544
    Alex

    Hi Tom,

    I think Gravity didn’t have your philosophy when writing their 3000+ lines formsmain.css 😉

    Section in blocks plug-in -> GP 1.10 with Placeholder color -> GenerateForms alpha! Busy end of year for you Tom 😁

    #1081755
    Tom
    Lead Developer
    Lead Developer

    Haha, we’ll have to see about that! 😁

    #1091928
    Alex

    You’re probably aware of this, but since this was new to me I kept reading and I found this article really interesting. I’m not sure what your tool chain is, but AutoPrefixer could help keep your development css clean and automatically append the browser specific stuff at release.

    For example this:

    textarea::placeholder {
        color:#ccc;
    }
    
    input::placeholder {
    	color:#ccc;
    }

    Becomes this:

    textarea::-webkit-input-placeholder {
        color:#ccc;
    }
    
    textarea::-moz-placeholder {
        color:#ccc;
    }
    
    textarea:-ms-input-placeholder {
        color:#ccc;
    }
    
    textarea::-ms-input-placeholder {
        color:#ccc;
    }
    
    textarea::placeholder {
        color:#ccc;
    }
    
    input::-webkit-input-placeholder {
    	color:#ccc;
    }
    
    input::-moz-placeholder {
    	color:#ccc;
    }
    
    input:-ms-input-placeholder {
    	color:#ccc;
    }
    
    input::-ms-input-placeholder {
    	color:#ccc;
    }
    
    input::placeholder {
    	color:#ccc;
    }
    #1092570
    Tom
    Lead Developer
    Lead Developer

    Yea, definitely saves some typing time! I’m more concerned with the amount of CSS it generates though – that’s tons of code just to adjust the placeholder color. I’ll definitely see what I can do 🙂

    Thanks!

    #1092957
    Alex

    Hi Tom,

    Sorry I was so vague. I meant that I didn’t know there were so many rules that require browser specific prefixes. And since it seem to change depending on browser version, it is a lot of work to maintain.

    I suggested Autoprefixer as a time saver, because it uses https://caniuse.com/ and automatically handles those up-to-date prefixes for you. For example if you run the GP style.css in it, it will add and remove couple of browser specific prefix. I guess it removes those that have been standardized in newer browser version and adds them on those that are not quite standardized.

    Anyway, there’s zero emergency to support Placeholder color, my css snippet does the job. And this might be the only website I ever build.

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.