SASS install and use

1. install compass and sass https://gist.github.com/stephou0104/233b5c99884f1d8c8b8b

2. SASS cheatsheet:

http://sass-cheatsheet.brunoscopelliti.com

to configure a folder with compass

  1. mkdir mycompass
  2. cd mycompass
  3. mkdir assets
  4. cd assets
  5. mkdir stylesheets
  6. mkdir sass
  7. mkdir images
  8. mkdir javascripts
  9. add a config.rb file with content like this:
  10. preferred_syntax = :sass
    http_path = /
    css_dir = assets/stylesheets
    sass_dir = assets/sass
    images_dir = assets/images
    javascripts_dir = assets/javascripts
    relative_assets = true
    line_comments = true

 

Now to start playing:

add a something.sass file inside assets/sass directory with some content like this:

$defaultLinkColor: #46EAC2
a
color: $defaultLinkColor

$wk: -webkit-

.rounded-box
#{$wk}border-radius: 4px

.tareq
width: 50px

then go to terminal inside mycomass folder

run this command:

compass watch

this will output like this:

⚙ compass watch
>>> Compass is watching for changes. Press Ctrl-C to Stop.
modified assets/sass/something.sass
write assets/stylesheets/something.css

 

Advertisements
About

Work is fun!

Tagged with: , , , ,
Posted in Javascript, Linux, Tips And Tricks

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Disclaimer
All content provided on this "tareqalam.com" blog is for informational purposes only. The owner of this blog makes no representations as to the accuracy or completeness of any information on this site or found by following any link on this site. The owner of [tareqalam.wordpress.com] will not be liable for any errors or omissions in this information nor for the availability of this information. The owner will not be liable for any losses, injuries, or damages from the display or use of this information.
June 2015
M T W T F S S
« May   Sep »
1234567
891011121314
15161718192021
22232425262728
2930  

Enter your email address to follow this blog and receive notifications of new posts by email.

Join 23 other followers

%d bloggers like this: