modularscale / modularscale-sass

Modular scale calculator built into your Sass

Home Page:http://www.modularscale.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Trouble Installing Using Compass

christiantype opened this issue · comments

I am following the instructions below but can't seem to figure out the “compass config” part.

Compass
Terminal: gem install modular-scale
Compass config: require 'modular-scale'
SCSS: @import 'modular-scale';

@christiantype What problems are you running into? Do you not have a config.rb file in your project?

Hi,

So I followed the instructions and did gem install modular-scale which was successful. I have the config.rb file in my project folder and I included require 'modular-scale'

After this, I'm not sure what steps I should take.

Thanks for your reply

@christiantype From here on out you can just put @import 'modular-scale'; in any .scss file and modular scale will be available to you. Is that not working?

This is what's currently in my config.rb file which is located in a config folder.

`require 'compass/import-once/activate'

Require any additional compass plugins here.

Set this to the root of your project when deployed:

http_path = "/"
css_dir = "stylesheets"
sass_dir = "sass"
images_dir = "images"
javascripts_dir = "javascripts"
require 'modular-scale'

You can select your preferred output style here (can be overridden via the command line):

output_style = :expanded or :nested or :compact or :compressed

To enable relative paths to assets via compass helper functions. Uncomment:

relative_assets = true

To disable debugging comments that display the original location of your selectors. Uncomment:

line_comments = false

If you prefer the indented syntax, you might want to regenerate this

project again passing --syntax sass, or you can uncomment this:

preferred_syntax = :sass

and then run:

sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass

`

this is what's in my scss file which is in a scss folder.

`
/* =============== IMPORTS =============== */

@import "../libraries/bourbon/_bourbon.scss";
@import "../libraries/neat/_neat.scss";
@import 'modular-scale';

`

@christiantype Are you seeing any errors in your console?

No. Should I be doing a compass watch?

@christiantype Yes, it appears you have installed everything properly.

@christiantype ok… again, your project appears to be set up fine. Please run compass watch on it and let me know what errors you see when using modular scale.

`Christians-MacBook-Pro:config christians$ compass watch

Compass is watching for changes. Press Ctrl-C to Stop.
`

No error messages 😕

@christiantype What exactly is the problem you are having? Again, everything you have posted indicates everything is working fine and is installed properly. Is the ms() function not working? When you try to use the plugin what happens that indicates to you that it is broken?

Well, when I add the @import 'modular-scale'; I receive get
error scss/style.scss (Line 5: File to import not found or unreadable: modular-scale.)

@christiantype Now that’s an error we can work with.

What command did you use to install modular scale with? Did you add sudo at the beginning? Are you using http://bundler.io/ or RVM?

I didn't do sudo at the beginning — just gem install modular scale.

I don't believe I am using Bundler or RVM.

@christiantype what did the console say after you ran gem install modular scale ?

You know, I just noticed that I was typing gem install modular-scale with a hyphen instead of a space. I'm not sure if that makes a difference but I just typed it again using gem install modular scale with a space, and I got this:

