0
votes

I've just installed Foundation 5 with Sass and am using Compass to watch my stylesheets. I wanted to know what's the best practice for adding my custom styles. I've already created a custom.scss file and am referencing it using @import "custom"; in my app.scss file.

If I wanted to go ahead and change the background colour of the body, for example, how would I go about doing this using the mixins. I'm adding:

$body-bg: red;

to my custom.scss file, but the body's background isn't changing. Should I just edit the _settings.scss file, that seems wrong...

Any idea what I'm doing wrong? Thanks in advance!

Here's my config.rb:

# Require any additional compass plugins here.
add_import_path "bower_components/foundation/scss"

# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "stylesheets"
sass_dir = "scss"
images_dir = "images"
javascripts_dir = "javascripts"

# 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
2

2 Answers

0
votes

In your case maybe would be better use these structure:

app.scss:

@import "custom"; //where you define variables for foundation such as $body-bg: red;
@import "foundation";
@import "other styles";
0
votes

Yes, I've always just edited the _settings.scss file -- then use a decent file comparison (like Araxis Merge or Kaleidoscope to merge in new options as updates are made). If I have custom variables, I'll stick those at the top of the settings file (that need to effect both the settings and my global stuff after the fact).