bluegrid's Introduction

Bluegrid

A Simple, Responsive, and customizable grid based on the flex property.

View Docs / Examples Page Learn the basics of Flexbox within a couple of minutes with this fun game

Getting Started

With NPM:

npm install bluegrid
@import node_modules/bluegrid/bluegrid
or add <link rel="stylesheet" type="text/css" href="node_modules/bluegrid/dist/bluegrid.min.css">

With Bower:

bower install bluegrid
@import bower_components/bluegrid/bluegrid
or add <link rel="stylesheet" type="text/css" href="bower_components/bluegrid/dist/bluegrid.min.css">

With Meteor:

meteor add colbycheeze:bluegrid
meteor add fourseven:scss
@import {colbycheeze:bluegrid}/bluegrid

Contributing / Dev

Clone or Fork repo and type npm install in the project directory
Run gulp to start up server, and BrowserSync will open a view at localhost:3000
make changes and submit a pull request if you wish
Yay

Project Todo

Create a download file
Improve Docs:
Add link back to Github
Create docs section for all mixin functionality
Create sidebar reference to where you are while scrolling on page.
Make some examples of real world layouts / use cases

bluegrid's Issues

Flex-direction column

I can see how it may have been intentional to omit something like this a flexbox grid system, but what do you think about support for switching a to flex-direction: column of a row? Mostly curious as I've come across several cases where this would've been very helpful while keeping things simple.