RubyGems - uniform-ui - Versions diffs - 1.0 → 2.2.1 - Mend

uniform-ui 1.0 → 2.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (139) hide show

checksums.yaml +5 -5
data/lib/assets/config/manifest.js +1 -0
data/lib/assets/javascripts/uniform/checkbox.js +31 -0
data/lib/assets/javascripts/uniform/component.js +42 -0
data/lib/assets/javascripts/uniform/dom-helpers.js +136 -0
data/lib/assets/javascripts/uniform/dropdown.js +149 -0
data/lib/assets/javascripts/uniform/floating-label.js +54 -0
data/lib/assets/javascripts/uniform/icons.js +16 -0
data/lib/assets/javascripts/uniform/modal.js +103 -0
data/lib/assets/javascripts/uniform/resizer.js +43 -0
data/lib/assets/javascripts/uniform/select.js +235 -0
data/lib/assets/javascripts/uniform/tooltip.js +120 -0
data/lib/assets/javascripts/uniform-es5.js +1 -0
data/lib/assets/javascripts/uniform-jquery.js +124 -0
data/lib/assets/javascripts/uniform.js +17 -0
data/lib/assets/stylesheets/uniform/base.scss +3 -0
data/lib/assets/stylesheets/uniform/components/alert.scss +72 -0
data/lib/assets/stylesheets/uniform/components/buttons.scss +219 -0
data/{vendor → lib}/assets/stylesheets/uniform/components/card.scss +33 -25
data/lib/assets/stylesheets/uniform/components/container.scss +19 -0
data/{vendor → lib}/assets/stylesheets/uniform/components/dropdown.scss +8 -4
data/lib/assets/stylesheets/uniform/components/form/checkbox-collection.scss +103 -0
data/lib/assets/stylesheets/uniform/components/form/checkbox.scss +58 -0
data/lib/assets/stylesheets/uniform/components/form/floating-label.scss +64 -0
data/lib/assets/stylesheets/uniform/components/form/input-group.scss +56 -0
data/lib/assets/stylesheets/uniform/components/form.scss +143 -0
data/lib/assets/stylesheets/uniform/components/grid.scss +158 -0
data/lib/assets/stylesheets/uniform/components/label.scss +26 -0
data/lib/assets/stylesheets/uniform/components/loaders.scss +80 -0
data/{vendor → lib}/assets/stylesheets/uniform/components/modal.scss +26 -4
data/lib/assets/stylesheets/uniform/components/nav.scss +124 -0
data/lib/assets/stylesheets/uniform/components/row.scss +69 -0
data/lib/assets/stylesheets/uniform/components/select.scss +122 -0
data/lib/assets/stylesheets/uniform/components/table.scss +127 -0
data/lib/assets/stylesheets/uniform/components/thumb.scss +41 -0
data/lib/assets/stylesheets/uniform/components/tooltip.scss +63 -0
data/lib/assets/stylesheets/uniform/components.scss +11 -0
data/{vendor → lib}/assets/stylesheets/uniform/defaults.scss +7 -4
data/lib/assets/stylesheets/uniform/functions.scss +31 -0
data/lib/assets/stylesheets/uniform/helpers/border.scss +19 -0
data/lib/assets/stylesheets/uniform/helpers/colors.scss +23 -0
data/lib/assets/stylesheets/uniform/helpers/margin.scss +27 -0
data/lib/assets/stylesheets/uniform/helpers/padding.scss +9 -0
data/lib/assets/stylesheets/uniform/helpers/position.scss +13 -0
data/lib/assets/stylesheets/uniform/helpers/sizes.scss +38 -0
data/{vendor → lib}/assets/stylesheets/uniform/helpers/text.scss +86 -73
data/lib/assets/stylesheets/uniform/helpers.scss +127 -0
data/lib/assets/stylesheets/uniform/mixins.scss +116 -0
data/lib/assets/stylesheets/uniform/print/grid.scss +50 -0
data/lib/assets/stylesheets/uniform/variables.scss +72 -0
data/lib/assets/stylesheets/uniform-print.scss +1 -0
data/lib/assets/stylesheets/uniform.scss +11 -0
data/lib/uniform/version.rb +3 -0
data/lib/uniform.rb +15 -0
metadata +87 -95
data/.gitignore +0 -2
data/CHANGELOG.md +0 -27
data/CNAME +0 -1
data/Gemfile +0 -8
data/Gemfile.lock +0 -40
data/LICENSE +0 -22
data/README.md +0 -35
data/Rakefile +0 -74
data/index.html +0 -251
data/lib/uniform/rails/engine.rb +0 -8
data/lib/uniform/rails.rb +0 -6
data/lib/uniform/ui.rb +0 -1
data/preview/alerts.html.erb +0 -1
data/preview/buttons.html.erb +0 -62
data/preview/cards.html.erb +0 -23
data/preview/colors.html.erb +0 -22
data/preview/dropdown.html.erb +0 -1
data/preview/form.html.erb +0 -233
data/preview/grid.html.erb +0 -304
data/preview/helpers.html.erb +0 -225
data/preview/index.html.erb +0 -77
data/preview/labels.html.erb +0 -1
data/preview/layout.html.erb +0 -63
data/preview/loaders.html.erb +0 -83
data/preview/modal.html.erb +0 -1
data/preview/nav.html.erb +0 -77
data/preview/preview.scss +0 -76
data/preview/rows.html.erb +0 -36
data/preview/select.html.erb +0 -1
data/preview/tables.html.erb +0 -1
data/preview/tabs.html.erb +0 -17
data/preview/tiles.html.erb +0 -1
data/preview/tooltip.erb +0 -1
data/preview.css +0 -0
data/site/alerts.html +0 -157
data/site/alerts.html copy +0 -133
data/site/buttons.html +0 -286
data/site/cards.html +0 -177
data/site/colors.html +0 -275
data/site/dropdown.html +0 -157
data/site/dropdown.html copy +0 -141
data/site/form.html +0 -369
data/site/grid.html +0 -716
data/site/helpers.html +0 -1008
data/site/index.html +0 -251
data/site/labels.html +0 -157
data/site/layout.html +0 -313
data/site/loaders.html +0 -233
data/site/logo.png +0 -0
data/site/modal.html +0 -157
data/site/nav.html +0 -229
data/site/preview.css +0 -1
data/site/preview.js +0 -59
data/site/rows.html +0 -190
data/site/select.html +0 -157
data/site/tables.html +0 -157
data/site/tabs.html +0 -171
data/site/tiles.html +0 -157
data/site/tiles.html copy +0 -109
data/site/tooltip +0 -157
data/site/uniform.css +0 -1
data/uniform.gemspec +0 -22
data/vendor/assets/stylesheets/uniform/base.scss +0 -2
data/vendor/assets/stylesheets/uniform/components/alert.scss +0 -27
data/vendor/assets/stylesheets/uniform/components/buttons.scss +0 -212
data/vendor/assets/stylesheets/uniform/components/form.scss +0 -290
data/vendor/assets/stylesheets/uniform/components/grid.scss +0 -225
data/vendor/assets/stylesheets/uniform/components/label.scss +0 -63
data/vendor/assets/stylesheets/uniform/components/loaders.scss +0 -82
data/vendor/assets/stylesheets/uniform/components/nav.scss +0 -197
data/vendor/assets/stylesheets/uniform/components/row.scss +0 -92
data/vendor/assets/stylesheets/uniform/components/select.scss +0 -98
data/vendor/assets/stylesheets/uniform/components/table.scss +0 -83
data/vendor/assets/stylesheets/uniform/components/tabs.scss +0 -45
data/vendor/assets/stylesheets/uniform/components/tile.scss +0 -20
data/vendor/assets/stylesheets/uniform/components/tooltip.scss +0 -46
data/vendor/assets/stylesheets/uniform/helpers/colors.scss +0 -37
data/vendor/assets/stylesheets/uniform/helpers/margin.scss +0 -44
data/vendor/assets/stylesheets/uniform/helpers/padding.scss +0 -74
data/vendor/assets/stylesheets/uniform/helpers/sizes.scss +0 -31
data/vendor/assets/stylesheets/uniform/helpers.scss +0 -124
data/vendor/assets/stylesheets/uniform/mixins.scss +0 -77
data/vendor/assets/stylesheets/uniform/variables.scss +0 -36
data/vendor/assets/stylesheets/uniform.scss +0 -9

