Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?

Compiling Solid With Grunt Sass

Grunt-sass uses libsass to compile your sass. Use includePaths to make solid available as an scss import.

  sass: {
    dist: {
      options: {
        includePaths: 'node_modules/bf-solid/_lib'
      },
      files: {
        'path/to/output.css': 'path/to/input.scss'
      }
    }
});

Then in your scss import file import solid with @import "solid";

Solid Structure

Solid is broken up into four sections:

  • solid-helpers (variables and mixins used by all imports)
  • solid-base (normalize + base element styles)
  • solid-utilities (utility classes)
  • solid-components (utility classes that require specific HTML markup)

You can get everything with @import "solid";. Individual sections can also be imported. For example if you want the utility classes just @import "solid-utilities";

@jaredpalmer

@samthurman what do you guys use to build solid.buzzfeed.com? Are you using postcss-styleguide? Or are you using something similar to basscss.github.io?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment