Use lowercase colour hex strings for better compression

[baawiki]

See here for background.

There's a few places in Bootswatch where colour hex strings are written with uppercase letters, including in CSS custom properties which minifiers don't optimise.

pushd dist; \n
printf '     theme\torig\tlower\n     -----\t----\t-----\n'; \n
for x in $(ls); do \n
  f="${x}/bootstrap.min.css"; \n
  orig=$(cat "${f}" | gzip - -6 | wc -c); \n
  lower=$(sed -e 's/\(\#[[:xdigit:]]\{3,6\}\)/\L\1/g' "${f}" | gzip - -6 | wc -c); \n
  printf '%10s\t%d\t%d\n' "${x}" "${orig}" "${lower}"; \n
done; \n
popd

The savings do look small in bytes, but might be beneficial for sites taking only a subset of the CSS or where the reduction results in one less IP packet needed.

     theme  orig    lower
     -----  ----    -----
  cerulean  25453   25440
     cosmo  23976   23965
    cyborg  25507   25474
    darkly  25448   25430
    flatly  25598   25578
   journal  25046   25030
    litera  25855   25849
     lumen  26170   26152
       lux  24477   24464
   materia  29729   29723
     minty  25782   25751
     pulse  24504   24471
 sandstone  25474   25450
   simplex  25353   25337
   sketchy  26005   26005
     slate  26503   26504
     solar  27017   26979
  spacelab  25687   25675
 superhero  25362   25346
    united  25003   24975
      yeti  25937   25932

For my own project using a subset of the Cerulean theme CSS, this saves 17/3640 bytes ~= 0.5%.

[thomaspark]

Hey @baawiki, thanks for opening this issue. The space savings is small but welcome, but more to the point it's good to have consistent coding style.

[XhmikosR]

@thomaspark you should use Stylelint to enforce a consistent style :)

PS. We have a stylelint config we use in our projects if you are interested. You might need to adapt it a bit like disabling the order rules, but it should be a good starting point

[thomaspark]

Good call, I'll take a look at the official config. Thanks @XhmikosR!