To use CSSComb as a BBEdit text filter, all you need to do is create a file in your Text Filters folder (I call mine "CSS comb.sh" because I'm wild and crazy), and have as the file's contents these two lines:
#!/bin/bash csscomb assets/css Open your CSS (or SCSS) file and run the text filter against your file. As with any "black box" operation such as this, make certain you have a backup of your file in its initial state and verify that the resulting reordered CSS file applies styling as expected. On Thursday, March 8, 2018 at 2:47:02 AM UTC-8, ollie wrote: > > Hi Peter, > > The tool I have most often heard people suggest for sorting CSS is > http://csscomb.com/online > Although I would be surprised if CSSComb would reorder rules as you have > described above. > If for example, selector2 and selector4 happened to match the same element > this reordering would result in a different margin being applied after the > sort. > > That aside, CSSComb does sort declarations _within_ blocks. > > If CSSComb *is* what you are looking for and you are able to: > * Install Node.js > * Are happy opening your terminal to install the CSSComb command line tool > > …myself or someone on this list will certainly be willing to help you > create a BBEdit Text Filter that will allow you to run the command line > tool against the open document with a keyboard shortcut. > > Personally I like to manually sort my CSS rules and declarations by > whatever logic makes the most sense at the time :) > > Cheers > Ollie > > On 7 March 2018 at 18:06, Peter Müller <[email protected] <javascript:>> > wrote: > >> Hello :) >> >> >> I would love to find a plugin to sort CSS rules automatically in BBedit. >> >> I'm not a programmer, so I cannot write it myself. >> >> Is there anyone who likes the idea and likes to create a plugin or likes >> to post the scriptcode here? >> >> >> Example of code before the sorting: >> >> >> selector4 { margin: 1em } >> selector3 { font-size: 2em } >> selector2 { margin: 0 } @media print { >> selector1 { display: none } } >> >> After the sorting by the declaration: >> >> >> selector3 { font-size: 2em } >> selector2 { margin: 0 } >> selector4 { margin: 1em }@media print { >> selector1 { display: none } } >> >> >> The position of @blocks should not change as you see. >> >> >> Thanks for your help :) >> >> -- >> This is the BBEdit Talk public discussion group. If you have a >> feature request or would like to report a problem, please email >> "[email protected] <javascript:>" rather than posting to the group. >> Follow @bbedit on Twitter: <http://www.twitter.com/bbedit> >> --- >> You received this message because you are subscribed to the Google Groups >> "BBEdit Talk" group. >> To unsubscribe from this group and stop receiving emails from it, send an >> email to [email protected] <javascript:>. >> To post to this group, send email to [email protected] >> <javascript:>. >> Visit this group at https://groups.google.com/group/bbedit. >> > > -- This is the BBEdit Talk public discussion group. If you have a feature request or would like to report a problem, please email "[email protected]" rather than posting to the group. Follow @bbedit on Twitter: <http://www.twitter.com/bbedit> --- You received this message because you are subscribed to the Google Groups "BBEdit Talk" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at https://groups.google.com/group/bbedit.
