Re: Styling HTML placeholder attribute

On Jan 23, 2013, at 3:40 PM, Sylvain Galineau <sylvaing@microsoft.com> wrote:

> Yes, you can transition from the 'unmodified' state color - or whatever we end up calling it - to
> the regular text input color but you're not fading to nothing before the first keystroke as Philip's
> scenario requires it. So if you have:
> 
> input:unmodified {
>    color:<some gray>;
>    transition: color 0.2s;
> }
> input {
>    color:black;
> }
> 
> Then you'll going from gray to black when the user takes the control out of the unmodified state. It actually 
> works, imo; but if you want to fade out to transparent and then instantly switch to black on the first 
> keystroke then you'd some another intermediate state. 

From what Philip wrote, it seems like :focus is the intermediate state. I think that would look like this, if I'm not mistaken: 

input:unmodified {
   color:<some gray>;
   transition: color 0.2s;
}
input:unmodified:focus {
   color:<some lighter gray or transparent>;
   transition: color 0.2s;
}
input {
   color:black;
   transition: none;
}