Forgive me if this has been asked before but is there a way to keep spacing between CSS rules when formatting?
.login {
margin-top: 30px;
padding: 30px;
background: rgba(255, 255, 255, 0.7);
}
.login.btn {
border-radius: 0;
background-color: #5C6166;
border-color: #4a4a4a;
}
To:
.login {
margin-top: 30px;
padding: 30px;
background: rgba(255, 255, 255, 0.7);
}
.login.btn {
border-radius: 0;
background-color: #5C6166;
border-color: #4a4a4a;
}
+1
+1
+1
There is an option called "end_with_newline", I thought this adds a new line between blocks, but it just puts an empty line at the end of the file :-/
I hope this gets fixed, I love beautify but this issue (as silly as this may sound) is a deal-breaker for me.
I have fixed this, at least for simple CSS documents, by adding a new line after every }
go to \Packages\HTML-CSS-JS Prettify\scripts\node_modules\js-beautify\js\lib\beautify-css.js
Find this section of code:
print["}"] = function (ch) {
print.newLine();
output.push(ch);
print.newLine();
};
and change it to
print["}"] = function (ch) {
print.newLine();
output.push(ch);
print.newLine();
output.push('\n');
};
@Atid-G, that's great! Please provide a pull request with tests (and python port).
I think the fix from @Atid-G will not be sufficient. In a nested property, we don't need to add a new line after the closing bracket. I know that's for less/scss, but I think this is also used to beautify thos languages.
Example :
.rule-1 {
display: block;
.rule-2 {
float: left;
} // New line needed after this bracket
.rule-3 {
display: none;
} // No new line needed
}
@drewhamlett, I just took a merge, but I'm not sure it fully addresses what you wanted here. Could you take a look?
As @bitwiseman says this enhancement is covered at https://github.com/beautify-web/js-beautify/pull/574 pull request.
Please check it out and close this issue.
Waiting for the next version..
Okay, I'm going to call this good and we can reopen if it turn out not to be so.
As @malexandre said, would it be possible to add new lines within nested properties? Everything is looking bunched up in sass and the linter is complaining about it too. I have media queries nested in a lot of properties so it's quite hard to read.
@nevace, it sounds like you're talking about a different issue. Please open a new issue with example of input, current output, and desired output. Please include any pertinent settings.
has this been fixed?
has this been fixed?
@bitwiseman: I opened the new ticket myself since I think it's highly relevant #1258.
This would be so great. I wish js-beautify obeyed sass-lint
more explicitly, but this is the only feature that's giving me a lot of trouble.
Most helpful comment
This would be so great. I wish js-beautify obeyed
sass-lint
more explicitly, but this is the only feature that's giving me a lot of trouble.