John Smith john.smith@gmail.com

### Build

1. Install Node.js and NPM on your computer
2. Run command `npm install -g bower grunt-cli`
3. Run `bower install` to install dependencies
4. Run `grunt build:angular` to build project
5. Run `npm start` to start server

Note: any commands we tell you to run must be ran from the project's root folder.

### CSS

Generated by LESS files. There are many Variables you can config.

Margin and Padding
.no-margin | {margin: 0}
.m | {margin: 16px}
.m-xs | {margin: 4px}
.m-sm | {margin: 8px}
.m-md | {margin: 24px}
.m-lg | {margin: 32px}
.m-v-xs | {margin-top: 4px; margin-bottom: 4px;}
.m-v-sm | {margin-top: 8px;margin-bottom: 8px;}
.m-v | {margin-top: 16px;margin-bottom: 16px;}
.m-v-md | {margin-top: 24px;margin-bottom: 24px;}
.m-v-lg | {margin-top: 32px;margin-bottom: 32px;}
.m-h-xs | {margin-left:4px; margin-right: 4px;}
.m-h-sm | {margin-left:8px;margin-right: 8px;}
.m-h | {margin-left:16px;margin-right: 16px;}
.m-h-md | {margin-left:24px;margin-right: 24px;}
.m-h-lg | {margin-left:32px;margin-right: 32px;}
.m-t | {margin-top: 16px;}
.m-t-xs | {margin-top: 4px;}
.m-t-sm | {margin-top: 8px;}
.m-t-md | {margin-top: 24px;}
.m-t-lg | {margin-top: 32px;}
.m-r | {margin-right: 16px;}
.m-r-xs | {margin-right: 4px;}
.m-r-sm | {margin-right: 8px;}
.m-r-md | {margin-right: 24px;}
.m-r-lg | {margin-right: 32px;}
.m-b | {margin-bottom:16px;}
.m-b-xs | {margin-bottom:4px;}
.m-b-sm | {margin-bottom:8px;}
.m-b-md | {margin-bottom:24px;}
.m-b-lg | {margin-bottom:32px;}
.m-l | {margin-left: 16px;}
.m-l-xs | {margin-left: 4px;}
.m-l-sm | {margin-left: 8px;}
.m-l-md | {margin-left: 24px;}
.m-l-lg | {margin-left: 32px;}
.m-n | {margin: -16px}
.m-h-n | {margin-left: -16px;margin-right: -16px;}
.m-v-n | {margin-top: -16px;margin-bottom:-16px;}
.m-l-n | {margin-left: -16px;}
.m-r-n | {margin-right: -16px;}
.m-t-n | {margin-top: -16px;}
.m-b-n | {margin-bottom:-16px;}
.no-padding | { padding: 0 !important; }
.no-padding-h | { padding-left: 0 !important; padding-right: 0 !important; }
.no-padding-v | { padding-top: 0 !important; padding-bottom: 0 !important; }
.p-xs | { padding: 4px; }
.p-sm | { padding: 8px; }
.p | { padding: 16px; }
.p-md | { padding: 24px; }
.p-lg | { padding: 32px; }
.p-h | { padding-left: 16px; padding-right: 16px; }
.p-h-xs | { padding-left: 4px; padding-right: 4px; }
.p-h-sm | { padding-left: 8px; padding-right: 8px; }
.p-h-md | { padding-left: 24px; padding-right: 24px; }
.p-h-lg | { padding-left: 32px; padding-right: 32px; }
.p-v | { padding-top: 16px; padding-bottom: 16px; }
.p-v-xs | { padding-top: 4px; padding-bottom: 4px; }
.p-v-sm | { padding-top: 8px; padding-bottom: 8px; }
.p-v-md | { padding-top: 24px; padding-bottom: 24px; }
.p-v-lg | { padding-top: 32px; padding-bottom: 32px; }
Border
.b-a | border:1px solid @border-color(see app.variables.less)
.b-l | border left
.b-t | border top
.b-r | border right
.b-b | border bottom
.b-light, .b-dark, .b-primary, .b-success, .b-info, .b-warning, .b-danger, .b-black, .b-white | border with specific color.
.b-2x | border width with 2px
.b-3x | border width with 3px
.no-border | border width: 0
.no-border-xs | border width: 0 on etremely small screen.
Radius
.r | border-radius: @border-radius-base
.r-l | border-radius: @border-radius-base 0 0 @border-radius-base
.r-r | border-radius: 0 @border-radius-base @border-radius-base 0
.r-t | border-radius: @border-radius-base @border-radius-base 0 0
.r-b | border-radius: 0 0 @border-radius-base @border-radius-base
.r-2x | radius size: 2 x @border-radius-base
.r-3x | radius size: 3 x @border-radius-base
Text
.text-u-c | text uppercase
.text-l-t | text line through
.text-u-l | text under line
.text-ellipsis | display text in one line with ellipsis
.text-center-xs | center text only on extremely small devices
.text-left-xs | align text left only on extremely small devices
.text-right-xs | align text right only on extremely small devices
Width and Height
.w-xxl | width: 360px
.w-xl | width: 280px
.w-lg | width: 240px
.w-md | width: 200px
.w | width: 180px
.w-sm | width: 120px
.w-xs | width: 90px
.w-xxs | width: 60px
.w-64 | width: 64px
.w-56 | width: 56px
.w-48 | width: 48px
.w-40 | width: 40px
.w-32 | width: 32px
.w-24 | width: 24px
.w-20 | width: 20px
.w-16 | width: 16px
.w-full | width: 100%
.w-auto-xs | width: auto on extremely small screen.
.h-full | height: 100%
Arrow
.arrow | base class
.left | left arrow, position:middle
.right | right arrow, position:middle
.top | top arrow, position:center
.bottom | bottom arrow, position:center
.pull-left | .top and .bottom arrow with left position
.pull-right | .top and .bottom arrow with right position
.pull-top | .left and .right arrow with top position
.pull-bottom | .left and .right arrow with bottom position
Item
.item-overlay | overlay the element on an item, default display:none, with '.active' class will show
.top | top element on a item element
.bottom | bottom element on a item element
.center | center element on a item element
Button
.btn-rounded | rounded button
.btn-icon | icon only button
.btn-addon | icon addon, must have a i tag, and can use .pull-left and .pull-right
box
.box | display: table
.box-row | display: table-row
.box-col | display: table-cell
.box-inner | for box with fluid height
.v-m | vertical align: middle
.v-t | vertical align: top
.v-b | vertical align: bottom

