Aliases for modifier classes

[kfdf]

Hi, I've just started learning tailwind and I'm sorry if I missed something obvious, but one thing that immediately springs to mind when reading the docs is how the combination of multiple/long modifiers with multiple properties leads to excessive repetition. There were some discussions of the problem but, unless I missed something, the only proposed solution was some sort of grouping syntax, which led to a whole host of problems. So I'm thinking why not just introduce aliases for modifiers, so that this (taken from the docs):

<input type="text" value="tbone" disabled class="mt-1 block w-full px-3 py-2 
  bg-white border border-slate-300 rounded-md text-sm shadow-sm 
  placeholder-slate-400
  focus:outline-none focus:border-sky-500 focus:ring-1 focus:ring-sky-500
  disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 
  disabled:shadow-none
  invalid:border-pink-500 invalid:text-pink-600
  focus:invalid:border-pink-500 focus:invalid:ring-pink-500
"/>

becomes this:

<input type="text" value="tbone" disabled class="mt-1 block w-full px-3 py-2 
  bg-white border border-slate-300 rounded-md text-sm shadow-sm 
  placeholder-slate-400
  focus::f f:outline-none f:border-sky-500 f:ring-1 f:ring-sky-500
  disabled::d d:bg-slate-50 d:text-slate-500 d:border-slate-200 d:shadow-none
  invalid::i i:border-pink-500 i:text-pink-600
  focus:invalid::fi fi:border-pink-500 fi:ring-pink-500
"/>

where focus:invalid::fi introduces an alias fi, fi:ring-pink-500 uses it, and this is the generated css:

.focus\:invalid\:\:fi.fi\:border-pink-500:focus:invalid {
  // ...
}

Higher specificity of such selectors prevents conflicts when the alias name conflicts with a predefined modifier. Also, with consistent naming convention there shouldn't be too much of a "blow up" in size of generated css.