File to import not found or unreadable: fancy-buttons

[scottmessinger]

Hi!

The Error

I seem to be having problems getting fancy-buttons up and running. This is the error message I receive:

Syntax error: File to import not found or unreadable: fancy-buttons. 
Load paths: /Users/ScottMessinger/code/hlavka/app/assets/stylesheets /Users/ScottMessinger/.rvm/gems/ruby-1.9.2-p180-patched@rails31/gems/compass-0.12.alpha.0/frameworks/blueprint/stylesheets 
/Users/ScottMessinger/.rvm/gems/ruby-1.9.2-p180-patched@rails31/gems/compass-0.12.alpha.0/frameworks/compass/stylesheets 
Compass::SpriteImporter 
on line 9 of /Users/ScottMessinger/code/hlavka/app/assets/stylesheets/useful.sass/useful.sass"

The Set-up

I think I've set everything up right. Here's what I've done (I'm working on a Rails 3.1.1 app)

Gemfile

group :assets do
  gem 'sass', '~> 3.1.10'
  gem 'sass-rails', "~> 3.1.4"
  gem 'compass', "0.12.alpha.0"
end

gem 'fancy-buttons'

config/compass.rb

require 'fancy-buttons'

shell to install fancy-buttons

$ compass install -r fancy-buttons -f fancy-buttons
identical app/assets/stylesheets/ie6.sass 
identical app/assets/images/button_bg.png 

[ .... ] 

application.css

@import fancy-buttons
.left_arrow
  @include fancy-button(#2966a8)

I was curious if compass is registering fancy-buttons as a framework, and it appears to be doing so:

$ compass frameworks
Available Frameworks & Patterns:

  * blueprint
    - blueprint/basic       - A basic blueprint install that mimics the actual blueprint css.
    - blueprint/buttons     - Button Plugin
    - blueprint/link_icons  - Icons for common types of links
    - blueprint/project     - The blueprint framework.
    - blueprint/semantic    - The blueprint framework for use with semantic markup.
  * compass
    - compass/ellipsis      - Plugin for cross-browser ellipsis truncated text.
    - compass/extension     - Generate a compass extension.
    - compass/pie           - Integration with http://css3pie.com/
    - compass/project       - The default project layout.
  * fancy-buttons
    - fancy-buttons/project

In conclusion

I'm not sure where to go next. Any ideas?

[imathis]

That is quite odd. I'm really not sure what's going on here. I suspect it has something to do with the rails 3.1 stuff, which I'm totally unfamiliar with. Have you tried getting this to work with a simple standalone install of Compass? You should be able to test that with:

compass create test --syntax sass
cd test
compass install -r fancy-buttons -f fancy-buttons

Add require fancy-buttons to your config.rb, then pop this into the sass file:

@import fancy-buttons
.left_arrow
  @include fancy-button(#2966a8)

If that works, there may be some kind of problem with the Rails 3.1 integration. If it doesn't work, perhaps something with the latest version of Compass has issues with fancy buttons.

[scottdavis]

i can vouch for fancy-buttons working in rails 3.1, Scott if you can't figure it out this weekend lets meet up in hamdon or charles village one day and ill help you

[scottmessinger]

I figured out the problem. Before compass started using PIE, I had created a box_shadow mixin using PIE called "box_shadow" That was conflicting with compass (though I thought compass used 'box-shadow' with a dash). Thanks for the looking into the issue. Knowing that it wasn't the framework helped me pinpoint where the problem was coming from.

Thanks!

[imathis]

I had a feeling it was something unusual. I'm so glad you found your problem.

[lilrogalski]

I'm having the exact same issue but can't seem to resolve it. Scott, any insight into how you figured this out? I also defined a mixin called "box_shadow" but have since renamed it to "bshadow" and the issue persists.

[lilrogalski]

My only clue right now is that when I try to install fancy-buttons in the project I want to use it in I get this error instead of the html that explains the stylesheets you normally get after an install.

``NoMethodError on line 146 of /Library/Ruby/Gems/1.8/gems/compass-0.11.5/lib/compass/configuration/defaults.rb: undefined method[]' for :relative:Symbol Run with --trace to see the full backtrace

[scottdavis]

i think version of fancy-buttons requires a later version of compass then 0.11.5

[scottdavis]

or its your ruby version / os

[HashNuke]

I was expecting an issue with fancy-buttons and rails 3.1 since Compass itself is still being updated for Rails-3.1 and has no stable gem for 3.1. But it worked pretty easily. Probably should be added to the readme of this repo too since the Rails 3.1 install doesnt require the "compass" command to be run to include fancy-buttons.

This is how I used it:

Gemfile

group :assets do
    # all the asset stuff that rails already has and compass along with it 
    gem "fancy-buttons", :git => "https://github.com/imathis/fancy-buttons.git"
end

then run a bundle install

config/compass.rb

require "fancy-buttons"

app/assets/stylesheets/application.css.scss

@import "fancy-buttons";

ka-boom! Use fancy-buttons whereever you want now. Maybe you want to use the stable gem instead. But for compass and compass plugins I use the git source. The right place to have fancy-buttons is in the asset group since it isn't going to be required once the assets are compiled for production.

@imathis thanks for this cool gem. I've been using it for more than a year now in a lot of just-for-me apps and now in my first commercial side-project.

[jamessa]

I met the same problem and restart "compass watch" solves it. Just dive into Compass for 48 hours. Thanks for the great buttons.

[davesmylie]

I had the same issue with rails 3.1.3 - none of the above fixed it for me. However, I also had issues with compass load paths, which led to this hackish workaround:

config.sass.load_paths << "#{Gem.loaded_specs['compass'].full_gem_path}/frameworks/compass/stylesheets"
config.sass.load_paths << "#{Gem.loaded_specs['compass'].full_gem_path}/frameworks/blueprint/stylesheets"
config.sass.load_paths << "#{Gem.loaded_specs['fancy-buttons'].full_gem_path}/lib/stylesheets"