data/index.html DELETED Viewed

@@ -1,251 +0,0 @@
-<!DOCTYPE html>
-<head>
-    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
-    <title>Uniform</title>
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/4.2.0/normalize.css" type="text/css" media="screen">
-    <link rel="stylesheet" href="/site/uniform.css" type="text/css" media="screen" title="no title" charset="utf-8">
-    <link rel="stylesheet" href="/site/preview.css" type="text/css" media="screen" charset="utf-8">
-</head>
-<body>
-<div class="side-nav">
-    <div class="pad">
-        <a href="/">
-        <img src="/site/logo.png" class="block">
-        </a>
-    </div>
-    <div class="uniformNav vertical">
-        <div class="nav">
-                <a href="/site/helpers.html">
-                    Helpers
-                </a>
-                <a href="/site/colors.html">
-                    Colors
-                </a>
-                <a href="/site/grid.html">
-                    Grid
-                </a>
-                <a href="/site/buttons.html">
-                    Buttons
-                </a>
-                <a href="/site/tables.html">
-                    Tables
-                        <span class="uniformLabel yellow">todo</span>
-                </a>
-                <a href="/site/cards.html">
-                    Cards
-                </a>
-                <a href="/site/rows.html">
-                    Rows
-                </a>
-                <a href="/site/form.html">
-                    Form
-                </a>
-                <a href="/site/loaders.html">
-                    Loaders
-                </a>
-                <a href="/site/nav.html">
-                    Nav
-                </a>
-                <a href="/site/tabs.html">
-                    Tabs
-                </a>
-                <a href="/site/tiles.html">
-                    Tiles
-                        <span class="uniformLabel yellow">todo</span>
-                </a>
-                <a href="/site/labels.html">
-                    Labels
-                        <span class="uniformLabel yellow">todo</span>
-                </a>
-                <a href="/site/alerts.html">
-                    Alerts
-                        <span class="uniformLabel yellow">todo</span>
-                </a>
-                <a href="/site/dropdown.html">
-                    Dropdown
-                        <span class="uniformLabel yellow">todo</span>
-                </a>
-                <a href="/site/modal.html">
-                    Modal
-                        <span class="uniformLabel yellow">todo</span>
-                </a>
-                <a href="/site/select.html">
-                    Select
-                        <span class="uniformLabel yellow">todo</span>
-                </a>
-                <a href="/site/tooltip.html">
-                    Tooltip
-                        <span class="uniformLabel yellow">todo</span>
-                </a>
-        </div>
-    </div>
-</div>
-<div class="main-content overflow-hidden">
-    <div class="text-center margin-top-more">
-    <img src="site/logo.png" width="451" height="101">
-    <p class="large">Sass components and helpers for building a UI.</p>
-</div>
-<div class="section">
-    <h1>Installation</h1>
-    <p>Add to your gem file<br/><code>gem 'uniform-ui'</code></p>
-    <p>Execute:<br/><code>$ bundle</code></p>
-    <p>Or install it yourself:<br/><code>$ gem install uniform-ui</code></p>
-    <p>Include the css library in your asset pipeline.<br/><code>@import 'uniform';</code></p>
-    <p>Include the javascript library in your asset pipeline.<br/><code>//= require uniform</code></p>
-    <h3>Scope Components</h3>
-    <p>Optionally, you can scope the components you want included in your assets.</p>
-    <pre class=''>// css
-@import &#39;uniform&#39;;
-// - OR -
-@import &#39;uniform/base&#39;;
-@import &#39;uniform/helpers&#39;;
-@import &#39;uniform/defaults&#39;;
-@import &#39;uniform/helpers/text&#39;;
-@import &#39;uniform/helpers/colors&#39;;
-@import &#39;uniform/helpers/sizes&#39;;
-@import &#39;uniform/helpers/margin&#39;;
-@import &#39;uniform/helpers/padding&#39;;
-@import &#39;uniform/components/tile&#39;;
-@import &#39;uniform/components/label&#39;;
-@import &#39;uniform/components/form&#39;;
-@import &#39;uniform/components/buttons&#39;;
-@import &#39;uniform/components/select&#39;;
-@import &#39;uniform/components/card&#39;;
-@import &#39;uniform/components/grid&#39;;
-@import &#39;uniform/components/table&#39;;
-@import &#39;uniform/components/row&#39;;
-@import &#39;uniform/components/tabs&#39;;
-@import &#39;uniform/components/tooltip&#39;;
-@import &#39;uniform/components/dropdown&#39;;
-@import &#39;uniform/components/alert&#39;;
-@import &#39;uniform/components/loaders&#39;;
-@import &#39;uniform/components/nav&#39;;
-@import &#39;uniform/components/modal&#39;;
-// javascript
-//= require uniform
-// - OR -
-//= require uniform/base
-//= require uniform/select</pre>
-</div>
-<div class="section">
-    <h1>Philosophy</h1>
-    <h3>Don't use ID's</h3>
-    <p>Unless you have to, and even then, think twice. HTML Id's make things not
-        reusable. There should only be one instance of an id in a document</p>
-    <h3>Use Semanitc Classes Presentationaly :)</h3>
-    <p>
-        Here's a decent post on OOCSS (Object Oriented CSS) as it relates to
-        semantic vs presentational classes:
-        <a href="http://blackfalcon.roughdraft.io/5255648-oocss-v-ooscss-sasscast-show-notes">OOCSS v OOSCSS</a>
-    <p>
-        <strong>TL;DR:</strong> Semantic classes explain what that element is.
-        Presentational classes explain what the shoud look like.
-    </p>
-    <p>
-        <code>class="property-list"</code> vs <code>class="ul-list col-sm-4"</code>
-    </p>
-    <p>
-        Some of us don't want to touch css files (preference: presentational),
-        and some of us live there (preference: semantic). Honestly, the art of
-        good ui development is balancing semantic and presentational classes.
-        Each taken to their extreme is bad.
-    </p>
-    <p>
-        Structure html so that the semantic class is first and presentational
-        classes follow.
-    </p>
-    <p><code>class="property-list ul-list col-sm-4"</code></p>
-    <h3>Save the Namespace, save the world</h3>
-    <p>Don't make presentational classes that will clash with elements that could mean something else. I'm looking at you Bootsrap!</p>
-    <p><code>class="label"</code> should be <code>class="text-label"</code></p>
-    <h3>camelCase vs train-case</h3>
-    <p>Use camelCase for class names for components, not train-case or snake_case.</p>
-    <p>Use tran-case for class names for helpers or modifiers.</p>
-    <h3>Wrappers and Containers</h3>
-    <p>
-        Both <code>wrapper</code> and <code>container</code> can be used as class names
-        for an element that goes around a component. The difference is nuanced.
-        <code>wrapper</code> should be used to wrap a <strong>single</strong> element for a formatting purpose.
-        A <code>container</code> should be used to wrap <strong>multiple</strong> elements.
-    </p>
-</div>
-</div>
-<script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
-<script
-  src="https://code.jquery.com/jquery-1.11.3.min.js"
-  integrity="sha256-7LkWEzqTdpEfELxcZZlS6wAx5Ff13zZ83lYO2/ujj7g="
-  crossorigin="anonymous"></script>
-<script src="/site/preview.js"></script>
-</body>

