CSS Utility Classes
CSS JavaScript
Switch branches/tags
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
dist
src
.editorconfig
.gitignore
CHANGELOG.md
LICENSE
README.md
bower.json
gulpfile.js
package.json
yarn.lock

README.md

rearmed-css

NPM Version NPM Downloads Buy Me a Coffee

CSS Utility Classes for rapid development. All rules use !important to ensure they are applied regardless of any other rules, this is a feature.

CSS class list:

/* Images */
.img-responsive


/* Alignment */
.table-text-center
.text-left
.text-center
.text-right
.center-block
.pull-left, .float-left
.pull-right, .float-right
.vcenter-wrapper
.vcenter-wrapper .vcenter


/* Font */
.thin
.bold
.unbold
.italic
.underline
.white
.light-gray
.gray
.black
.soft-black
.font-6
.font-8
.font-9
.font-10
.font-11
.font-12
.font-13
.font-14
.font-16
.font-18
.font-20
.font-22
.font-24
.font-26
.font-22
.font-30
.font-40
.font-50


/* Spacing */
.margin-vertical0
.margin-vertical
.margin-vertical2
.margin-vertical3
.margin-vertical4
.margin-vertical5
.margin-vertical6
.margin-horizontal0
.margin-horizontal
.margin-horizontal2
.margin-horizontal3
.margin-horizontal4
.margin-horizontal5
.margin-horizontal6
.margin-left0
.margin-left
.margin-left2
.margin-left3
.margin-left4
.margin-left5
.margin-left6
.margin-top0
.margin-top
.margin-top2
.margin-top3
.margin-top4
.margin-top5
.margin-top6
.margin-bottom0
.margin-bottom
.margin-bottom2
.margin-bottom3
.margin-bottom4
.margin-bottom5
.margin-bottom6
.margin-right0
.margin-right
.margin-right2
.margin-right3
.margin-right4
.margin-right5
.margin-right6
.padding-horizontal0
.padding-horizontal
.padding-horizontal2
.padding-horizontal3
.padding-horizontal4
.padding-horizontal5
.padding-horizontal6
.padding-vertical0
.padding-vertical
.padding-vertical2
.padding-vertical3
.padding-vertical4
.padding-vertical5
.padding-vertical6
.padding-top0
.padding-top
.padding-top2
.padding-top3
.padding-top4
.padding-top5
.padding-top6
.padding-left0
.padding-left
.padding-left2
.padding-left3
.padding-left4
.padding-left5
.padding-left6
.padding-right0
.padding-right
.padding-right2
.padding-right3
.padding-right4
.padding-right5
.padding-right6
.padding-bottom0
.padding-bottom
.padding-bottom2
.padding-bottom3
.padding-bottom4
.padding-bottom5
.padding-bottom6
.spacer-5
.spacer-10
.spacer-15
.spacer-20
.spacer-30
.spacer-40
.spacer-50
.spacer-75
.spacer-100


/* Visibility */
.hide, .hidden
.invisible, .hide-keep-space
.visible-xs
.visible-sm
.visible-md
.visible-lg
.hidden-xs
.hidden-sm
.hidden-md
.hidden-lg

View full CSS file here

Install

Yarn, NPM, Bower

yarn add rearmed-css

npm install rearmed-css

bower install rearmed-css

Rails

# Gemfile
source 'https://rails-assets.org' do
  gem 'rails-assets-rearmed-css'
end


# app/assets/stylesheets/application.scss
/*
 *= require rearmed-css
*/

Credits

Created by Weston Ganger - @westonganger