px-starter-kit-design
The px-starter-kit-design is a Predix meta kit that simply ties together a few key dependencies that are usually the starting point for any new project. It is a fork of inuitcss' starter-kit.
The Starter Kit specifically contains Px and inuitcss default variables and mixins, as well as Nicolas Gallagher’s Normalize.css, global box-sizing, viewport, and typography rules.
Additionally, the Starter Kit includes unobtrusive helper and trump classes for use within a project. This enables by default utilities to help with responsive implementation and micro spacing strategies.
Install the module
$ bower install --save https://github.com/PredixDev/px-starter-kit-design.git
Usage
Use the following as a template for your sass file. Inside this template, the modules must be imported in the following order (read more about why the order matters):
// Settings
@import "px-colors-design/_settings.colors.scss";
// Tools
// Generic
@import "px-normalize-design/_generic.normalize.scss";
@import "px-box-sizing-design/_generic.box-sizing.scss";
@import "px-helpers-design/_generic.helpers.scss";
// Base
@import "px-flexbox-design/_base.flexbox.scss";
@import "px-viewport-design/_base.viewport.scss";
@import "px-typography-design/_base.typography.scss";
// Meta
// Objects
// Component
// Your css goes in here
// Trumps
@import "inuit-clearfix/_trumps.clearfix.scss";
@import "px-spacing-responsive-design/_trumps.spacing-responsive.scss";
@import "px-widths-responsive-design/_trumps.widths-responsive.scss";
Dependencies
This module depends on the following modules (automatically included with Bower install):