Responsive CSS Framework
Literally Too orangey for crows!
It is not possible to directly import CSS assets into an ember-cli application at the moment and therefore the following configuration steps are required to get amazium working with an ember cli application.
Run the following in your application root to install amazium:
npm install amazium --save-dev
Run the following in your application root:
ember install ember-cli-node-assets
Update the Ember CLI build file to include the amazium compiled CSS from the node package:
// ember-cli-build.jsvar app = defaults...nodeAssets:'amazium':srcDir: 'dist'import: 'amazium.css';
The default parameters for the amazium grid are adjustable. You can set your own values in the _variables.scss file. When the SASS is compiled the grid values are calculated according to the set values. With these variable it is now possible to build a 1440px grid with 16 columns or whatever you wish.
/***** Define grid width *****//***** Define column number *****//***** Define gutter spacing *****//***** Calculate gutter spacing for breakpoints / can also be set manually *****/
$grid-widthcontrols how wide the initial grid is.
$grid-width-smscreencontrols how wide the grid on small screens is. This value also contols the smallscreen breakpoint.
$grid-width-tabletcontrols how wide the grid on tablets is. This value also contols the tablet breakpoint.
$grid-columnscontrols how much columns there are.
$grid-guttercontrols how much space there is between columns.
$grid-gutter-smscreencalculates how much space there is between columns on small screens. Can also be set manually.
$grid-gutter-tabletcalculates how much space there is between columns on tablets. Can also be set manually.