Include Susy with Nanoc - compilation

I'm trying to include Susy in my Nanoc project.
I followed the GitHub of ddfreyne. I installed Compass first and Susy next. Then, in my Gemfile I added the line: gem "susy".
In my stylesheet, I added #import "susy" Unfortunately, I have an error during the compilation which is Sass::SyntaxError: File to import not found or unreadable: suzy. I don't understand this error...
I'm using SASS to make my stylesheets.
I hope you'll be able to help me! Cheers.

The mistake was quite simple. I had to replace #import "suzy by #import "susy" in my stylesheet.

Related

Bootstrap 4 beta using rubygem doesn't work with Jekyll

I just start using Jekyll recently for my personal project.
I'm using Jekyll-assets together with gem 'bootstrap-sass'; and everything works with charm.
This is what my main.css.scss look like:
#import '_sass/variables';
#import '_sass/scaffolding';
#import 'bootstrap-sprockets';
#import 'bootstrap';
#import 'font-awesome-sprockets';
#import 'font-awesome';
Everything works when I run jekyll serve.
However, when I try to use the latest beta version,
I got this error when I try to run Jekyll Serve
Incremental build: disabled. Enable with --incremental
Generating...
Error in _assets/css/main.scss:7 File to import not found or unreadable: bootstrap.
Load paths:
/Users/MacBookPro/.rvm/gems/ruby-2.3.0/gems/font-awesome-sass-4.7.0/assets/stylesheets
/Users/MacBookPro/.rvm/gems/ruby-2.3.0/gems/font-awesome-sass-4.7.0/assets/fonts
I commented out the #import 'bootstrap-sprockets.
It seems that Jekyll-assets does not found the bootstrap path.
I've already follow the step-by-step guide as stated in the documentation at [https://github.com/twbs/bootstrap-rubygem][1]
Currently I'm not using any package manager such as npm,yarn etc. Any help?

How do I get Burbon Neat running with code kit?

I have a burbon running on code kit. It is not problem, I cant get neat running?
when i put
#import "neat";
I get this error
Syntax error: File to import not found or unreadable: neat.
Load paths:
/
/Applications/CodeKit.app/Contents/Resources/engines/bourbon/bourbon/app/assets/stylesheets
on line 13 of /Applications/MAMP/htdocs/dev.wordpress/wp-content/themes/blankslate/style.scss
Use --trace for backtrace.
Since CodeKit version 1.8, Neat is built in. You don't need to install anything, just write this in your SASS/SCSS file:
#import "bourbon", "neat";
Make sure your 'Neat' folder is inside your stylesheets folder and use #import "neat/neat";
directory example:
[sitename] > [assets] > [css] > styles.css, [sass] > _main.sass, styles.sass, [neat]
Neat is a framework on top of Bourbon, so it does not automaticaly come with Bourbon.
Install Neat as following.
In Terminal:
gem install neat
Then cd to your Sass directory and run:
neat install
In your Sass file:
#import "neat/neat";
You also need to do:
#import "bourbon/bourbon";
before:
#import "neat/neat";
so your final scss file should start with(in the same order):
#import "bourbon/bourbon";
#import "neat/neat";

Compass / scout import

I just started with compass with scout for the GUI.
I'm trying to follow along with a demo and am a bit confused about #import. When I do
#import "compass" everything compiles fine. However when I try to import #import "scss/normalize" which is in compass/scss/_normalize.scss i get
Change detected at 14:59:07 to: screen.scss
error screen.scss (Line 2: Invalid CSS after "#import "compass"": expected selector or at-rule, was "#import "scss/n...")
overwrite screen.css
What exactly is #import "compass" doing? what file is that importing? Or is a folder from where I installed scout in program files?
figured it out. you need a ; after each import statement. duh.

Why do I get "Undefined mixin 'border-radius'" in Compass?

In my Compass the top file has lines which include necessary plugins:
#import "compass";
#import "rgbapng";
#import "compass/css3";
#import "config"; // file that has my variables
But during compilation of a file that has #include border-radius($box-radius-small); errors out saying Undefined mixin 'border-radius' and Undefined variable: "$box-radius-small". - both of which should be included already!
Can anyone please help with this issue?
PS my packages are:
Compass 0.12.2 (Alnilam)
Sass 3.2.7 (Media Mark)
Just place the following import at the top of your scss file
#import "compass/css3";
Features of css3 :: http://compass-style.org/examples/compass/css3/
There are many other imports available out there...and you can create your own if you find yourself re-using blocks of css often enough to warrant the extra effort.
Try to #import "compass" and your "config" variable sheet in every stylesheet that uses the mixins or variables.

how to use compass twitter bootstrap like compass blueprint

I have install the compass_twitter_bootstrap. i import it to my scss file like we import compass.
#import "compass";
#import "compass_twitter_bootstrap";
Importing compass is normal but while importing compass_twitter_bootstrap it overwrite all css in compiled css. Means all the css in bootstrap is imported to style.css. I want it to be work like compass file.
I am really noob in this compass and bootstrap. Any help will be greatly appreciated.
You might have to require it in your config.rb
require 'compass_twitter_bootstrap'

Resources