Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,253 Points
Posted by Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,253 Points

Some SASS Questions

I've started to look at Sass a little more. It's a lot of fun to use although sometimes I struggle to remember each of it's innovations and how to use them in practice.

It's been a long time coming but I finally started the Modular CSS with Sass Course today. I followed it well enough even if it did seem a little daunting at first. But one or 2 things confused me a little bit.

At one point Guil made some changes to a file and it seemed to latch on to applications.css as an output file. After a little investigating it seemed like all changes he made to the SCSS files seemed to output to that file.

But for the life of me I don't see how the Ruby compiler or the Treehouse console in Guil's case made that distinction to choose the apps CSS file to ouput CSS to its corresponding CSS file. It was obviously the right choice. The right file to output too but I don't know how we got there.

When I make CSS files from a partial file, I use

sass -- watch .

To track changes. This tracks the last .scss file changed in that folder and outputs to the .css file of the same name.

But how do we get input from CSS file and choose which file and location to output it to? I'm confused.

Thanks. :)

Jesus Mendoza
Jesus Mendoza
23,289 Points
Jesus Mendoza
Jesus Mendoza
23,289 Points

sass --watch . means you want to watch the sass files located in that folder (Desktop in Sass Basics), if you want to watch an specific Sass you have to set the path to it

sass -watch path/sass.scss:path/sass.css The first path is the location of the sass file and the second one is the path to the css file

That's how I did it 5 min ago when I started the Sass Basics course and it's working for me

Colin Marshall
Colin Marshall
32,861 Points
Colin Marshall
Colin Marshall
32,861 Points

I believe Jesus Mendoza correctly answered your question. If not, please let me know which video you are referring to and I will have a look to help you further.

Thanks Jonathan Grieve!

2 Answers

Guil Hernandez
STAFF
Guil Hernandez
Treehouse Teacher
Guil Hernandez
Guil Hernandez
Treehouse Teacher

Hi Jonathan Grieve,

Also, take a look at this post I just published on sass --watch. Silly title, I know, but hey... ;)

Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,253 Points
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,253 Points

Hi Guil :)

Thanks for your replies. I think it was the second video in stage 1. http://teamtreehouse.com/library/modular-css-with-sass/getting-modular-with-mixins-and-functions/pixels-to-em-function.

I might have missed a command where you told the console to output any changes to applications.css.

Actually now that I'm logged back in I've just had a look from 1:30 onwards it seems to be writing all changes to partial file to applications.css but that must have needed a command in the console set up that writing instruction with its file path. Seems like I missed that again but maybe I just need to get my head round how to set it up. :)

Thanks for your blog post link. I'll be sure to give that a good read. :)

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,253 Points
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,253 Points

So I think I see what's happening here.

applications.css is the only css file in the css folder, yes? So it latches on to that as the output file, especially as it's only folders that are being watched.

sass --watch scss:css

I'm not sure that would work if the files and folders weren't already there but I think I'm starting to get the idea now, thanks :)