Middleman, Compass and Formalize - compass-sass

I have been trying to get middleman, compass and formalize to work together, but so far without too much luck.
I did install the Compass Formalize plugin
sudo gem install compass_formalize
... and I did add the obligatory require to config.rb
require "compass_formalize"
... but the effect is that my stylesheets can be located (with #import "formalize";
), but I don't know how to pull in the JavaScript files. Anyone?

jquery example:
cd project_dir
compass install formalize/jquery
jquery.formalize.js should be in the javascript directory specified in config.rb

Related

Compass loads wrong paths for plugins like the gem compass-rgbapng

I tried to setup my project as normal. In the config.rb file i require rgbapng and before of corse I installed it with sudo gem install compass-rgbapng.
Now when I now run compass compile . I get the following Errors.
compass compile .
error sass/styles.sass (Line 5: File to import not found or unreadable: rgbapng.
Load paths:
Compass::SpriteImporter
/home/my_user/public_html/spinnwerk/my_project/public/sass
/var/lib/gems/1.9.1/gems/compass-core-1.0.1/stylesheets)
The gem compass-rgbapng is located under /var/lib/gems/1.9.1/gems/compass-rgbapng-0.2.1. So How do I tell compass to watch in the right directory?
I fixe it for me by copying the file to te compass-core folder.
sudo cp /var/lib/gems/1.9.1/gems/compass-rgbapng-0.2.1/lib/stylesheets/_rgbapng.scss /var/lib/gems/1.9.1/gems/compass-core-1.0.1/stylesheets
This is a bad fix in my opinion, so I am still looking for a better way. If you can find one, pleas let me know.

Can't get Compass to watch my Susy project

I am a newb to the command line. The furthest I have taken it was to install the sass version of Foundation successfully. I want to try out Susy to see if it suites my needs better. I was following the 11 videos series on Susy Tutorials on Level Up Tuts by Scott Tolinski. I followed him step by step during the installation process all the way up until the "compass watch" command within my root folder. I was then thrown this error:
NoMethodError on line ["31"] of /Users/bradgabel/.rvm/gems/ruby-2.0.0-p247/gems/compass-1.0.0.rc.0/lib/compass/sass_compiler.rb: undefined method `on_compilation_starting' for #Sass::Plugin::Compiler:0x007fe4a41def80>
Run with --trace to see the full backtrace
The gems I have installed are:
compass (1.0.0.rc.0, 0.12.7)
compass-core (1.0.0.rc.0)
compass-import-once (1.0.4)
sass (3.4.0.rc.2, 3.2.19)
susy (2.1.3)
Try to put this on your sass file.
#import "susyone";
hope can solve your problem.
I am also having issues using compass watch from the command line but mine was after I updated my susy / sass gems. I have found that using preros was much easier and you can configure it to use the same config.rb file + your system ruby gems without having to navigate the command line. Best of luck.

Import of "bourbon" doesn't work in Jekyll setup

I'm using Jekyll to create a static website and want to use the framework Bourbon to build my CSS from.
I've installed Jekyll and want to install Bourbon by adding it to my Gemfile using gem 'bourbon' and running bundle install.
Now when I add the rule #import 'bourbon'; to my SCSS file and start to run Jekyll by jekyll serve -w it starts, but when I modify my SCSS file the Jekyll watcher throws an error saying:
Regenerating: 1 files at 2014-07-03 10:00:11 `Conversion error: There was an error converting 'css/main.scss'.`
...error:
Error: File to import not found or unreadable: bourbon. Load path: /Users/mark/Code/markdejong.com/mistermark.github.com.jekyll/_sass
Error: Run jekyll build --trace for more information.
What can be the problem here? Shouldn't it be possible to import it like this or doesn't Jekyll support this?
Assuming you have a Gemfile:
source 'https://rubygems.org'
gem 'jekyll'
gem 'bourbon'
gem 'neat'
Add this line to _config.yml
gems: [bourbon, neat]
Jekyll will require these gems automatically.
Just do for import:
#import 'bourbon';
#import 'neat';
Check Jekyll docs for more information
http://jekyllrb.com/docs/plugins/
Did you do a
bourbon install
In order to create the bourbon folder ?
Bourbon's doc also says that for non rail app the import rule is :
#import 'bourbon/bourbon';
Did you import Bourbon at the Ruby level, with require 'bourbon?
Or in your Sass configuration?
With Sass, to use Bourbon installed with RubyGems, you have to tell the following command (note the argument -r bourbon):
sass -r bourbon -w css:sass
I do not know Jekyll, but it's perhaps a clue?

Undefined mixin susy-grid-background in susy 2

I'm trying to get Susy 2 to work on my computer. I have tried several ways of installing but none of them seem to completely work.
First attempt:
Installed compass, susy and sass manually through a gem install compass etc. I then created a project (compass create) and included the #import 'susy'. All seemed well but then the span mixin would not work.
Second attempt:
Uninstalled compass, sass and susy. Installed the gem compass-susy-plugin. Created a compass project with -r susy -u susy. This time span worked but the susy-grid-background mixin was undefined.
Third attempt:
Uninstalled compass susy plugin, compass and sass. Installed sass, susy and the gem compass --pre. Now the span mixin works but the susy-grid-background mixin is undefined. We are really not getting this. It is supposed to be really easy but something is going terribly wrong here.
I now have this Gem list:
Compass (1.0.0.alpha.19),
Sass (3.3.8, 3.2.19),
Susy (2.1.2)
I have tested this on two different computers (mac and windows). Same results.
My screen.scss has a include of base and in the base there is an include of susy. Config.rb has the require susy in it. There is no package.json file.
I hope someone has some pointers.
If it's just the grid that's the problem, I use:
#include container(show);
or
#include container(show overlay);
Have you looked up the documentation on http://susy.readthedocs.org/en/latest/ ?

How to install and use Slim template engine with Middleman

I'm new to Middleman and ruby in general.
I've installed Ruby
I've installed Middleman and the gems to get it running.
I need to use slim instead of the default template system.
So I installed the Slim gem. Slim's website only says that I need to require 'slim' in order to get it to work.
The middleman website says I only need add the template engine to the config.rb file, but it gives no examples...
For someone with no ruby background, this is no help.
I looked for several config.rb on git and they all have:
require 'slim'
And
# Set slim-lang output style
Slim::Engine.set_default_options :pretty => true
# Set template languages
set :slim, :layout_engine => :slim
I added that to my config.rb file and created the layout.slim and the index.html.slim
When I refresh my local server I get:
Not Found
`/' not found.
I have middleman installed with Boilerplace. I'm not sure if there are more files that I need to change, but I can't find any good resources online, which is odd.
Could anyone give me some direction as to what I'm missing?
So here we go... after much reading and searching google for examples I think I figured it out.
To get Slim working with Middleman
Add gem "slim" to your project's gemfile
go to command line, in your project folder and gem install bundler
In the config.rb file add require 'slim'
Start the middleman server to test it
The middleman-slim project by yterajima is helpful in this regard.
Install is very easy.
$ gem install middleman
$ gem install middleman-slim
$ middleman init PROJECT_NAME --template slim
Bundler tip: you can also include multiple gems at once using Bundler.require. If you have gems in groups, you can include them as such: Bundler.require :group1, :group2 ...

Resources