Are there features in Susy that need Compass? - sass

The Susy documentation says:
The only requirement is Sass, but Susy was built to be part of the Compass ecosystem, and we recommend pairing with tools like Breakpoint and Vertical Rhythms.
Of course if you want to use the recommended Vertical Rhythms, which is part of Compass, you're dependent on Compass.
But other than using the functions/mixins Compass provides, are there any reasons why I would want to use Compass with Susy? Are there parts of Susy that only work, or work better, when Compass is available?
For example, in the file _breakpoint-plugin.scss you see that Susy actively checks if the Breakpoint Plugin is available, and changes its behavior accordingly. I want to know if there are similar optional dependencies on Compass built in.
PS, In reaction to the close vote:
I do not mean to ask for opinions. I want to know if there are features in the Susy codebase that do not work (or not as well) when Compass is not available. I will update the title to make that more clear. Please let me know if you see more ways to improve the question.

Check the custom support docs for all our integrations. Basically: we'll use Compass prefixing, clearfix, vertical rhythms, and rem fallback if you ask for them.

[...] are there any reasons why I would want to use Compass with Susy?
Yes, compass has some mixins and functions that aren't available in Susy. For example: sticky footer.
Are there parts of Susy that only work, or work better, when Compass is available?
As far as I'm concerned it doesn't. If you read it correctly you will see this:
The only requirement is Sass, but Susy was built to be part
of the Compass ecosystem, and we recommend pairing with
tools like Breakpoint and Vertical Rhythms.
This is for Susy 2, but for 1 however:
Compass is still required for the Susy One syntax.

Related

Do i need to install xcode to install homebrew to install RUBY to install COMPASS to use SUSY?

Why do I need to install so much just to use Susy or about any sass framework?
I got really interested in using sass and sass frameworks but I can't figure out a right way to start using it. I don't get why I need to have so much installed to use just one thing. Also, I have never installed something through some sort of terminal so this freaks my out immensely, why can't I just download a zip file.
If know a useful tutorial on where to start, that would also help.
thanks in advance
Your Mac already comes with a version of Ruby (with Sierra even a recent enough version). Unless you are actively develping on different versions of Ruby, you don't need to install a custom Ruby (or even a ruby version manager).
You probably still need a compiler. Here, the xcode command line tools are sufficient. You can install them with xcode-select --install.
Generally, all these tools are comand-line oriented. It will help you tremendously if you try to get at least a high-level understanding of how the command line works and how you can use it with your tools. This will also help you when it comes to deploy your solution to a live-server, often running Linux with just the command line.
Compass is not required for Susy. In fact, Compass is no longer maintained, so I highly recommend against using it. Susy only requires Sass, but you can use any flavor of Sass - Libsass, Ruby Sass, Node Sass, Gulp Sass, etc. If it compiles Sass, it will work with Susy. There are instructions for various setups in the Susy docs.
Susy also doesn't require command-line knowledge itself, though Sass is often compiled that way. There are tools that provide GUI wrappers for Sass, if you aren't comfortable in the command line. I think CodeKit ships with Susy included.

Fundamental difference between Susy 2.0 and SingularityGS

I am wondering if there is any key differences between these two grid systems. I can't see any on the surface and dont know why I would want to choose one over the other. I built sites with both singularity and susy 1 in the last few months and they both worked great. They both appear to be actively developed and built by solid folks. Is there any specific advantages that one offers over the other? Are there any situations where on might be a better choice?
Susy 1 and Singularity 1.1.2 offered different types of responsive grids. Now, however, Susy 2.1.1 and Singularity 1.2.0 are quite similar in that respect. I believe that Susy incorporated some ideas from Singularity. I have re-built my website using Susy 2.1.1; previously I had used Singularity 1.1.2. I have tried Singularity 1.2.0 but at the moment there are some changes in coding that I cannot get to work. IMHO, they are both excellent but there is one huge difference. The documentation for Susy 2.1.1 is very good, whereas Singularity's documentation is still minimal and the Changelogs don't help a lot. There is also a video at 'sass bites #29' which though long-winded gives quite a lot of help with Susy 2. I have found (again) that the documentation isn't perfect. For example the methodology for setting a background or overlay grid can vary and I have found (from the video) a neater way of doing that. The new $maps and the new functions are really helpful in Susy 2 (e.g. #include break). There are a lot of changes in functions in Susy and Singularity and Susy's comprehensive documentation is essential.

Setting up compass/sass project

When I was young I experimented with CSS, and then after a while my peers pressured me into trying SASS. It's been a slippery slope and the pushers have now got me onto Compass.
I don't really understand the difference between the following two commands
sass --compass --watch .
compass watch .
As I was having problems with the first command, I tried setting up a Compass project and using the 2nd.
However, this dies saying "Undefined mixin 'background-image'". I can get that error to go away by adding an #import "compass"; at the top of my .scss file. But why would I have to import compass when I'm running the compass command itself?(!) Surely all the libraries are included there? Obviously not.
Any help gratefully received.
The --compass flag for the sass command is only intended to be a quick way to access the Compass library. If you actually need to configure Compass, then it is recommended that you setup a Compass project and use the compass command (see: https://github.com/nex3/sass/issues/858).
Compass is more than just a collection of mixins for prefixed properties. It is an extension manager that happens to have a few extensions by default (compass, blueprint, etc). Using Compass only grants you access to the helper functions (which are written in Ruby) by default. This is by design: you include only the items you need, not what Compass thinks you need.

Spree 2.0.4 change _variables.scss

I'm using Spree 2.0.4 and I want to change the light blue link/price color globally. I found app/assets/stylesheets/store/_variables.scss and changed $link_text_color but it doesn't seem to effect the appearance.
I'm unfamiliar with scss, the internet seems to say I may need to use some kind of sass --watch command, but I can't figure out the implementation.
Thanks
Modern version of Rails handle assets through the Asset Pipeline, so you don't need to worry about compiling your scss files with sass watch.
Unfortunately, I believe the issue you're encountering is currently an outstanding issue in Spree:
https://github.com/spree/spree/issues/3415

SASS plugin for CSS3 cross-browser compatibility?

Is there a SASS extension that would take SASS stylesheets, find neutral properties (e.g. border-radius) and output all vendor-specific properties for it (e.g. -webkit-border-radius etc) automatically?
I don't really want to create all the mixins manually nor write the code manually. I'm sure there must be such an extension, but I can't find it. Help?
There is a very nice gem that would fit your needs. It's called Bourbon
It will not replace your css with the vendor-specific one as it works as SASS is made to work.
It is basically a mixin collection that generates the cross-browser css properly.
Compass has a CSS3 module that handles a lot of that stuff.

Resources