Christians-MacBook-Pro:cc christians$ gem install modular scale
Fetching: rack-1.6.4.gem (100%)
Successfully installed rack-1.6.4
Fetching: concurrent-ruby-1.0.1.gem (100%)
Successfully installed concurrent-ruby-1.0.1
Fetching: sprockets-3.5.2.gem (100%)
Successfully installed sprockets-3.5.2
Fetching: thread_safe-0.3.5.gem (100%)
Successfully installed thread_safe-0.3.5
Fetching: tzinfo-1.2.2.gem (100%)
Successfully installed tzinfo-1.2.2
Fetching: i18n-0.7.0.gem (100%)
Successfully installed i18n-0.7.0
Fetching: activesupport-4.2.6.gem (100%)
Successfully installed activesupport-4.2.6
Fetching: mini_portile2-2.0.0.gem (100%)
Successfully installed mini_portile2-2.0.0
Fetching: nokogiri-1.6.7.2.gem (100%)
Building native extensions. This could take a while...
Successfully installed nokogiri-1.6.7.2
Fetching: loofah-2.0.3.gem (100%)
Successfully installed loofah-2.0.3
Fetching: rails-html-sanitizer-1.0.3.gem (100%)
Successfully installed rails-html-sanitizer-1.0.3
Fetching: rails-deprecated_sanitizer-1.0.3.gem (100%)
Successfully installed rails-deprecated_sanitizer-1.0.3
Fetching: rails-dom-testing-1.0.7.gem (100%)
Successfully installed rails-dom-testing-1.0.7
Fetching: rack-test-0.6.3.gem (100%)
Successfully installed rack-test-0.6.3
Fetching: erubis-2.7.0.gem (100%)
Successfully installed erubis-2.7.0
Fetching: builder-3.2.2.gem (100%)
Successfully installed builder-3.2.2
Fetching: actionview-4.2.6.gem (100%)
Successfully installed actionview-4.2.6
Fetching: actionpack-4.2.6.gem (100%)
Successfully installed actionpack-4.2.6
Fetching: sprockets-rails-3.0.4.gem (100%)
Successfully installed sprockets-rails-3.0.4
Fetching: railties-4.2.6.gem (100%)
Successfully installed railties-4.2.6
Fetching: bundler-1.11.2.gem (100%)
Successfully installed bundler-1.11.2
Fetching: arel-6.0.3.gem (100%)
Successfully installed arel-6.0.3
Fetching: activemodel-4.2.6.gem (100%)
Successfully installed activemodel-4.2.6
Fetching: activerecord-4.2.6.gem (100%)
Successfully installed activerecord-4.2.6
Fetching: globalid-0.3.6.gem (100%)
Successfully installed globalid-0.3.6
Fetching: activejob-4.2.6.gem (100%)
Successfully installed activejob-4.2.6
Fetching: mime-types-data-3.2016.0221.gem (100%)
Successfully installed mime-types-data-3.2016.0221
Fetching: mime-types-3.0.gem (100%)
Successfully installed mime-types-3.0
Fetching: mail-2.6.4.gem (100%)
Successfully installed mail-2.6.4
Fetching: actionmailer-4.2.6.gem (100%)
Successfully installed actionmailer-4.2.6
Fetching: rails-4.2.6.gem (100%)
Successfully installed rails-4.2.6
Fetching: modular-0.2.5.gem (100%)
Successfully installed modular-0.2.5
Parsing documentation for rack-1.6.4
Installing ri documentation for rack-1.6.4
Parsing documentation for concurrent-ruby-1.0.1
Installing ri documentation for concurrent-ruby-1.0.1
Parsing documentation for sprockets-3.5.2
Installing ri documentation for sprockets-3.5.2
Parsing documentation for thread_safe-0.3.5
Installing ri documentation for thread_safe-0.3.5
Parsing documentation for tzinfo-1.2.2
Installing ri documentation for tzinfo-1.2.2
Parsing documentation for i18n-0.7.0
Installing ri documentation for i18n-0.7.0
Parsing documentation for activesupport-4.2.6
Installing ri documentation for activesupport-4.2.6
Parsing documentation for mini_portile2-2.0.0
Installing ri documentation for mini_portile2-2.0.0
Parsing documentation for nokogiri-1.6.7.2
Installing ri documentation for nokogiri-1.6.7.2
Parsing documentation for loofah-2.0.3
Installing ri documentation for loofah-2.0.3
Parsing documentation for rails-html-sanitizer-1.0.3
Installing ri documentation for rails-html-sanitizer-1.0.3
Parsing documentation for rails-deprecated_sanitizer-1.0.3
Installing ri documentation for rails-deprecated_sanitizer-1.0.3
Parsing documentation for rails-dom-testing-1.0.7
Installing ri documentation for rails-dom-testing-1.0.7
Parsing documentation for rack-test-0.6.3
Installing ri documentation for rack-test-0.6.3
Parsing documentation for erubis-2.7.0
Installing ri documentation for erubis-2.7.0
Parsing documentation for builder-3.2.2
Installing ri documentation for builder-3.2.2
Parsing documentation for actionview-4.2.6
Installing ri documentation for actionview-4.2.6
Parsing documentation for actionpack-4.2.6
Installing ri documentation for actionpack-4.2.6
Parsing documentation for sprockets-rails-3.0.4
Installing ri documentation for sprockets-rails-3.0.4
Parsing documentation for railties-4.2.6
Installing ri documentation for railties-4.2.6
Parsing documentation for bundler-1.11.2
Installing ri documentation for bundler-1.11.2
Parsing documentation for arel-6.0.3
Installing ri documentation for arel-6.0.3
Parsing documentation for activemodel-4.2.6
Installing ri documentation for activemodel-4.2.6
Parsing documentation for activerecord-4.2.6
Installing ri documentation for activerecord-4.2.6
Parsing documentation for globalid-0.3.6
Installing ri documentation for globalid-0.3.6
Parsing documentation for activejob-4.2.6
Installing ri documentation for activejob-4.2.6
Parsing documentation for mime-types-data-3.2016.0221
Installing ri documentation for mime-types-data-3.2016.0221
Parsing documentation for mime-types-3.0
Installing ri documentation for mime-types-3.0
Parsing documentation for mail-2.6.4
Installing ri documentation for mail-2.6.4
Parsing documentation for actionmailer-4.2.6
Installing ri documentation for actionmailer-4.2.6
Parsing documentation for rails-4.2.6
Installing ri documentation for rails-4.2.6
Parsing documentation for modular-0.2.5
Installing ri documentation for modular-0.2.5
Done installing documentation for rack, concurrent-ruby, sprockets, thread_safe, tzinfo, i18n, activesupport, mini_portile2, nokogiri, loofah, rails-html-sanitizer, rails-deprecated_sanitizer, rails-dom-testing, rack-test, erubis, builder, actionview, actionpack, sprockets-rails, railties, bundler, arel, activemodel, activerecord, globalid, activejob, mime-types-data, mime-types, mail, actionmailer, rails, modular after 348 seconds
Fetching: equalizer-0.0.11.gem (100%)
Successfully installed equalizer-0.0.11
Fetching: descendants_tracker-0.0.4.gem (100%)
Successfully installed descendants_tracker-0.0.4
Fetching: coercible-1.0.0.gem (100%)
Successfully installed coercible-1.0.0
Fetching: ice_nine-0.11.2.gem (100%)
Successfully installed ice_nine-0.11.2
Fetching: axiom-types-0.1.1.gem (100%)
Successfully installed axiom-types-0.1.1
Fetching: virtus-1.0.5.gem (100%)
Successfully installed virtus-1.0.5
Fetching: scale-0.1.3.gem (100%)
Successfully installed scale-0.1.3
Parsing documentation for equalizer-0.0.11
Installing ri documentation for equalizer-0.0.11
Parsing documentation for descendants_tracker-0.0.4
Installing ri documentation for descendants_tracker-0.0.4
Parsing documentation for coercible-1.0.0
Installing ri documentation for coercible-1.0.0
Parsing documentation for ice_nine-0.11.2
Installing ri documentation for ice_nine-0.11.2
Parsing documentation for axiom-types-0.1.1
Installing ri documentation for axiom-types-0.1.1
Parsing documentation for virtus-1.0.5
Installing ri documentation for virtus-1.0.5
Parsing documentation for scale-0.1.3
Installing ri documentation for scale-0.1.3
Done installing documentation for equalizer, descendants_tracker, coercible, ice_nine, axiom-types, virtus, scale after 1 seconds
39 gems installed

