postcss / sugarss

Indent-based CSS syntax for PostCSS
MIT License
707 stars 39 forks source link

Single line syntax suggestion #32

Closed whaaaley closed 8 years ago

whaaaley commented 8 years ago

I was thinking, similarly to how multi-line rules are created with a backslash, that single line rules could be escaped the same way? Single line rules are convenient for stuff like keyframes and things that are the same.

@keyframes bass
  0%, 100% \ transform: scale(1)
  10%, 90% \ transform: scale(1.15)
  20%, 80% \ transform: scale(1.1)
  30%, 70% \ transform: scale(1.05)
  40%, 60% \ transform: scale(1.1)
  50%      \ transform: scale(1.05)

rather than...

@keyframes bass
  0%, 100%
    transform: scale(1)

  10%, 90%
    transform: scale(1.15)

  20%, 80%
    transform: scale(1.1)

  30%, 70%
    transform: scale(1.05)

  40%, 60%
    transform: scale(1.1)

  50%
    transform: scale(1.05)
ai commented 8 years ago

\ is a escape, it could escape special meaning on char. So, when you write \n and newline, you escape newline.

In 0%, 100% \ transform: scale(1) you escape space (like there is no space).

Sorry, suggested syntax is not logical :)

whaaaley commented 8 years ago

Oh, yeah I see that. I guess I wasn't thinking in terms of escaping. Instead I was just thinking it was an arbitrary syntax delimiter. In that case \n would probably be clunky to add. Maybe this is would be better wtih a custom plugin. :D

ai commented 8 years ago

@dustindowell22 +1 for “custom plugin” :)

1j01 commented 8 years ago

Maybe the plugin could use |, that would probably look nice.