csscomb.js icon indicating copy to clipboard operation
csscomb.js copied to clipboard

SASS inline comments break sort ordering (and thus the SASS itself)

Open dominique-mueller opened this issue 7 years ago • 1 comments

When using SASS comments inline, for instance next to a declaration, the whole formatting breaks apart.

Example:

.input {
  font-family: inherit; // My awesome comment
  line-height: 20px;
}

The code above gets transformed into:

.input {
  font-family: inherit; // My awesome comment  line-height: 20px;
}

Sometimes, it even destroys the new line formatting, for example:

.input {
  font-family: inherit; // My awesome comment
  line-height: 20px; // My other comment
}

The code above gets transformed into:

.input { font-family: inherit; // My awesome comment
  line-height: 20px; // My other comment
}

Seems that CSS-style comments (/* ... */ instead of // ...) work fine though.

dominique-mueller avatar Jul 10 '17 10:07 dominique-mueller

I have another case:

.input {
  // My awesome comment
  font-family: inherit;
  // My other comment 
  line-height: 20px;
  // Another comment 
  z-index: 1;
}

changes into:

.input {
  // My awesome comment
  font-family: inherit;
  
// My other comment 
  line-height: 20px;
  
// Another comment 
  z-index: 1;
}

fabiandarga avatar Dec 06 '17 15:12 fabiandarga