### Modules

Managed by Grunt

#### angular-ui-router

The de-facto solution to flexible routing with nested views

#### angular-translate

i18n for your Angular apps, made easy

#### ngStorage

localStorage and sessionStorage done right for AngularJS.

#### ocLazyLoad

Load modules on demand (lazy load) in AngularJS.

#### UI.Utils

Swiss-Army-Knife of AngularJS tools (with no external dependencies!).

#### angular-loading-bar

A fully automatic loading / progress bar for your angular apps.

#### angular-ui-select

AngularJS-native version of Select2 and Selectize

#### textAngular

A radically powerful Text-Editor/Wysiwyg editor for Angular.js! Create multiple editor instances, two-way-bind HTML content, watch editors for changes and more!

#### venturocket-angular-slider

Slider directive for AngularJS.

#### angular-bootstrap-nav-tree

An AngularJS directive that creates a Tree based on a Bootstrap "nav" list.

#### angular-file-upload

An AngularJS directive for file upload using HTML5 with FileAPI polyfill for unsupported browsers

#### ngImgCrop

Image Crop directive for AngularJS

#### angular-smart-table

Code source of Smart Table module: a table/grid for Angularjs

#### angular-ui-map

Google Maps

× Members
Jonathan Doe "Hey, What's up"
James Pill "Lorem ipsum dolor sit amet onsectetur adipiscing elit"
Work
Jonathan Morina Mason Yarnell Mike Mcalidek Cris Labiso Daniel Sandvid Helder Oliveira Jeff Broderik Daniel Sandvid Helder Oliveira Jeff Broderik
Partner
Mason Yarnell Mike Mcalidek Cris Labiso Jonathan Morina Daniel Sandvid Helder Oliveira

Invite People

Twitter Facebook
× Chat
Hi John, What's up...
2 minutes ago
Lorem ipsum dolor soe rooke..
1 minutes ago
Good!
5 seconds ago
Dlor soe isep..
Just now