data/lib/uniform/rails/engine.rb DELETED Viewed

@@ -1,8 +0,0 @@
-require 'bourbon'
-require 'neat'
-module Uniform
-  module Rails
-    class Engine < ::Rails::Engine
-    end
-  end
-end

data/lib/uniform/rails.rb DELETED Viewed

@@ -1,6 +0,0 @@
-require 'uniform/rails/engine'
-module Uniform
-  module Rails
-  end
-end

data/lib/uniform/ui.rb DELETED Viewed

	@@ -1 +0,0 @@
1	- require 'uniform/rails'

data/preview/alerts.html.erb DELETED Viewed

	@@ -1 +0,0 @@
1	- TODO

data/preview/buttons.html.erb DELETED Viewed

@@ -1,62 +0,0 @@
-<div class="section">
-    <h1>Buttons</h1>
-    <p>Mix and match styles to make the right button, all colors are available as well.</p>
-    <p><code><%= CGI::escapeHTML "<a href='#' class='uniformButton'></a>" %></code></p>
-    <table class="uniformTable" cellspacing="0" cellpadding="0">
-        <tr>
-            <th></th>
-            <th>Normal</th>
-            <th><code>.green</code></th>
-            <th><code>.blue</code></th>
-            <th><code>.red</code></th>
-            <th><code>.white</code></th>
-            <th><code>.gray</code></th>
-        </tr>
-        <tr>
-            <th></th>
-            <td><a class="uniformButton">Button</a></td>
-            <td><a class="uniformButton green">Button</a></td>
-            <td><a class="uniformButton blue">Button</a></td>
-            <td><a class="uniformButton red">Button</a></td>
-            <td><a class="uniformButton white">Button</a></td>
-            <td><a class="uniformButton gray">Button</a></td>
-        </tr>
-        <% [
-            ['hover, :hover', 'hover'],
-            ['active, :active', 'active'],
-            ['disabled, :disabled', 'disabled'],
-            'small',
-            'large',
-            'warn',
-            'block',
-            'outline',
-        ].each do |klass| %>
-            <% klass = [klass, klass] if !klass.is_a?(Array) %>
-            <tr>
-                <th><code>.<%= klass[0] %></code></th>
-                <td><a class="uniformButton <%= klass[1] %>">Button</a></td>
-                <td><a class="uniformButton green <%= klass[1] %>">Button</a></td>
-                <td><a class="uniformButton blue <%= klass[1] %>">Button</a></td>
-                <td><a class="uniformButton red <%= klass[1] %>">Button</a></td>
-                <td><a class="uniformButton white <%= klass[1] %>">Button</a></td>
-                <td><a class="uniformButton gray <%= klass[1] %>">Button</a></td>
-            </tr>
-        <% end %>
-        <tr>
-            <th><code>.outline</code></th>
-            <td class="bg-gray"><a class="uniformButton outline">Button</a></td>
-            <td class="bg-gray"><a class="uniformButton green outline">Button</a></td>
-            <td class="bg-gray"><a class="uniformButton blue outline">Button</a></td>
-            <td class="bg-gray"><a class="uniformButton red outline">Button</a></td>
-            <td class="bg-gray"><a class="uniformButton white outline">Button</a></td>
-            <td class="bg-gray"><a class="uniformButton gray outline">Button</a></td>
-        </tr>
-    </table>
-    <h3 class="margin-top-more">uniformButtonGroup</h3>
-    <div class="uniformButtonGroup">
-        <a href="#">Link 1</a>
-        <a href="#">Link 2</a>
-        <a href="#">Link 3</a>
-    </div>
-</div>