@christiantype Should work after this install runs, let me know if it works.

Okay, so I guess the issue was that hyphen I was typing.

I noticed that in my config folder, a css folder appeared with style.css inside but still no modular scale

@christiantype Are you seeing an error? I need to know what is wrong so I can help?

error scss/style.scss (Line 5: File to import not found or unreadable: modular-scale.)

@christiantype what does gem list modular-scale return in your terminal?

^CChristians-MacBook-Pro:cc christians$ gem list modular-scale

*** LOCAL GEMS ***

modular-scale (2.1.1)

oof, yeah, so it’s installed which means there is something else wrong. I noticed your config isn’t in the root of your project, how did you set up your compass project to point to the config there?

When I did compass config, it automatically placed config.rb, in that folder. Will it make a difference if I place it in the root of the project?

@christiantype I downloaded your repo and wasn’t able to replicate your error. I managed to get everything working but it looks like you have a typo in that your config file has the sass directory as sass but in your project it’s scss.

@christiantype I’m gonna cut out for the night. To recap, I was able to get everything working in your project by following the install steps and by fixing a typo in the config file.

Okay, I'll keep trying to see what's the issue. Thanks for all your time and help. I appreciate it.

@christiantype Looks like you are typoing the install again in that video by using a space instead of a hyphen. That install the gems modular and scale, neither of which are this gem.

Also, we have already confirmed that you have installed modular-scale correctly with gem list modular-scale. Your stylesheets are compiling without error as they should. Can you point me to an error message that indicates this is not working?

I wasn't receiving any error message, I simply wasn't seeing the modular-scale.scss file appearing in my project.

I just went ahead and installed it using Bower and that seemed to work fine.

Sorry for all the questions — I'm new to designing for the web.

@christiantype the file won’t show up via an install with Compass because it uses a load path internal to Compass instead of copying a file into your project. Anyway, glad you’re up and running now.