data/preview/cards.html.erb DELETED Viewed

@@ -1,23 +0,0 @@
-<div class="section">
-    <h1>Cards</h1>
-    <div class="grid">
-        <div class="col-6">
-            <div class="uniformCard">
-                <div class="uniformCard-header">
-                    <span class="title">Sample Card</span>
-                </div>
-                <div class="uniformCard-body">Put Content In Here</div>
-            </div>
-        </div>
-        <div class="col-6">
-            <% html_block do %>
-<div class="uniformCard">
-    <div class="uniformCard-header">
-        <span class="title">Sample Card</span>
-    </div>
-    <div class="uniformCard-body">Put Content In Here</div>
-</div>
-            <% end %>
-        </div>
-    </div>
-</div>

data/preview/colors.html.erb DELETED Viewed

@@ -1,22 +0,0 @@
-<div class="section">
-    <h1>Colors</h1>
-    <table class="uniformTable">
-        <thead class="dark">
-            <tr>
-                <th></th>
-                <th>sass</th>
-                <th>class</th>
-            </tr>
-        </thead>
-    <% %w(green blue red gray yellow).each do |color| %>
-        <% ["-light", "", "-dark"].each do |style| %>
-            <tr>
-                <td><span class='swatch bg-<%= color %><%= style %>'></span></td>
-                <td><code>$<%= color %><%= style %></code></td>
-                <td><code>.<%= color %><%= style %></code></td>
-            </tr>
-        <% end %>
-        <tr><td colspan='3'>&nbsp;</td></tr>
-    <% end %>
-    </table>
-</div>

data/preview/dropdown.html.erb DELETED Viewed

	@@ -1 +0,0 @@
1	- TODO

data/preview/form.html.erb DELETED Viewed

@@ -1,233 +0,0 @@
-<div class="section">
-    <h1>Forms</h1>
-    <h3>UniformForm</h3>
-    <div class="grid">
-        <div class="col-6">
-            <form class="uniformForm">
-                <div class="form-group">
-                    <label>Name</label>
-                    <input type="text">
-                </div>
-                <div class="form-group" data-error-message="example error message">
-                    <label>Phone</label>
-                    <input type="text">
-                </div>
-                <div class="form-group">
-                    <label>Email</label>
-                    <input type="text">
-                </div>
-            </form>
-        </div>
-        <div class="col-6">
-            <% html_block do %>
-<form class="uniformForm">
-    <div class="form-group">
-        <label>Name</label>
-        <input type="text">
-    </div>
-    <div class="form-group" data-error-message="example error message">
-        <label>Phone</label>
-        <input type="text">
-    </div>
-    <div class="form-group">
-        <label>Email</label>
-        <input type="text">
-    </div>
-</form>
-            <% end %>
-        </div>
-    </div>
-    <div class="grid">
-        <div class="col-6">
-            <form class="uniformForm uniformForm-table">
-                <div class="form-group">
-                    <label>Name</label>
-                    <div>
-                        <input type="text">
-                    </div>
-                </div>
-                <div class="form-group">
-                    <label>Phone</label>
-                    <div>
-                        <div data-error-message="example error message">
-                            <input type="text">
-                        </div>
-                    </div>
-                </div>
-                <div class="form-group">
-                    <label>Email</label>
-                    <div>
-                        <input type="text">
-                    </div>
-                </div>
-            </form>
-        </div>
-        <div class="col-6">
-            <% html_block do %>
-<form class="uniformForm uniformForm-table">
-    <div class="form-group">
-        <label>Name</label>
-        <input type="text">
-    </div>
-    <div class="form-group" data-error-message="example error message">
-        <label>Phone</label>
-        <input type="text">
-    </div>
-    <div class="form-group">
-        <label>Email</label>
-        <input type="text">
-    </div>
-</form>
-            <% end %>
-        </div>
-    </div>
-    <h3>UniformInput</h3>
-    <div class="grid">
-        <div class="col-6">
-            <p><input type="text" class="uniformInput" /></p>
-            <p><input type="text" class="uniformInput large" /></p>
-        </div>
-        <div class="col-6">
-            <% html_block do %>
-                <input type="text" class="uniformInput" />
-            <% end %>
-            <% html_block do %>
-                <input type="text" class="uniformInput large" />
-            <% end %>
-        </div>
-    </div>
-    <h3>Custom Inputs</h3>
-    <div class="grid nest">
-        <div class="col-6">
-            <p>Styled Select Box</p>
-            <p><span class="uniformSelect"><select><option>An Option</option></select></span></p>
-        </div>
-        <div class="col-6">
-            <% html_block do %>
-<span class='uniformSelect'>
-    <select>
-        <option>An Option</option>
-    </select>
-</span>
-            <% end %>
-        </div>
-        <div class="col-6">
-            <p>uniformCheckboxCollection</p>
-            <div class="uniformCheckboxCollection">
-                <label><input type="checkbox"> Option 1</label>
-                <label><input type="checkbox"> Option 2</label>
-                <label><input type="checkbox"> Option 3</label>
-            </div>
-        </div>
-        <div class="col-6">
-            <% html_block do %>
-<div class="uniformCheckboxCollection">
-    <label><input type="checkbox"> Option 1</label>
-    <label><input type="checkbox"> Option 2</label>
-    <label><input type="checkbox"> Option 3</label>
-</div>
-            <% end %>
-        </div>
-        <div class="col-6">
-            <p>uniformCheckboxCollection.inline</p>
-            <div class="uniformCheckboxCollection inline">
-                <label><input type="radio"> Option 1</label>
-                <label><input type="radio"> Option 2</label>
-                <label><input type="radio"> Option 3</label>
-            </div>
-        </div>
-        <div class="col-6">
-            <% html_block do %>
-<div class="uniformCheckboxCollection inline">
-    <label><input type="radio"> Option 1</label>
-    <label><input type="radio"> Option 2</label>
-    <label><input type="radio"> Option 3</label>
-</div>
-            <% end %>
-        </div>
-    </div>
-    <h3>Floating Label</h3>
-    <p>Requires Javascript to fully work, but fails gracefully when not applied.</p>
-    <div class="grid">
-        <div class="col-6">
-            <div class="uniformFloatingLabel">
-                <label for="example-1">Name</label>
-                <input type="text" class="pad-more" id="example-1">
-            </div>
-        </div>
-        <div class="col-6">
-            <% html_block do %>
-<div class="uniformFloatingLabel">
-    <label for="example-1">Name</label>
-    <input type="text" class="pad-more" id="example-1">
-</div>
-            <% end %>
-        </div>
-    </div>
-    <h3>Input Group</h3>
-    <p>Ever want to put in an input and it's label in line, and have it be 100% width responsive? Well, you can't, unless you use something like uniformInputGroup.</p>
-    <div class="grid">
-        <div class="col-6">
-            <div class="uniformInputGroup">
-                <span class="label">
-                    <label for="rate">$</label>
-                </span>
-                <span class="input">
-                    <input id="rate">
-                </span>
-                <span class="units">
-                    <label for="rate">/hour</label>
-                </span>
-            </div>
-        </div>
-        <div class="col-6">
-            <% html_block do %>
-        <div class="uniformInputGroup">
-            <span class="label">
-                <label for="rate">$</label>
-            </span>
-            <span class="input">
-                <input id="rate">
-            </span>
-            <span class="units">
-                <label for="rate">/hour</label>
-            </span>
-        </div>
-            <% end %>
-        </div>
-    </div>
-    <div class="grid">
-        <div class="col-6">
-            <div class="uniformInputGroup">
-                <span class="label">
-                    <label for="car">Car Preference</label>
-                </span>
-                <span>
-                    <input id="name" value="Jonathan Doe" disabled>
-                </span>
-            </div>
-        </div>
-        <div class="col-6">
-            <% html_block do %>
-<div class="uniformInputGroup">
-    <span class="label">
-        <label for="car">Car Preference</label>
-    </span>
-    <span class="input">
-        <input id="name" value="Jonathan Doe" disabled>
-    </span>
-</div>
-            <% end %>
-        </div>
-    </div>
-</div>