From 5608a0cffaa15aaecb9d8a50a25c090830f76c1e Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 23 Mar 2015 23:40:35 -0400
Subject: [PATCH 001/170] Replace reset.scss with normalize.css

Set text-align: left; as default for th element as normalize leaves
browser default of text align center.
---
 .../stylesheets/active_admin/_base.scss       |   4 +-
 .../stylesheets/active_admin/_normalize.css   | 427 ++++++++++++++++++
 .../active_admin/components/_tables.scss      |   5 +-
 .../stylesheets/active_admin/mixins/_all.scss |   1 -
 .../active_admin/mixins/_reset.scss           | 165 -------
 .../stylesheets/active_admin/print.scss       |   5 +-
 6 files changed, 435 insertions(+), 172 deletions(-)
 create mode 100644 app/assets/stylesheets/active_admin/_normalize.css
 delete mode 100644 app/assets/stylesheets/active_admin/mixins/_reset.scss

diff --git a/app/assets/stylesheets/active_admin/_base.scss b/app/assets/stylesheets/active_admin/_base.scss
index 1090137016b..bfa560f4da9 100644
--- a/app/assets/stylesheets/active_admin/_base.scss
+++ b/app/assets/stylesheets/active_admin/_base.scss
@@ -1,6 +1,6 @@
 /* Active Admin CSS */
-// Reset Away!
-@include global-reset;
+// Normalize
+@import "active_admin/normalize";
 
 // Partials
 @import "active_admin/typography";
diff --git a/app/assets/stylesheets/active_admin/_normalize.css b/app/assets/stylesheets/active_admin/_normalize.css
new file mode 100644
index 00000000000..87e37d221b6
--- /dev/null
+++ b/app/assets/stylesheets/active_admin/_normalize.css
@@ -0,0 +1,427 @@
+/*! normalize.css v3.0.2 | MIT License | github.com/necolas/normalize.css */
+
+/**
+ * 1. Set default font family to sans-serif.
+ * 2. Prevent iOS text size adjust after orientation change, without disabling
+ *    user zoom.
+ */
+
+html {
+  font-family: sans-serif; /* 1 */
+  -ms-text-size-adjust: 100%; /* 2 */
+  -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/**
+ * Remove default margin.
+ */
+
+body {
+  margin: 0;
+}
+
+/* HTML5 display definitions
+   ========================================================================== */
+
+/**
+ * Correct `block` display not defined for any HTML5 element in IE 8/9.
+ * Correct `block` display not defined for `details` or `summary` in IE 10/11
+ * and Firefox.
+ * Correct `block` display not defined for `main` in IE 11.
+ */
+
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+menu,
+nav,
+section,
+summary {
+  display: block;
+}
+
+/**
+ * 1. Correct `inline-block` display not defined in IE 8/9.
+ * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
+ */
+
+audio,
+canvas,
+progress,
+video {
+  display: inline-block; /* 1 */
+  vertical-align: baseline; /* 2 */
+}
+
+/**
+ * Prevent modern browsers from displaying `audio` without controls.
+ * Remove excess height in iOS 5 devices.
+ */
+
+audio:not([controls]) {
+  display: none;
+  height: 0;
+}
+
+/**
+ * Address `[hidden]` styling not present in IE 8/9/10.
+ * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
+ */
+
+[hidden],
+template {
+  display: none;
+}
+
+/* Links
+   ========================================================================== */
+
+/**
+ * Remove the gray background color from active links in IE 10.
+ */
+
+a {
+  background-color: transparent;
+}
+
+/**
+ * Improve readability when focused and also mouse hovered in all browsers.
+ */
+
+a:active,
+a:hover {
+  outline: 0;
+}
+
+/* Text-level semantics
+   ========================================================================== */
+
+/**
+ * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
+ */
+
+abbr[title] {
+  border-bottom: 1px dotted;
+}
+
+/**
+ * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
+ */
+
+b,
+strong {
+  font-weight: bold;
+}
+
+/**
+ * Address styling not present in Safari and Chrome.
+ */
+
+dfn {
+  font-style: italic;
+}
+
+/**
+ * Address variable `h1` font-size and margin within `section` and `article`
+ * contexts in Firefox 4+, Safari, and Chrome.
+ */
+
+h1 {
+  font-size: 2em;
+  margin: 0.67em 0;
+}
+
+/**
+ * Address styling not present in IE 8/9.
+ */
+
+mark {
+  background: #ff0;
+  color: #000;
+}
+
+/**
+ * Address inconsistent and variable font size in all browsers.
+ */
+
+small {
+  font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` affecting `line-height` in all browsers.
+ */
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sup {
+  top: -0.5em;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+/* Embedded content
+   ========================================================================== */
+
+/**
+ * Remove border when inside `a` element in IE 8/9/10.
+ */
+
+img {
+  border: 0;
+}
+
+/**
+ * Correct overflow not hidden in IE 9/10/11.
+ */
+
+svg:not(:root) {
+  overflow: hidden;
+}
+
+/* Grouping content
+   ========================================================================== */
+
+/**
+ * Address margin not present in IE 8/9 and Safari.
+ */
+
+figure {
+  margin: 1em 40px;
+}
+
+/**
+ * Address differences between Firefox and other browsers.
+ */
+
+hr {
+  -moz-box-sizing: content-box;
+  box-sizing: content-box;
+  height: 0;
+}
+
+/**
+ * Contain overflow in all browsers.
+ */
+
+pre {
+  overflow: auto;
+}
+
+/**
+ * Address odd `em`-unit font size rendering in all browsers.
+ */
+
+code,
+kbd,
+pre,
+samp {
+  font-family: monospace, monospace;
+  font-size: 1em;
+}
+
+/* Forms
+   ========================================================================== */
+
+/**
+ * Known limitation: by default, Chrome and Safari on OS X allow very limited
+ * styling of `select`, unless a `border` property is set.
+ */
+
+/**
+ * 1. Correct color not being inherited.
+ *    Known issue: affects color of disabled elements.
+ * 2. Correct font properties not being inherited.
+ * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  color: inherit; /* 1 */
+  font: inherit; /* 2 */
+  margin: 0; /* 3 */
+}
+
+/**
+ * Address `overflow` set to `hidden` in IE 8/9/10/11.
+ */
+
+button {
+  overflow: visible;
+}
+
+/**
+ * Address inconsistent `text-transform` inheritance for `button` and `select`.
+ * All other form control elements do not inherit `text-transform` values.
+ * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
+ * Correct `select` style inheritance in Firefox.
+ */
+
+button,
+select {
+  text-transform: none;
+}
+
+/**
+ * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
+ *    and `video` controls.
+ * 2. Correct inability to style clickable `input` types in iOS.
+ * 3. Improve usability and consistency of cursor style between image-type
+ *    `input` and others.
+ */
+
+button,
+html input[type="button"], /* 1 */
+input[type="reset"],
+input[type="submit"] {
+  -webkit-appearance: button; /* 2 */
+  cursor: pointer; /* 3 */
+}
+
+/**
+ * Re-set default cursor for disabled elements.
+ */
+
+button[disabled],
+html input[disabled] {
+  cursor: default;
+}
+
+/**
+ * Remove inner padding and border in Firefox 4+.
+ */
+
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+  border: 0;
+  padding: 0;
+}
+
+/**
+ * Address Firefox 4+ setting `line-height` on `input` using `!important` in
+ * the UA stylesheet.
+ */
+
+input {
+  line-height: normal;
+}
+
+/**
+ * It's recommended that you don't attempt to style these elements.
+ * Firefox's implementation doesn't respect box-sizing, padding, or width.
+ *
+ * 1. Address box sizing set to `content-box` in IE 8/9/10.
+ * 2. Remove excess padding in IE 8/9/10.
+ */
+
+input[type="checkbox"],
+input[type="radio"] {
+  box-sizing: border-box; /* 1 */
+  padding: 0; /* 2 */
+}
+
+/**
+ * Fix the cursor style for Chrome's increment/decrement buttons. For certain
+ * `font-size` values of the `input`, it causes the cursor style of the
+ * decrement button to change from `default` to `text`.
+ */
+
+input[type="number"]::-webkit-inner-spin-button,
+input[type="number"]::-webkit-outer-spin-button {
+  height: auto;
+}
+
+/**
+ * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
+ * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
+ *    (include `-moz` to future-proof).
+ */
+
+input[type="search"] {
+  -webkit-appearance: textfield; /* 1 */
+  -moz-box-sizing: content-box;
+  -webkit-box-sizing: content-box; /* 2 */
+  box-sizing: content-box;
+}
+
+/**
+ * Remove inner padding and search cancel button in Safari and Chrome on OS X.
+ * Safari (but not Chrome) clips the cancel button when the search input has
+ * padding (and `textfield` appearance).
+ */
+
+input[type="search"]::-webkit-search-cancel-button,
+input[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+/**
+ * Define consistent border, margin, and padding.
+ */
+
+fieldset {
+  border: 1px solid #c0c0c0;
+  margin: 0 2px;
+  padding: 0.35em 0.625em 0.75em;
+}
+
+/**
+ * 1. Correct `color` not being inherited in IE 8/9/10/11.
+ * 2. Remove padding so people aren't caught out if they zero out fieldsets.
+ */
+
+legend {
+  border: 0; /* 1 */
+  padding: 0; /* 2 */
+}
+
+/**
+ * Remove default vertical scrollbar in IE 8/9/10/11.
+ */
+
+textarea {
+  overflow: auto;
+}
+
+/**
+ * Don't inherit the `font-weight` (applied by a rule above).
+ * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
+ */
+
+optgroup {
+  font-weight: bold;
+}
+
+/* Tables
+   ========================================================================== */
+
+/**
+ * Remove most spacing between table cells.
+ */
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+td,
+th {
+  padding: 0;
+}
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 29bd4337d4f..f2634ed45c9 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -5,6 +5,10 @@ table tr {
   td {
     vertical-align: top;
   }
+
+  th {
+    text-align: left;
+  }
 }
 
 // --------- Index Tables
@@ -18,7 +22,6 @@ table.index_table {
   th {
     @include section-header;
     border-right: none;
-    text-align: left;
     padding-left: $cell-horizontal-padding;
     padding-right: $cell-horizontal-padding;
 
diff --git a/app/assets/stylesheets/active_admin/mixins/_all.scss b/app/assets/stylesheets/active_admin/mixins/_all.scss
index 81a65a04076..84e764a3009 100644
--- a/app/assets/stylesheets/active_admin/mixins/_all.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_all.scss
@@ -1,5 +1,4 @@
 @import "active_admin/mixins/variables";
-@import "active_admin/mixins/reset";
 @import "active_admin/mixins/gradients";
 @import "active_admin/mixins/shadows";
 @import "active_admin/mixins/rounded";
diff --git a/app/assets/stylesheets/active_admin/mixins/_reset.scss b/app/assets/stylesheets/active_admin/mixins/_reset.scss
deleted file mode 100644
index 7b89b89b278..00000000000
--- a/app/assets/stylesheets/active_admin/mixins/_reset.scss
+++ /dev/null
@@ -1,165 +0,0 @@
-// FROM The Compass Framework (compass-style.org)
-//
-// Copyright (c) 2009 Christopher M. Eppstein
-//
-// Permission is hereby granted, free of charge, to any person obtaining a copy of
-// this software and associated documentation files (the "Software"), to deal in
-// the Software without restriction, including without limitation the rights to
-// use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
-// the Software, and to permit persons to whom the Software is furnished to do so,
-// subject to the following conditions:
-//
-// The above copyright notice and this permission notice shall be included in all
-// copies or substantial portions of the Software. No attribution is required by
-// products that make use of this software.
-//
-// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
-// FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
-// COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
-// IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
-// CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
-//
-// Except as contained in this notice, the name(s) of the above copyright holders
-// shall not be used in advertising or otherwise to promote the sale, use or other
-// dealings in this Software without prior written authorization.
-//
-// Contributors to this project agree to grant all rights to the copyright holder
-// of the primary product. Attribution is maintained in the source control history
-// of the product.
-//
-// Based on [Eric Meyer's reset](http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/)
-// Global reset rules.
-// For more specific resets, use the reset mixins provided below
-//
-// *Please Note*: tables still need `cellspacing="0"` in the markup.
-@mixin global-reset {
-  html, body, div, span, applet, object, iframe,
-  h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-  a, abbr, acronym, address, big, cite, code,
-  del, dfn, em, font, img, ins, kbd, q, s, samp,
-  small, strike, strong, sub, sup, tt, var,
-  dl, dt, dd, ol, ul, li,
-  fieldset, form, label, legend,
-  table, caption, tbody, tfoot, thead, tr, th, td {
-    @include reset-box-model;
-    @include reset-font; }
-  body {
-    @include reset-body; }
-  ol, ul {
-    @include reset-list-style; }
-  table {
-    @include reset-table; }
-  caption, th, td {
-    @include reset-table-cell; }
-  q, blockquote {
-    @include reset-quotation; }
-  a img {
-    @include reset-image-anchor-border; } }
-
-// Reset all elements within some selector scope. To reset the selector itself,
-// mixin the appropriate reset mixin for that element type as well. This could be
-// useful if you want to style a part of your page in a dramatically different way.
-//
-// *Please Note*: tables still need `cellspacing="0"` in the markup.
-@mixin nested-reset {
-  div, span, object, iframe, h1, h2, h3, h4, h5, h6, p,
-  pre, a, abbr, acronym, address, code, del, dfn, em, img,
-  dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, thead, tr {
-    @include reset-box-model;
-    @include reset-font; }
-  table {
-    @include reset-table; }
-  caption, th, td {
-    @include reset-table-cell; }
-  q, blockquote {
-    @include reset-quotation; }
-  a img {
-    @include reset-image-anchor-border; } }
-
-// Reset the box model measurements.
-@mixin reset-box-model {
-  margin: 0;
-  padding: 0;
-  border: 0;
-  outline: 0; }
-
-// Reset the font and vertical alignment.
-@mixin reset-font {
-  font: {
-    weight: inherit;
-    style: inherit;
-    size: 100%;
-    family: inherit; };
-  vertical-align: baseline; }
-
-// Resets the outline when focus.
-// For accessibility you need to apply some styling in its place.
-@mixin reset-focus {
-  outline: 0; }
-
-// Reset a body element.
-@mixin reset-body {
-  line-height: 1;
-  color: black;
-  background: white; }
-
-// Reset the list style of an element.
-@mixin reset-list-style {
-  list-style: none; }
-
-// Reset a table
-@mixin reset-table {
-  border-collapse: separate;
-  border-spacing: 0;
-  vertical-align: middle; }
-
-// Reset a table cell (`th`, `td`)
-@mixin reset-table-cell {
-  text-align: left;
-  font-weight: normal;
-  vertical-align: middle; }
-
-// Reset a quotation (`q`, `blockquote`)
-@mixin reset-quotation {
-  quotes: "" "";
-  &:before, &:after {
-    content: ""; } }
-
-// Resets the border.
-@mixin reset-image-anchor-border {
-  border: none; }
-
-// Unrecognized elements are displayed inline.
-// This reset provides a basic reset for html5 elements
-// so they are rendered correctly in browsers that don't recognize them
-// and reset in browsers that have default styles for them.
-@mixin reset-html5 {
-  article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
-    @include reset-box-model;
-    display: block; } }
-
-// Resets the display of inline and block elements to their default display
-// according to their tag type. Elements that have a default display that varies across
-// versions of html or browser are not handled here, but this covers the 90% use case.
-// Usage Example:
-//
-//     // Turn off the display for both of these classes
-//     .unregistered-only, .registered-only
-//       display: none
-//     // Now turn only one of them back on depending on some other context.
-//     body.registered
-//       +reset-display(".registered-only")
-//     body.unregistered
-//       +reset-display(".unregistered-only")
-@mixin reset-display($selector: "", $important: false) {
-  #{append-selector(elements-of-type("inline"), $selector)} {
-    @if $important {
-      display: inline !important; }
-    @else {
-      display: inline; } }
-  #{append-selector(elements-of-type("block"), $selector)} {
-    @if $important {
-      display: block !important; }
-    @else {
-      display: block; } } }
diff --git a/app/assets/stylesheets/active_admin/print.scss b/app/assets/stylesheets/active_admin/print.scss
index 338007cfef6..91209eb5419 100644
--- a/app/assets/stylesheets/active_admin/print.scss
+++ b/app/assets/stylesheets/active_admin/print.scss
@@ -4,9 +4,8 @@
 $primary-color: black;
 $text-color: black;
 
-// Reset
-@import "active_admin/mixins/reset";
-@include global-reset;
+// Normalize
+@import "active_admin/normalize";
 
 // Partials
 @import "active_admin/typography";

From df6fa9fa83c0e8c4eb85d900b400a047c66a86db Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 23 Mar 2015 23:44:36 -0400
Subject: [PATCH 002/170] Remove text shadows

---
 app/assets/stylesheets/active_admin/_header.scss              | 1 -
 .../stylesheets/active_admin/components/_date_picker.scss     | 1 -
 .../stylesheets/active_admin/components/_dropdown_menu.scss   | 1 -
 .../stylesheets/active_admin/components/_flash_messages.scss  | 2 --
 app/assets/stylesheets/active_admin/components/_tables.scss   | 2 --
 app/assets/stylesheets/active_admin/mixins/_buttons.scss      | 2 --
 app/assets/stylesheets/active_admin/mixins/_sections.scss     | 1 -
 app/assets/stylesheets/active_admin/mixins/_shadows.scss      | 4 ----
 app/assets/stylesheets/active_admin/pages/_logged_out.scss    | 1 -
 9 files changed, 15 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index 1dd9d68eff3..04c49e9b332 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -4,7 +4,6 @@
 #header {
   @include primary-gradient;
   @include shadow;
-  @include text-shadow(#000);
   display: table;
   height: 20px;
   width: 100%;
diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index 185fa5b9d7b..53d62c5f192 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -40,7 +40,6 @@
     }
 
     .ui-datepicker-title {
-      @include text-shadow(#000);
       color: #fff;
       display: block;
       font-size: 1.1em;
diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index dc417f4fab3..b5a4792c586 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -120,7 +120,6 @@
 
           &:hover {
             @include highlight-gradient;
-            @include text-shadow(#5a83aa);
             color: #FFF;
           }
 
diff --git a/app/assets/stylesheets/active_admin/components/_flash_messages.scss b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
index 53e73f57d32..2ae8ff05a98 100644
--- a/app/assets/stylesheets/active_admin/components/_flash_messages.scss
+++ b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
@@ -1,7 +1,6 @@
 body.logged_in {
   .flash {
     @include gradient(#f7f1d3, #f5edc5);
-    @include text-shadow(#fafafa);
     border-bottom: 1px solid #eee098;
     color: #cb9810;
     font-weight: bold;
@@ -26,7 +25,6 @@ body.logged_in {
 body.logged_out {
   .flash {
     @include no-shadow;
-    @include text-shadow(#fff);
     background: none;
     color: #666;
     font-weight: bold;
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index f2634ed45c9..c2f1374d743 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -71,7 +71,6 @@ table.index_table {
     background: none;
     color: $primary-color;
     @include no-shadow;
-    @include text-shadow;
     text-transform: uppercase;
     border-bottom: 1px solid #ccc;
   }
@@ -98,7 +97,6 @@ table.index_table {
     padding-left: 0;
     text-transform: uppercase;
     color: $primary-color;
-    @include text-shadow;
   }
   td {
     .empty {
diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index efb9462d66d..ce01cfdcb4d 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -19,7 +19,6 @@
 @mixin default-button {
   @include basic-button;
   @include gradient(lighten($primary-color, 15%), darken($primary-color, 12%));
-  @include text-shadow(#000);
   box-shadow: 0 1px 1px rgba(0,0,0,0.10), 0 1px 0 0px rgba(255,255,255, 0.2) inset;
   border: solid 1px #484e53;
   @include border-colors(#616a71, #484e53, #363b3f);
@@ -43,7 +42,6 @@
   box-shadow: 0 1px 1px rgba(0,0,0,0.10), 0 1px 0 0 rgba(255,255,255, 0.8) inset;
   border: solid 1px #c7c7c7;
   @include border-colors(#d3d3d3, #c7c7c7, #c2c2c2);
-  @include text-shadow;
   color: $primary-color;
 
   &:not(.disabled) {
diff --git a/app/assets/stylesheets/active_admin/mixins/_sections.scss b/app/assets/stylesheets/active_admin/mixins/_sections.scss
index f34d78b0639..7eecebe79f7 100644
--- a/app/assets/stylesheets/active_admin/mixins/_sections.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_sections.scss
@@ -1,6 +1,5 @@
 @mixin section-header {
   @include secondary-gradient;
-  @include text-shadow;
   border: solid 1px #cdcdcd;
   @include border-colors(#e6e6e6, #d4d4d4, #cdcdcd);
   box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 0 1px #FFF inset;
diff --git a/app/assets/stylesheets/active_admin/mixins/_shadows.scss b/app/assets/stylesheets/active_admin/mixins/_shadows.scss
index e366bf0ad46..912f638bb97 100644
--- a/app/assets/stylesheets/active_admin/mixins/_shadows.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_shadows.scss
@@ -9,7 +9,3 @@
 @mixin inset-shadow($x: 0, $y: 1px, $blur: 2px, $color: #aaa) {
   box-shadow: inset $x $y $blur $color;
 }
-
-@mixin text-shadow($color: #fff, $x: 0, $y: 1px, $blur: 0) {
-  text-shadow: $color $x $y $blur;
-}
diff --git a/app/assets/stylesheets/active_admin/pages/_logged_out.scss b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
index cb8c3b58673..511bd2f5b3b 100644
--- a/app/assets/stylesheets/active_admin/pages/_logged_out.scss
+++ b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
@@ -14,7 +14,6 @@ body.logged_out {
   h2 {
     @include section-header;
     @include primary-gradient;
-    @include text-shadow(#000);
     box-shadow: 0 1px 3px rgba(0,0,0,0.3);
     border: none;
     color: #fff;

From e204d718f9a6e085060928459c869e45b290e5c5 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 24 Mar 2015 00:27:16 -0400
Subject: [PATCH 003/170] =?UTF-8?q?Need=20to=20find=20out=20where=20popove?=
 =?UTF-8?q?r,=20modal=20dialogs=20and=20sub=20tab=20header=20styles=20are?=
 =?UTF-8?q?=20used.=20I=E2=80=99ve=20seen=20dropdown=5Fmenu=20but=20not=20?=
 =?UTF-8?q?popover=20yet=20so=20leaving=20those=20shadows=20in=20place.=20?=
 =?UTF-8?q?Dropdown=20menu=20had=20box-shadow=20applied=20twice=20but=20on?=
 =?UTF-8?q?ly=20the=20wrapper=20needs=20it.=20The=20date=20picker=20had=20?=
 =?UTF-8?q?the=20box-shadow=20on=20the=20wrong=20element=20but=20needs=20o?=
 =?UTF-8?q?ther=20fixes=20(need=20to=20set=20box-sizing=20border-box=20glo?=
 =?UTF-8?q?bally).=20The=20shadows=20we=20do=20keep,=20just=20use=20a=20pl?=
 =?UTF-8?q?ain=20style,=20no=20extra=20benefit=20from=20using=20a=20mixin?=
 =?UTF-8?q?=20(at=20least=20not=20yet).=20Rather=20have=20everything=20inl?=
 =?UTF-8?q?ine=20and=20start=20to=20use=20variables=20specific=20to=20each?=
 =?UTF-8?q?=20component=20to=20make=20customizing=20easier.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/assets/stylesheets/active_admin/_forms.scss       |  2 +-
 app/assets/stylesheets/active_admin/_header.scss      |  1 -
 .../active_admin/components/_comments.scss            |  1 -
 .../active_admin/components/_date_picker.scss         |  3 ---
 .../active_admin/components/_dropdown_menu.scss       |  3 +--
 .../active_admin/components/_flash_messages.scss      |  1 -
 .../active_admin/components/_table_tools.scss         |  2 --
 .../stylesheets/active_admin/components/_tables.scss  |  2 --
 .../stylesheets/active_admin/components/_tabs.scss    |  1 -
 app/assets/stylesheets/active_admin/mixins/_all.scss  |  1 -
 .../stylesheets/active_admin/mixins/_buttons.scss     |  4 ----
 .../stylesheets/active_admin/mixins/_sections.scss    |  2 --
 .../stylesheets/active_admin/mixins/_shadows.scss     | 11 -----------
 .../stylesheets/active_admin/pages/_logged_out.scss   |  3 ---
 .../active_admin/structure/_title_bar.scss            |  2 --
 15 files changed, 2 insertions(+), 37 deletions(-)
 delete mode 100644 app/assets/stylesheets/active_admin/mixins/_shadows.scss

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 93832db678c..30ef8a70539 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -136,7 +136,7 @@ form {
 
     &:focus {
       border: $border-width solid #99a2aa;
-      @include shadow(0,0,4px,#99a2aa);
+      box-shadow: 0 0 4px #99a2aa;
     }
   }
 
diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index 04c49e9b332..3d2c721fc72 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -3,7 +3,6 @@
 // ----------------------------------- Header
 #header {
   @include primary-gradient;
-  @include shadow;
   display: table;
   height: 20px;
   width: 100%;
diff --git a/app/assets/stylesheets/active_admin/components/_comments.scss b/app/assets/stylesheets/active_admin/components/_comments.scss
index f8862670e30..22743e76fdc 100644
--- a/app/assets/stylesheets/active_admin/components/_comments.scss
+++ b/app/assets/stylesheets/active_admin/components/_comments.scss
@@ -33,7 +33,6 @@
       margin: 0;
       padding: 0;
       background: none;
-      @include no-shadow;
     }
     li { padding: 0; }
     fieldset.buttons { padding: 0; margin-top: 5px;}
diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index 53d62c5f192..788fd5a1e27 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -1,7 +1,5 @@
 // -------------------------------------- Date Picker
 .ui-datepicker {
-  background: #fff;
-  background-clip: padding-box;
   color: #fff;
   display: none;
   margin-top: 2px;
@@ -90,7 +88,6 @@
 
   table.ui-datepicker-calendar {
     @include rounded-bottom;
-    @include shadow(0,1px,6px,rgba(0,0,0,0.26));
     background-color: #f4f4f4;
     border: solid 1px #63686e;
     left: 2px;
diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index b5a4792c586..d9dfbd7d758 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -80,7 +80,7 @@
     position: absolute;
     background-color: white;
     padding: 2px;
-    box-shadow: rgba(0,0,0,0.4) 0 1px 3px, lighten($primary-color, 15%) 0px 1px 0px 0px inset;
+    box-shadow: rgba(0,0,0,0.4) 0 1px 3px;
     background-color: $primary-color;
     @include gradient(lighten($primary-color, 4%), darken($primary-color, 5%));
     border: solid 1px darken($primary-color, 10%);
@@ -94,7 +94,6 @@
       display: block;
       background-color: #FFF;
       border: solid 1px darken($primary-color, 10%);
-      box-shadow: lighten($primary-color, 5%) 0px 1px 0px 0px;
       border-radius: 3px;
       margin: 0;
       overflow: hidden;
diff --git a/app/assets/stylesheets/active_admin/components/_flash_messages.scss b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
index 2ae8ff05a98..f438af01f89 100644
--- a/app/assets/stylesheets/active_admin/components/_flash_messages.scss
+++ b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
@@ -24,7 +24,6 @@ body.logged_in {
 
 body.logged_out {
   .flash {
-    @include no-shadow;
     background: none;
     color: #666;
     font-weight: bold;
diff --git a/app/assets/stylesheets/active_admin/components/_table_tools.scss b/app/assets/stylesheets/active_admin/components/_table_tools.scss
index 1b5e430c9a4..be72735c9b2 100644
--- a/app/assets/stylesheets/active_admin/components/_table_tools.scss
+++ b/app/assets/stylesheets/active_admin/components/_table_tools.scss
@@ -22,7 +22,6 @@ a.table_tools_button, .table_tools .dropdown_menu_button {
 
     &:active {
       @include border-colors(#d7d7d7, #c8c8c8, #c3c3c3);
-      box-shadow: 0 1px 1px 0 rgba(0,0,0,0.17) inset;
       @include gradient(#FFFFFF, #E8E8E8);
     }
   }
@@ -55,7 +54,6 @@ a.table_tools_button, .table_tools .dropdown_menu_button {
 
     &.selected a {
       @include gradient(#F0F0F0, #FDFDFD);
-      box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1) inset;
       cursor: default;
 
       &:hover {
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index c2f1374d743..79ba6a68234 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -70,7 +70,6 @@ table.index_table {
     padding-top: 10px;
     background: none;
     color: $primary-color;
-    @include no-shadow;
     text-transform: uppercase;
     border-bottom: 1px solid #ccc;
   }
@@ -90,7 +89,6 @@ table.index_table {
     border-bottom: 1px solid #e8e8e8;
   }
   th {
-    @include no-shadow;
     @include no-gradient;
     width: 150px;
     font-size: 0.9em;
diff --git a/app/assets/stylesheets/active_admin/components/_tabs.scss b/app/assets/stylesheets/active_admin/components/_tabs.scss
index a79818d1432..a39bbb535da 100644
--- a/app/assets/stylesheets/active_admin/components/_tabs.scss
+++ b/app/assets/stylesheets/active_admin/components/_tabs.scss
@@ -47,7 +47,6 @@
       a {
         cursor: default;
         @include gradient(#F0F0F0, #FDFDFD);
-        box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1) inset;
 
         a:hover {
           @include gradient(#F0F0F0, #FDFDFD);
diff --git a/app/assets/stylesheets/active_admin/mixins/_all.scss b/app/assets/stylesheets/active_admin/mixins/_all.scss
index 84e764a3009..864727b1c37 100644
--- a/app/assets/stylesheets/active_admin/mixins/_all.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_all.scss
@@ -1,6 +1,5 @@
 @import "active_admin/mixins/variables";
 @import "active_admin/mixins/gradients";
-@import "active_admin/mixins/shadows";
 @import "active_admin/mixins/rounded";
 @import "active_admin/mixins/buttons";
 @import "active_admin/mixins/sections";
diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index ce01cfdcb4d..fd03524409a 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -19,7 +19,6 @@
 @mixin default-button {
   @include basic-button;
   @include gradient(lighten($primary-color, 15%), darken($primary-color, 12%));
-  box-shadow: 0 1px 1px rgba(0,0,0,0.10), 0 1px 0 0px rgba(255,255,255, 0.2) inset;
   border: solid 1px #484e53;
   @include border-colors(#616a71, #484e53, #363b3f);
   color: #efefef;
@@ -30,7 +29,6 @@
     }
 
     &:active {
-      box-shadow: 0 1px 3px rgba(0,0,0,0.40) inset, 0 1px 0 0px #FFF;
       @include gradient(lighten($primary-color, 8%), darken($primary-color, 17%));
     }
   }
@@ -39,7 +37,6 @@
 @mixin light-button {
   @include basic-button;
   @include gradient(#FFFFFF, #E7E7E7);
-  box-shadow: 0 1px 1px rgba(0,0,0,0.10), 0 1px 0 0 rgba(255,255,255, 0.8) inset;
   border: solid 1px #c7c7c7;
   @include border-colors(#d3d3d3, #c7c7c7, #c2c2c2);
   color: $primary-color;
@@ -50,7 +47,6 @@
     }
 
     &:active {
-      box-shadow: 0 1px 2px rgba(0,0,0,0.22) inset, 0 1px 0 0px #EEE;
       @include border-colors(#c2c2c2, #b9b9b9, #b7b7b7);
       @include gradient(#F3F3F3, #D8D8D8);
     }
diff --git a/app/assets/stylesheets/active_admin/mixins/_sections.scss b/app/assets/stylesheets/active_admin/mixins/_sections.scss
index 7eecebe79f7..8230ba66223 100644
--- a/app/assets/stylesheets/active_admin/mixins/_sections.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_sections.scss
@@ -2,7 +2,6 @@
   @include secondary-gradient;
   border: solid 1px #cdcdcd;
   @include border-colors(#e6e6e6, #d4d4d4, #cdcdcd);
-  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 0 1px #FFF inset;
 
   font-size: 1em;
   font-weight: bold;
@@ -16,7 +15,6 @@
 @mixin section-background {
   background: #f4f4f4;
   @include rounded(4px);
-  @include inset-shadow(0,1px,4px, #ddd);
 }
 
 @mixin section {
diff --git a/app/assets/stylesheets/active_admin/mixins/_shadows.scss b/app/assets/stylesheets/active_admin/mixins/_shadows.scss
deleted file mode 100644
index 912f638bb97..00000000000
--- a/app/assets/stylesheets/active_admin/mixins/_shadows.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-@mixin shadow($x: 0, $y: 1px, $blur: 2px, $color: rgba(0,0,0,0.37)) {
-  box-shadow: $x $y $blur $color;
-}
-
-@mixin no-shadow {
-  box-shadow: none;
-}
-
-@mixin inset-shadow($x: 0, $y: 1px, $blur: 2px, $color: #aaa) {
-  box-shadow: inset $x $y $blur $color;
-}
diff --git a/app/assets/stylesheets/active_admin/pages/_logged_out.scss b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
index 511bd2f5b3b..9f871513021 100644
--- a/app/assets/stylesheets/active_admin/pages/_logged_out.scss
+++ b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
@@ -5,7 +5,6 @@ body.logged_out {
     width: 500px;
     margin: 70px auto;
     #active_admin_content {
-      @include shadow;
       background: #fff;
       padding: 13px 30px;
     }
@@ -14,7 +13,6 @@ body.logged_out {
   h2 {
     @include section-header;
     @include primary-gradient;
-    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
     border: none;
     color: #fff;
     margin: -13px -30px 20px -30px;
@@ -24,7 +22,6 @@ body.logged_out {
     /* Login Form */
     form {
       fieldset {
-        @include no-shadow;
         background: none;
         padding: 0;
         li { padding: 10px 0; }
diff --git a/app/assets/stylesheets/active_admin/structure/_title_bar.scss b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
index 61b634c75e1..1bf87494810 100644
--- a/app/assets/stylesheets/active_admin/structure/_title_bar.scss
+++ b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
@@ -2,9 +2,7 @@
   @include section-header;
   @include clearfix;
   box-sizing: border-box;
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.37);
   display: table;
-  border-bottom-color: #EEE;
   width: 100%;
   position: relative;
   margin: 0;

From f93f908a4db516152c50d62b5c53414b7656a281 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 24 Mar 2015 00:55:20 -0400
Subject: [PATCH 004/170] Replace gradients with simple backgrounds
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Leave gradients on buttons for now as that’s a bigger change I’ll
tackle next. Also removed styles that aren’t necessary as they have no
effect.
---
 app/assets/stylesheets/active_admin/_header.scss    |  6 +++---
 .../active_admin/components/_flash_messages.scss    | 13 +++----------
 .../active_admin/components/_tables.scss            |  5 ++---
 .../stylesheets/active_admin/mixins/_gradients.scss |  4 ----
 .../stylesheets/active_admin/mixins/_sections.scss  | 13 ++++---------
 .../stylesheets/active_admin/pages/_logged_out.scss |  4 ++--
 6 files changed, 14 insertions(+), 31 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index 3d2c721fc72..cb28a43d77e 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -2,7 +2,7 @@
 //= depend_on_asset "active_admin/nested_menu_arrow_dark.gif"
 // ----------------------------------- Header
 #header {
-  @include primary-gradient;
+  background-color: lighten($primary-color, 5%);
   display: table;
   height: 20px;
   width: 100%;
@@ -61,10 +61,10 @@
       position: relative;
 
       a {
+        border-radius: 4px;
         text-decoration: none;
         padding: 6px 10px 4px 10px;
         position: relative;
-        @include rounded(10px);
       }
 
       &.current > a {
@@ -101,7 +101,7 @@
       ul {
         background: $hover-menu-item-background;
         @include rounded-all(0,10px,10px,10px);
-        @include shadow(0, 1px, 3px, #444);
+        box-shadow: 0 1px 3px #444;
         position: absolute;
         width: 120%;
         min-width: 175px;
diff --git a/app/assets/stylesheets/active_admin/components/_flash_messages.scss b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
index f438af01f89..02b112ba22e 100644
--- a/app/assets/stylesheets/active_admin/components/_flash_messages.scss
+++ b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
@@ -1,22 +1,18 @@
 body.logged_in {
   .flash {
-    @include gradient(#f7f1d3, #f5edc5);
-    border-bottom: 1px solid #eee098;
+    background-color: #f7f1d3;
     color: #cb9810;
     font-weight: bold;
     font-size: 1.1em;
-    line-height: 1.0em;
     padding: 13px 30px 11px;
     position: relative;
 
     &.flash_notice {
-      @include gradient(#dce9dd, #ccdfcd);
-      border-bottom: 1px solid #adcbaf;
+      background-color: #ccdfcd;
       color: #416347;
     }
     &.flash_error {
-      @include gradient(#f5e4e4, #f1dcdc);
-      border-bottom: 1px solid #e0c2c0;
+      background-color: #f1dcdc;
       color: #b33c33;
     }
   }
@@ -24,11 +20,8 @@ body.logged_in {
 
 body.logged_out {
   .flash {
-    background: none;
     color: #666;
     font-weight: bold;
-    line-height: 1.0em;
-    padding: 0;
     margin-bottom: 8px;
   }
 }
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 79ba6a68234..4870ac1e4f5 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -20,7 +20,7 @@ table.index_table {
   border-spacing: 0;
 
   th {
-    @include section-header;
+    background-color: #e9e9e9;
     border-right: none;
     padding-left: $cell-horizontal-padding;
     padding-right: $cell-horizontal-padding;
@@ -40,7 +40,7 @@ table.index_table {
     &.sorted-desc a {  background-position: 0 -56px;}
 
     &.sorted-asc, &.sorted-desc {
-      @include gradient(darken($secondary-gradient-start, 5%), darken($secondary-gradient-stop, 5%));
+      background-color: darken($secondary-gradient-stop, 5%);
     }
 
     &:last-child {
@@ -89,7 +89,6 @@ table.index_table {
     border-bottom: 1px solid #e8e8e8;
   }
   th {
-    @include no-gradient;
     width: 150px;
     font-size: 0.9em;
     padding-left: 0;
diff --git a/app/assets/stylesheets/active_admin/mixins/_gradients.scss b/app/assets/stylesheets/active_admin/mixins/_gradients.scss
index 1bf3777a485..b8941107462 100644
--- a/app/assets/stylesheets/active_admin/mixins/_gradients.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_gradients.scss
@@ -22,7 +22,3 @@ $secondary-gradient-stop: #dfe1e2 !default;
 @mixin reverse-highlight-gradient {
   @include gradient(#608cb4, #75a1c2);
 }
-
-@mixin no-gradient {
-  background-color: none;
-}
diff --git a/app/assets/stylesheets/active_admin/mixins/_sections.scss b/app/assets/stylesheets/active_admin/mixins/_sections.scss
index 8230ba66223..2e131ee7deb 100644
--- a/app/assets/stylesheets/active_admin/mixins/_sections.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_sections.scss
@@ -1,20 +1,15 @@
 @mixin section-header {
-  @include secondary-gradient;
-  border: solid 1px #cdcdcd;
-  @include border-colors(#e6e6e6, #d4d4d4, #cdcdcd);
-
+  background-color: #e9e9e9;
+  border-radius: 4px 4px 0 0;
   font-size: 1em;
   font-weight: bold;
-  line-height: 18px;
-  margin-bottom: 0.5em;
   color: $section-header-text-color;
-
   padding: 5px 10px 3px 10px;
 }
 
 @mixin section-background {
-  background: #f4f4f4;
-  @include rounded(4px);
+  background-color: #f8f8f8;
+  border-radius: 4px;
 }
 
 @mixin section {
diff --git a/app/assets/stylesheets/active_admin/pages/_logged_out.scss b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
index 9f871513021..ede936f470b 100644
--- a/app/assets/stylesheets/active_admin/pages/_logged_out.scss
+++ b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
@@ -6,14 +6,14 @@ body.logged_out {
     margin: 70px auto;
     #active_admin_content {
       background: #fff;
+      border-radius: 4px;
       padding: 13px 30px;
     }
   }
 
   h2 {
     @include section-header;
-    @include primary-gradient;
-    border: none;
+    background-color: darken($primary-color, 7%);
     color: #fff;
     margin: -13px -30px 20px -30px;
   }

From 8a75207cb25a52e8977fce4893968cc571bb05fa Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 24 Mar 2015 02:02:04 -0400
Subject: [PATCH 005/170] Remove unused .ui-tabs-nav selector

---
 .../active_admin/components/_tabs.scss        | 60 +------------------
 1 file changed, 1 insertion(+), 59 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_tabs.scss b/app/assets/stylesheets/active_admin/components/_tabs.scss
index a39bbb535da..7f86699c9c9 100644
--- a/app/assets/stylesheets/active_admin/components/_tabs.scss
+++ b/app/assets/stylesheets/active_admin/components/_tabs.scss
@@ -1,64 +1,6 @@
-.ui-tabs-nav {
-  list-style: none;
-  display: block;
-  width: auto;
-  margin-bottom: -12px;
-  padding-left: 0;
-  overflow: auto;
-  margin-left: 15px;
-
-  li {
-    display: block;
-    position: relative;
-    margin: 0;
-    padding: 0;
-    float: left;
-
-    &:first-child a {
-      border-left-width: 1px;
-      border-top-left-radius: 12px;
-      border-bottom-left-radius: 12px;
-    }
-
-    &:last-child a {
-      border-right-width: 1px;
-      border-top-right-radius: 12px;
-      border-bottom-right-radius: 12px;
-    }
-
-    a {
-      @include light-button;
-      @include gradient(#FFFFFF, #F0F0F0);
-      @include border-colors(#d9d9d9, #d0d0d0, #c5c5c5);
-      text-decoration: none;
-      border-radius: 0;
-      border-width: 1px .5px 1px .5px;
-      margin-right: 0;
-      padding: 4px 14px 4px;
-
-      &:not(.disabled) {
-        &:hover {
-          @include gradient(#FFFFFF, #F6F6F6);
-        }
-      }
-    }
-
-    &.ui-tabs-active {
-      a {
-        cursor: default;
-        @include gradient(#F0F0F0, #FDFDFD);
-
-        a:hover {
-          @include gradient(#F0F0F0, #FDFDFD);
-        }
-      }
-    }
-  }
-}
-
 .tab-content {
   border: 1px solid #D3D3D3;
   padding: 15px;
   padding-top: 30px;
   text-align: left;
-}
\ No newline at end of file
+}

From c35ba410b8cb937827df9458c1ac6dc748225c63 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 24 Mar 2015 02:09:49 -0400
Subject: [PATCH 006/170] Remove various styles that have no real effect

---
 app/assets/stylesheets/active_admin/_header.scss | 14 +-------------
 1 file changed, 1 insertion(+), 13 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index cb28a43d77e..c0c382a987f 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -4,10 +4,7 @@
 #header {
   background-color: lighten($primary-color, 5%);
   display: table;
-  height: 20px;
   width: 100%;
-  overflow: visible;
-  position: inherit;
   padding: 5px 0;
   z-index: 900;
 
@@ -16,9 +13,7 @@
     vertical-align: middle;
     white-space: nowrap;
     color:  $page-header-text-color;
-    margin-right: 20px;
-    margin-bottom: 0px;
-    padding: 3px $horizontal-page-margin 0 $horizontal-page-margin;
+    padding: 0 $horizontal-page-margin;
     font-size: 1.3em;
     font-weight: normal;
     line-height: 1.2;
@@ -30,19 +25,12 @@
         color: #fff;
       }
     }
-
-    img {
-      position: relative;
-      top: -2px;
-    }
   }
 
   a, a:link { color: $page-header-text-color; }
 
   .header-item {
-    top: 2px;
     position: relative;
-    height: 20px
   }
 
   ul.tabs {

From 2eafc999ba8dc764458034c025322bc911f42dc6 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 24 Mar 2015 16:44:49 -0400
Subject: [PATCH 007/170] Remove display: table on index wrapper

This causes several layout issues. If any occurring now its because we
also need to set box-sizing: border-box globally.
---
 .../stylesheets/active_admin/structure/_main_structure.scss   | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/structure/_main_structure.scss b/app/assets/stylesheets/active_admin/structure/_main_structure.scss
index c49e3ae86fc..4b710aae575 100644
--- a/app/assets/stylesheets/active_admin/structure/_main_structure.scss
+++ b/app/assets/stylesheets/active_admin/structure/_main_structure.scss
@@ -2,10 +2,6 @@
   width: 100%;
 }
 
-.index #wrapper {
-  display: table;
-}
-
 #active_admin_content {
   margin: 0;
   padding: $horizontal-page-margin;

From a770ad9573ba1e8581868ca890d1566172fbf641 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 24 Mar 2015 23:26:29 -0400
Subject: [PATCH 008/170] Update clearfix to todays standard version

---
 .../stylesheets/active_admin/mixins/_utilities.scss    | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/mixins/_utilities.scss b/app/assets/stylesheets/active_admin/mixins/_utilities.scss
index bf42a8d2d08..3fb5842b7f2 100644
--- a/app/assets/stylesheets/active_admin/mixins/_utilities.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_utilities.scss
@@ -1,10 +1,12 @@
 @mixin clearfix {
+  &:before,
+  &:after {
+    content: " ";
+    display: table;
+  }
+
   &:after {
-    visibility: hidden;
-    display: block;
-    content: "";
     clear: both;
-    height: 0;
   }
 }
 

From b8943cb42aa13054b8238d163a1865a70231a95d Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 24 Mar 2015 23:30:05 -0400
Subject: [PATCH 009/170] Flatten out selectors, use clearfix, remove wrapper
 style
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* No need at all to specify multiple ids in one selector so I’ve broken
these all out. Should have no effect on anyone else’s existing
overrides.
* Removed unnecessary wrapper width as that is the default for div.
* Using clearfix on active_admin_content (has no effect other than on
debugging, hate when selecting this element that the browser gives an
overlay that its so small when it isn’t, will help when reworking
layout structure later)
---
 .../structure/_main_structure.scss            | 34 +++++++++----------
 1 file changed, 16 insertions(+), 18 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/structure/_main_structure.scss b/app/assets/stylesheets/active_admin/structure/_main_structure.scss
index 4b710aae575..a69fbccc7fd 100644
--- a/app/assets/stylesheets/active_admin/structure/_main_structure.scss
+++ b/app/assets/stylesheets/active_admin/structure/_main_structure.scss
@@ -1,25 +1,23 @@
-#wrapper {
-  width: 100%;
-}
-
 #active_admin_content {
-  margin: 0;
+  @include clearfix;
   padding: $horizontal-page-margin;
+}
 
-  #main_content_wrapper {
-    float: left;
-    width: 100%;
+#main_content_wrapper {
+  float: left;
+  width: 100%;
+}
 
-    #main_content{
-      margin-right: 300px;
-    }
-  }
+#main_content{
+  margin-right: 300px;
+}
 
-  &.without_sidebar #main_content_wrapper #main_content{ margin-right: 0; }
+.without_sidebar #main_content {
+  margin-right: 0;
+}
 
-  #sidebar {
-    float: left;
-    width: $sidebar-width;
-    margin-left: -$sidebar-width;
-  }
+#sidebar {
+  float: left;
+  margin-left: -$sidebar-width;
+  width: $sidebar-width;
 }

From b136f0d59f0262e071cd18901114bc2b17871ee0 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 24 Mar 2015 23:45:00 -0400
Subject: [PATCH 010/170] Simplify styles and remove unused ones

Since we are using normalize (no more reset) several styles here can be
removed as they are the browser default.
---
 .../stylesheets/active_admin/_typography.scss | 18 ++++--------
 .../active_admin/components/_tables.scss      | 29 +++++--------------
 .../components/_unsupported_browser.scss      |  6 ++--
 .../active_admin/mixins/_sections.scss        |  5 ----
 4 files changed, 15 insertions(+), 43 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_typography.scss b/app/assets/stylesheets/active_admin/_typography.scss
index ddb369f37fb..3eb0096f2ce 100644
--- a/app/assets/stylesheets/active_admin/_typography.scss
+++ b/app/assets/stylesheets/active_admin/_typography.scss
@@ -31,7 +31,6 @@ body { font-size: 75%; font-family: "Helvetica Neue", Arial, Helvetica, sans-ser
 h1,h2,h3,h4,h5,h6 {
   font-weight: normal;
   color: $primary-color;
-  img { margin: 0; }
 }
 
 h1 { font-size: 3em; line-height: 1; margin-bottom: 0.5em; }
@@ -53,9 +52,6 @@ p {
 .right             { float: right !important; }
 
 blockquote  { margin: 1.5em; color: #666; font-style: italic; }
-strong,dfn    { font-weight: bold; }
-em,dfn      { font-style: italic; }
-sup, sub    { line-height: 0; }
 
 abbr,
 acronym     { border-bottom: 1px dotted #666; }
@@ -70,19 +66,10 @@ li ul,
 li ol       { margin: 0; }
 ul, ol      { margin: 0 1.5em 1.5em 0; padding-left: 1.5em; }
 
-ul          { list-style-type: disc; }
-ol          { list-style-type: decimal; }
-
 dl          { margin: 0 0 1.5em 0; }
 dl dt       { font-weight: bold; }
 dd          { margin-left: 1.5em;}
 
-// Tables
-table       { margin-bottom: 1.4em; width:100%; }
-th          { font-weight: bold; }
-thead th    { background: #c3d9ff; }
-th,td,caption { padding: 4px 10px 4px 5px; }
-
 // Helper Classes
 .small      { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; }
 .large      { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; }
@@ -98,3 +85,8 @@ th,td,caption { padding: 4px 10px 4px 5px; }
 .last       { margin-right:0; padding-right:0; }
 .top        { margin-top:0; padding-top:0; }
 .bottom     { margin-bottom:0; padding-bottom:0; }
+
+hr {
+  border: none;
+  border-bottom: 1px solid #E8E8E8;
+}
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 4870ac1e4f5..cf6505a1efc 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -1,29 +1,19 @@
 //= depend_on_asset "active_admin/orderable.png"
 // ----------------------------------- Tables
 
-table tr {
-  td {
-    vertical-align: top;
-  }
-
-  th {
-    text-align: left;
-  }
+th {
+  text-align: left;
 }
 
 // --------- Index Tables
 
 table.index_table {
-  width: 100%;
   margin-bottom: 10px;
-  border: 0;
-  border-spacing: 0;
+  width: 100%;
 
   th {
     background-color: #e9e9e9;
-    border-right: none;
-    padding-left: $cell-horizontal-padding;
-    padding-right: $cell-horizontal-padding;
+    padding: 10px 12px 8px 12px;
 
     a, a:link, a:visited {
       color: $section-header-text-color;
@@ -42,11 +32,6 @@ table.index_table {
     &.sorted-asc, &.sorted-desc {
       background-color: darken($secondary-gradient-stop, 5%);
     }
-
-    &:last-child {
-      border-right: solid 1px #d4d4d4;
-    }
-
   }
 
   tr.even td { background: $table-stripe-color; }
@@ -58,7 +43,6 @@ table.index_table {
   td {
     padding: 10px $cell-horizontal-padding 8px $cell-horizontal-padding;
     border-bottom: 1px solid #e8e8e8;
-    vertical-align: top;
   }
 }
 
@@ -66,6 +50,8 @@ table.index_table {
 
 .panel_contents table {
   margin-top: 5px;
+  width: 100%;
+
   th {
     padding-top: 10px;
     background: none;
@@ -81,11 +67,12 @@ table.index_table {
 .attributes_table { overflow: hidden; }
 
 .attributes_table table {
+  width: 100%;
+
   col.even { background: $table-stripe-color; }
   col.odd  { background: darken($table-stripe-color, 3%); }
   th, td {
     padding: 8px $cell-horizontal-padding 6px $cell-horizontal-padding;
-    vertical-align: top;
     border-bottom: 1px solid #e8e8e8;
   }
   th {
diff --git a/app/assets/stylesheets/active_admin/components/_unsupported_browser.scss b/app/assets/stylesheets/active_admin/components/_unsupported_browser.scss
index 7f6f10731c1..a32fffadf53 100644
--- a/app/assets/stylesheets/active_admin/components/_unsupported_browser.scss
+++ b/app/assets/stylesheets/active_admin/components/_unsupported_browser.scss
@@ -1,9 +1,7 @@
 .unsupported_browser {
-  padding: 10px 30px;
-  color: #211e14;
   background-color: #fae692;
-  @include gradient(#feefae, #fae692);
-  border-bottom: 1px solid #b3a569;
+  color: #211e14;
+  padding: 10px 30px;
 
   h1 {
     font-size: 13px;
diff --git a/app/assets/stylesheets/active_admin/mixins/_sections.scss b/app/assets/stylesheets/active_admin/mixins/_sections.scss
index 2e131ee7deb..22b5ea62aa0 100644
--- a/app/assets/stylesheets/active_admin/mixins/_sections.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_sections.scss
@@ -25,9 +25,4 @@
   }
 
   > div { padding: 3px $section-padding $section-padding $section-padding; }
-
-  hr {
-    border: none;
-    border-bottom: 1px solid #E8E8E8;
-  }
 }

From 9783e4d21ffba9aa5c35840995744352d589e225 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 25 Mar 2015 00:24:43 -0400
Subject: [PATCH 011/170] Remove unnecessary id selector nesting in titlebar

---
 .../active_admin/structure/_title_bar.scss    | 31 +++++++++----------
 1 file changed, 15 insertions(+), 16 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/structure/_title_bar.scss b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
index 1bf87494810..08575e48583 100644
--- a/app/assets/stylesheets/active_admin/structure/_title_bar.scss
+++ b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
@@ -1,24 +1,13 @@
 #title_bar {
-  @include section-header;
-  @include clearfix;
-  box-sizing: border-box;
+  background-color: #e9e9e9;
+  color: $section-header-text-color;
   display: table;
-  width: 100%;
-  position: relative;
-  margin: 0;
+  font-size: 1em;
+  font-weight: bold;
   padding: 10px $horizontal-page-margin;
+  width: 100%;
   z-index: 800;
 
-  #titlebar_left, #titlebar_right {
-    height: 50px;
-    vertical-align: middle;
-    display: table-cell;
-  }
-
-  #titlebar_right {
-    text-align: right;
-  }
-
   h2 {
     margin: 0;
     padding: 0;
@@ -37,3 +26,13 @@
     }
   }
 }
+
+#titlebar_left, #titlebar_right {
+  display: table-cell;
+  min-height: 50px;
+  vertical-align: middle;
+}
+
+#titlebar_right {
+  text-align: right;
+}

From efed32b3111f61132180684107bf60e12f414fc9 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 25 Mar 2015 01:23:28 -0400
Subject: [PATCH 012/170] Streamline tabs and hover menu styles
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Several styles simply not taking effect (Safari, Chrome). The sub menu
won’t ever grow past the min-width regardless if other properties are
left or not. Not sure if possibly an inherited style is affecting this
in someway but I will be revisiting again.
---
 .../stylesheets/active_admin/_header.scss     | 45 +++++++------------
 1 file changed, 17 insertions(+), 28 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index c0c382a987f..3985ed85635 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -35,10 +35,11 @@
 
   ul.tabs {
     display: table-cell;
-    vertical-align: middle;
     height: 100%;
     margin: 0;
     padding: 0;
+    vertical-align: middle;
+    width: 100%;
 
     & > li {
       display: inline-block;
@@ -76,50 +77,41 @@
       }
 
       &.has_nested:hover > a {
-        @include rounded-top(10px);
         border-bottom: 5px solid $hover-menu-item-background;
         background: $hover-menu-item-background image-url('active_admin/nested_menu_arrow_dark.gif') no-repeat calc(100% - 7px) 50%;
         z-index: 1020;
       }
 
-
       /* Hover on li, display the ul */
-      &:hover ul { display: block;}
+      &:hover ul {
+        display: block;
+      }
+
       /* Drop down menus */
       ul {
         background: $hover-menu-item-background;
-        @include rounded-all(0,10px,10px,10px);
-        box-shadow: 0 1px 3px #444;
-        position: absolute;
-        width: 120%;
-        min-width: 175px;
-        max-width: calc(100% + 20px);
-        margin-top: 5px;
-        float: left;
+        border-radius: 0 4px 4px 4px;
+        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
         display: none;
-        padding: 3px 0px 5px 0;
         list-style: none;
+        margin-top: 5px;
+        min-width: 175px;
+        padding: 5px 0;
+        position: absolute;
         z-index: 1010;
 
         li {
-          margin: 0px;
           a {
-            background: none;
             display: block;
-            &:hover { color: #fff; background: none; }
           }
 
-          &.current {
-            a { @include rounded(0) }
+          &.current a,
+          a:hover {
+            color: #fff;
           }
         }
       }
     }
-
-  }
-
-  #tabs {
-    width: 100%;
   }
 
   #utility_nav {
@@ -131,11 +123,8 @@
     padding-right: 26px;
     text-align: right;
 
-    a { text-decoration: none; }
-    a:hover { color: #fff; }
-
-    li {
-      display:inline;
+    a:hover {
+      color: #fff;
     }
   }
 

From 9b776397c0565baf9c0d6e96f43a74101743a63b Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 25 Mar 2015 01:40:40 -0400
Subject: [PATCH 013/170] Keep padding consistent

This is a great amount of spacing that is quite pleasing. Headers now
line up with content too. Keep it consistent.
---
 app/assets/stylesheets/active_admin/mixins/_sections.scss | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/mixins/_sections.scss b/app/assets/stylesheets/active_admin/mixins/_sections.scss
index 22b5ea62aa0..e537abbc4c6 100644
--- a/app/assets/stylesheets/active_admin/mixins/_sections.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_sections.scss
@@ -4,7 +4,8 @@
   font-size: 1em;
   font-weight: bold;
   color: $section-header-text-color;
-  padding: 5px 10px 3px 10px;
+  margin: 0;
+  padding: 10px 15px;
 }
 
 @mixin section-background {
@@ -24,5 +25,7 @@
     }
   }
 
-  > div { padding: 3px $section-padding $section-padding $section-padding; }
+  > div {
+    padding: $section-padding;
+  }
 }

From e51fea48b963bf6a50d71eb16859376cb6ef8e6a Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 25 Mar 2015 01:46:42 -0400
Subject: [PATCH 014/170] Streamline table styles, use better defaults
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Tables are the most important part of ActiveAdmin as it’s the
components that is most widely used to display data. Keep presentation
clean and consistent, same padding, colors, etc. We can fine tune but
this brings it down just to the necessary styles without being verbose.
Further improvements: removing even/odd classes as this can now be done
using solely CSS.
---
 .../active_admin/components/_tables.scss      | 68 +++++++++----------
 1 file changed, 33 insertions(+), 35 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index cf6505a1efc..25522cfce50 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -1,24 +1,36 @@
 //= depend_on_asset "active_admin/orderable.png"
 // ----------------------------------- Tables
 
+table {
+  margin-bottom: 1.4em;
+  width: 100%;
+}
+
+thead {
+  background-color: #e9e9e9;
+
+  th {
+    border-bottom: 1px solid #ccc;
+  }
+}
+
 th {
   text-align: left;
 }
 
+th, td {
+  border-bottom: 1px solid #e8e8e8;
+  padding: 8px;
+}
+
 // --------- Index Tables
 
 table.index_table {
-  margin-bottom: 10px;
-  width: 100%;
-
   th {
-    background-color: #e9e9e9;
-    padding: 10px 12px 8px 12px;
-
     a, a:link, a:visited {
       color: $section-header-text-color;
-      text-decoration: none;
       display: block;
+      text-decoration: none;
       white-space: nowrap;
     }
 
@@ -34,62 +46,48 @@ table.index_table {
     }
   }
 
-  tr.even td { background: $table-stripe-color; }
+  tr.even td {
+    background: $table-stripe-color;
+  }
 
   tr.selected td {
     background: $table-selected-color;
   }
-
-  td {
-    padding: 10px $cell-horizontal-padding 8px $cell-horizontal-padding;
-    border-bottom: 1px solid #e8e8e8;
-  }
 }
 
 // --------- Tables inside Panels
 
 .panel_contents table {
-  margin-top: 5px;
-  width: 100%;
-
-  th {
-    padding-top: 10px;
-    background: none;
-    color: $primary-color;
-    text-transform: uppercase;
-    border-bottom: 1px solid #ccc;
+  thead {
+    background-color: transparent;
   }
   tr.odd td { background: darken($table-stripe-color, 3%); }
   tr.even td { background: $table-stripe-color; }
 }
 
 // -------------------------------------- Resource Attributes Table
-.attributes_table { overflow: hidden; }
+.attributes_table {
+  overflow: hidden;
+}
 
 .attributes_table table {
-  width: 100%;
-
   col.even { background: $table-stripe-color; }
   col.odd  { background: darken($table-stripe-color, 3%); }
-  th, td {
-    padding: 8px $cell-horizontal-padding 6px $cell-horizontal-padding;
-    border-bottom: 1px solid #e8e8e8;
-  }
   th {
-    width: 150px;
-    font-size: 0.9em;
-    padding-left: 0;
-    text-transform: uppercase;
     color: $primary-color;
+    padding-left: 0;
+    width: 150px;
   }
   td {
     .empty {
       color: #bbb;
       font-size: 0.8em;
-      text-transform: uppercase;
       letter-spacing: 0.2em;
+      text-transform: uppercase;
     }
   }
 }
 
-.sidebar_section .attributes_table th { width: 50px; }
+.sidebar_section .attributes_table th {
+  width: 50px;
+}

From cbbbcf5672ab15bffc1058069bcf1562c86e4e1c Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 25 Mar 2015 01:52:45 -0400
Subject: [PATCH 015/170] Apply box-sizing: border-box globally

---
 .../stylesheets/active_admin/_base.scss       |   4 +
 .../components/_dropdown_menu.scss            |   1 -
 .../active_admin/components/_popovers.scss    | 120 ++++++++++++++++++
 3 files changed, 124 insertions(+), 1 deletion(-)
 create mode 100644 app/assets/stylesheets/active_admin/components/_popovers.scss

diff --git a/app/assets/stylesheets/active_admin/_base.scss b/app/assets/stylesheets/active_admin/_base.scss
index bfa560f4da9..e9e11b328a4 100644
--- a/app/assets/stylesheets/active_admin/_base.scss
+++ b/app/assets/stylesheets/active_admin/_base.scss
@@ -32,6 +32,10 @@
 @import "active_admin/structure/main_structure";
 @import "active_admin/structure/title_bar";
 
+* {
+  box-sizing: border-box;
+}
+
 body {
   @include sans-family;
   line-height: 1.5;
diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index d9dfbd7d758..ea7c2332674 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -105,7 +105,6 @@
       li {
         display: block;
         border-bottom: solid 1px #ebebeb;
-        box-sizing: border-box;
 
         a {
           display: block;
diff --git a/app/assets/stylesheets/active_admin/components/_popovers.scss b/app/assets/stylesheets/active_admin/components/_popovers.scss
new file mode 100644
index 00000000000..4441462db81
--- /dev/null
+++ b/app/assets/stylesheets/active_admin/components/_popovers.scss
@@ -0,0 +1,120 @@
+.popover {
+  display: inline-block;
+  position: absolute;
+  background-color: white;
+  padding: 2px;
+  box-shadow: rgba(0,0,0,0.4) 0 1px 3px, lighten($primary-color, 15%) 0px 1px 0px 0px inset;
+  background-color: $primary-color;
+  @include gradient(lighten($primary-color, 4%), darken($primary-color, 5%));
+  border: solid 1px darken($primary-color, 10%);
+  border-top-color: darken($primary-color, 4%);
+  border-bottom-color: darken($primary-color, 17%);
+
+  border-radius: 4px;
+
+  .popover_nipple{
+
+    // The nipple's border
+    content: "";
+    position: absolute;
+    top: -6px;
+    display: block;
+    width: 0;
+    height: 0;
+    border-width: 0 6px 6px;
+    border-style: solid;
+    border-color: darken($primary-color, 4%) transparent;
+    z-index: 100;
+
+    // The nipple's inner shadow
+
+    &:before {
+      content: ' ';
+      position: absolute;
+      width: 0;
+      height: 0;
+      border-width: 0 5px 5px;
+      border-style: solid;
+      border-color: lighten($primary-color, 15%) transparent;
+      left: -5px;
+      top: 1px;
+    }
+
+    // The nipple's background color
+
+    &:after {
+      content: ' ';
+      position: absolute;
+      width: 0;
+      height: 0;
+      border-width: 0 5px 5px;
+      border-style: solid;
+      border-color: lighten($primary-color, 4%) transparent;
+      left: -5px;
+      top: 2px;
+    }
+  }
+
+  .popover_contents {
+    display: block;
+    background-color: #FFF;
+    border: solid 1px darken($primary-color, 10%);
+    box-shadow: lighten($primary-color, 5%) 0px 1px 0px 0px;
+    border-radius: 3px;
+    margin: 0;
+    overflow: hidden;
+    padding: 8px;
+  }
+
+}
+
+//-------------------------------------- Popover with action list
+
+.popover {
+  ul.popover_contents {
+    list-style-type: none;
+    padding: 0;
+
+    li {
+      display: block;
+      border-bottom: solid 1px #ebebeb;
+
+      a {
+        display: block;
+        box-sizing: padding-box;
+        font-size: 0.95em;
+        font-weight: bold;
+        padding: 7px 16px 5px;
+        text-decoration: none;
+        text-align: center;
+
+        &:hover {
+          @include highlight-gradient;
+          color: #FFF;
+        }
+
+        &:active {
+          @include reverse-highlight-gradient;
+          color: #FFF;
+        }
+
+      }
+
+      &:first-child {
+        a {
+          border-top-left-radius: 2px;
+          border-top-right-radius: 2px;
+        }
+
+      }
+
+      &:last-child {
+        a {
+          border-bottom-left-radius: 2px;
+          border-bottom-right-radius: 2px;
+        }
+        border: none;
+      }
+    }
+  }
+}

From 7a6db0349c835d7a5d171988e1c49126bc1c5f35 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 25 Mar 2015 02:01:46 -0400
Subject: [PATCH 016/170] Clean status_tag styles so content is nicely centered
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Content wasn’t centered in any direction but now its much nicer. Just a
tad rounded corner so its not so rough.
---
 .../stylesheets/active_admin/components/_status_tags.scss | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_status_tags.scss b/app/assets/stylesheets/active_admin/components/_status_tags.scss
index 77b02e3d67b..8cfe13cac69 100644
--- a/app/assets/stylesheets/active_admin/components/_status_tags.scss
+++ b/app/assets/stylesheets/active_admin/components/_status_tags.scss
@@ -1,10 +1,11 @@
 .status_tag {
   background: darken($secondary-color, 15%);
+  border-radius: 0.25em;
   color: #fff;
-  text-transform: uppercase;
-  letter-spacing: 0.15em;
-  padding: 3px 5px 2px 5px;
   font-size: 0.8em;
+  text-align: center;
+  text-transform: uppercase;
+  padding: 0.3em 0.6em;
 
   &.ok, &.published, &.complete, &.completed, &.green { background: #8daa92; }
   &.warn, &.warning, &.orange { background: #e29b20; }
@@ -12,5 +13,4 @@
 
   &.yes { background: #6090DB }
   &.no  { background: grey }
-
 }

From 643d7a8fd6b1f5053771d07cc337dd407069fbad Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 25 Mar 2015 02:08:31 -0400
Subject: [PATCH 017/170] Fix datepicker due to box-sizing global change

---
 .../stylesheets/active_admin/components/_date_picker.scss      | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index 788fd5a1e27..8e50b0e2034 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -15,11 +15,10 @@
   }
 
   .ui-datepicker-header {
-    height: 14px;
     @include primary-gradient;
     padding: 12px 5px 7px 4px;
     margin: 0px 0px 2px 2px;
-    width: 147px;
+    width: 156px;
     border-top-left-radius: 7px;
     border-top-right-radius: 7px;
     position: relative;

From 94a42ce454ae21f9ecc0dc519cd963615fec6292 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 25 Mar 2015 02:30:12 -0400
Subject: [PATCH 018/170] Clean up form text and rounded styles
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Remove rounded as we can just apply border-radius (soon we will
configure values using variables).
* Remove sans-family mixin since normalize.css sets all input controls
to inherit font styles. If it didn’t we’d have to explicitly set it
otherwise browser applies its own default but with “inherit” it
receives the value set in the body tag.
* Keep sidebar labels in standard case and with a little margin.
---
 app/assets/stylesheets/active_admin/_forms.scss | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 30ef8a70539..582891fa71f 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -128,9 +128,7 @@ form {
   textarea {
     width: calc(80% - #{$text-input-total-padding});
     border: $border-width solid #c9d0d6;
-    @include rounded;
-    font-size: 0.95em;
-    @include sans-family;
+    border-radius: 3px;
     outline: none;
     padding: 8px $text-input-horizontal-padding 7px;
 
@@ -219,7 +217,7 @@ form {
   /* semantic_errors */
   ul.errors {
     background: lighten($error-color, 60%);
-    @include rounded(4px);
+    border-radius: 3px;
     color: $error-color;
     font-weight: bold;
     margin-bottom: 10px;
@@ -256,11 +254,10 @@ $sidebar-inner-content-width: $sidebar-width - ($section-padding * 2);
 .sidebar_section {
 
   label {
-    display: block;
-    text-transform: uppercase;
     color:  $form-label-color;
-    font-size: 0.9em;
+    display: block;
     font-weight: bold;
+    margin: 0 0 0.18em 2px;
   }
 
   select {

From 5bcbf19da5dcb9e554f34025f6dcd5ac2b787a78 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 25 Mar 2015 02:34:30 -0400
Subject: [PATCH 019/170] height acts as min-height on a table or table cell

Forgot about this. I switched to min-height since its so much clearer
but this is how it works so lets keep it for now.
---
 app/assets/stylesheets/active_admin/structure/_title_bar.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/active_admin/structure/_title_bar.scss b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
index 08575e48583..154eb9a5e25 100644
--- a/app/assets/stylesheets/active_admin/structure/_title_bar.scss
+++ b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
@@ -29,7 +29,7 @@
 
 #titlebar_left, #titlebar_right {
   display: table-cell;
-  min-height: 50px;
+  height: 50px; // acts as minimum height
   vertical-align: middle;
 }
 

From 8bd4d971271b6100a735ab04f5a341777e61143d Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 25 Mar 2015 22:53:37 -0400
Subject: [PATCH 020/170] Lessen selector weight and DRYify

Several link styles were spread out but we want them applied to the
header as a whole so condense to one area.
---
 .../stylesheets/active_admin/_header.scss     | 45 +++++++++----------
 1 file changed, 21 insertions(+), 24 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index 3985ed85635..ead6bb37d75 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -1,13 +1,22 @@
 //= depend_on_asset "active_admin/nested_menu_arrow.gif"
 //= depend_on_asset "active_admin/nested_menu_arrow_dark.gif"
 // ----------------------------------- Header
-#header {
+.header {
   background-color: lighten($primary-color, 5%);
   display: table;
   width: 100%;
   padding: 5px 0;
   z-index: 900;
 
+  a, a:link, a:visited {
+    color: $page-header-text-color;
+    text-decoration: none;
+  }
+
+  a:hover {
+    color: #fff;
+  }
+
   h1 {
     display: table-cell;
     vertical-align: middle;
@@ -18,17 +27,11 @@
     font-weight: normal;
     line-height: 1.2;
 
-    a {
-      text-decoration: none;
-
-      &:hover {
-        color: #fff;
-      }
+    a:hover {
+      color: #fff;
     }
   }
 
-  a, a:link { color: $page-header-text-color; }
-
   .header-item {
     position: relative;
   }
@@ -51,7 +54,6 @@
 
       a {
         border-radius: 4px;
-        text-decoration: none;
         padding: 6px 10px 4px 10px;
         position: relative;
       }
@@ -113,19 +115,14 @@
       }
     }
   }
+}
 
-  #utility_nav {
-    color: #aaa;
-    display: table-cell;
-    white-space: nowrap;
-    margin: 0;
-    padding: 0;
-    padding-right: 26px;
-    text-align: right;
-
-    a:hover {
-      color: #fff;
-    }
-  }
-
+#utility_nav {
+  color: #aaa;
+  display: table-cell;
+  white-space: nowrap;
+  margin: 0;
+  padding: 0;
+  padding-right: 26px;
+  text-align: right;
 }

From cf77cce49b570bbecba0f9d4eec93423d1136fbe Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 25 Mar 2015 23:00:04 -0400
Subject: [PATCH 021/170] Change table stripe and selected colors
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

A soft yellow is a better choice I think as a default for the selected
background color. I don’t think $primary-color is a good choice for
striped backgrounds as a default.
---
 app/assets/stylesheets/active_admin/mixins/_variables.scss | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 5cf62a94c95..7637de072e0 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -11,8 +11,8 @@ $link-color: #38678b !default;
 $section-header-text-color: $primary-color !default;
 $current-menu-item-background: lighten($primary-color, 12%) !default;
 $hover-menu-item-background: lighten($primary-color, 12%) !default;
-$table-stripe-color: lighten($primary-color, 57%) !default;
-$table-selected-color: #d9e4ec !default;
+$table-stripe-color: #f8f8f8 !default;
+$table-selected-color: #fcf8e3 !default;
 $error-color: #932419 !default;
 $blank-slate-primary-color: #AAA !default;
 $breadcrumbs-color: #8a949e !default;

From e84422d8ef4388a9ea184d43f8e83f0d9fed4d7a Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 25 Mar 2015 23:02:52 -0400
Subject: [PATCH 022/170] Adjust table styles to account for various contexts
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Panel tables inherit styles even for the attributes_table. I’d rather
avoid resetting a lot of styles so going to consider adding a new class
if possible. For now this is sufficient.
---
 .../active_admin/components/_tables.scss      | 53 +++++++++++--------
 .../active_admin/mixins/_sections.scss        |  2 +-
 .../active_admin/structure/_title_bar.scss    |  2 +-
 3 files changed, 33 insertions(+), 24 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 25522cfce50..cc765860fe0 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -7,10 +7,8 @@ table {
 }
 
 thead {
-  background-color: #e9e9e9;
-
   th {
-    border-bottom: 1px solid #ccc;
+    border-bottom: 2px solid #ccc;
   }
 }
 
@@ -38,20 +36,25 @@ table.index_table {
       background: image-url('active_admin/orderable.png') no-repeat 0 4px; padding-left: 13px;
     }
 
-    &.sorted-asc a { background-position: 0 -27px; }
-    &.sorted-desc a {  background-position: 0 -56px;}
+    &.sorted-asc a {
+      background-position: 0 -27px;
+    }
+
+    &.sorted-desc a {
+      background-position: 0 -56px;
+    }
 
     &.sorted-asc, &.sorted-desc {
-      background-color: darken($secondary-gradient-stop, 5%);
+      background-color: #e6e6e6;
     }
   }
 
-  tr.even td {
-    background: $table-stripe-color;
+  tbody tr:nth-of-type(odd) {
+    background-color: $table-stripe-color;
   }
 
-  tr.selected td {
-    background: $table-selected-color;
+  tbody tr.selected {
+    background-color: $table-selected-color;
   }
 }
 
@@ -61,8 +64,10 @@ table.index_table {
   thead {
     background-color: transparent;
   }
-  tr.odd td { background: darken($table-stripe-color, 3%); }
-  tr.even td { background: $table-stripe-color; }
+
+  th, td {
+    padding: 5px;
+  }
 }
 
 // -------------------------------------- Resource Attributes Table
@@ -71,20 +76,24 @@ table.index_table {
 }
 
 .attributes_table table {
-  col.even { background: $table-stripe-color; }
-  col.odd  { background: darken($table-stripe-color, 3%); }
+  col {
+    border-right: 1px solid #e8e8e8;
+
+    &:first-child {
+      border-right: 2px solid #ccc;
+    }
+  }
+
   th {
     color: $primary-color;
-    padding-left: 0;
     width: 150px;
   }
-  td {
-    .empty {
-      color: #bbb;
-      font-size: 0.8em;
-      letter-spacing: 0.2em;
-      text-transform: uppercase;
-    }
+
+  td .empty {
+    color: #bbb;
+    font-size: 0.8em;
+    letter-spacing: 0.2em;
+    text-transform: uppercase;
   }
 }
 
diff --git a/app/assets/stylesheets/active_admin/mixins/_sections.scss b/app/assets/stylesheets/active_admin/mixins/_sections.scss
index e537abbc4c6..08453a4184c 100644
--- a/app/assets/stylesheets/active_admin/mixins/_sections.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_sections.scss
@@ -1,5 +1,5 @@
 @mixin section-header {
-  background-color: #e9e9e9;
+  background-color: #e6e6e6;
   border-radius: 4px 4px 0 0;
   font-size: 1em;
   font-weight: bold;
diff --git a/app/assets/stylesheets/active_admin/structure/_title_bar.scss b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
index 154eb9a5e25..06bde910712 100644
--- a/app/assets/stylesheets/active_admin/structure/_title_bar.scss
+++ b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
@@ -1,5 +1,5 @@
 #title_bar {
-  background-color: #e9e9e9;
+  background-color: #eaebec;
   color: $section-header-text-color;
   display: table;
   font-size: 1em;

From adfd59f7a95644352a8dc96a395ee6312f3b1388 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 26 Mar 2015 00:05:03 -0400
Subject: [PATCH 023/170] Decrease titlebar font size and action item padding

The margin on action_item has no effect (we are changing how horizontal
margins are applied on buttons).
---
 app/assets/stylesheets/active_admin/structure/_title_bar.scss | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/structure/_title_bar.scss b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
index 06bde910712..a78e4ece9f6 100644
--- a/app/assets/stylesheets/active_admin/structure/_title_bar.scss
+++ b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
@@ -11,7 +11,7 @@
   h2 {
     margin: 0;
     padding: 0;
-    font-size: 2.6em;
+    font-size: 2.2em;
     line-height: 100%;
     font-weight: bold;
   }
@@ -20,8 +20,6 @@
     span.action_item {
       & > a, & > .dropdown_menu > a {
         @include light-button;
-        padding: 12px 17px 10px;
-        margin: 0px;
       }
     }
   }

From 6a50f84d4ac78e90913369be38df95a856f1ad23 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 26 Mar 2015 00:10:58 -0400
Subject: [PATCH 024/170] Streamline button styles

* Apply unit less line-height (this will be configured to match body
line height).
* Remove sans-family mixin as all buttons (even form buttons) will
inherit font family
* Adjust padding so its not so big
* Use not-allowed cursor for better visual feedback (wide browser
support)
---
 .../active_admin/mixins/_buttons.scss            | 16 +++++-----------
 1 file changed, 5 insertions(+), 11 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index fd03524409a..aaefc520f77 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -1,26 +1,22 @@
 @mixin basic-button {
-  @include rounded(200px);
+  border-radius: 0.25em;
   display: inline-block;
-  font-weight: bold;
   font-size: 1.0em;
-  @include sans-family;
-  line-height: 12px;
-  margin-right: 3px;
-  padding: 7px 16px 6px;
+  font-weight: bold;
+  line-height: 1.5; // needed for input/button elements to match a.button size
+  padding: 6px 15px;
   text-decoration: none;
 
   &.disabled {
+    cursor: now-allowed;
     opacity: 0.5;
-    cursor: default;
   }
-
 }
 
 @mixin default-button {
   @include basic-button;
   @include gradient(lighten($primary-color, 15%), darken($primary-color, 12%));
   border: solid 1px #484e53;
-  @include border-colors(#616a71, #484e53, #363b3f);
   color: #efefef;
 
   &:not(.disabled) {
@@ -38,7 +34,6 @@
   @include basic-button;
   @include gradient(#FFFFFF, #E7E7E7);
   border: solid 1px #c7c7c7;
-  @include border-colors(#d3d3d3, #c7c7c7, #c2c2c2);
   color: $primary-color;
 
   &:not(.disabled) {
@@ -47,7 +42,6 @@
     }
 
     &:active {
-      @include border-colors(#c2c2c2, #b9b9b9, #b7b7b7);
       @include gradient(#F3F3F3, #D8D8D8);
     }
   }

From 4e500760246f854d4923f45e12f903997a90d990 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 26 Mar 2015 00:14:34 -0400
Subject: [PATCH 025/170] Streamline pagination styles
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Remove styles that have no effect. Make a few tweaks so all content
lines up horizontally. Don’t customize select dropdown as we don’t do
that elsewhere so keep it consistent (we could see about changing this
to our dropdown component but this for sure affects Kaminari and we
already have an issue with their templates).
---
 .../active_admin/components/_pagination.scss  | 23 +++++++------------
 1 file changed, 8 insertions(+), 15 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_pagination.scss b/app/assets/stylesheets/active_admin/components/_pagination.scss
index ad91730b128..756253951b2 100644
--- a/app/assets/stylesheets/active_admin/components/_pagination.scss
+++ b/app/assets/stylesheets/active_admin/components/_pagination.scss
@@ -1,7 +1,3 @@
-.paginated_collection_contents {
-  clear: both;
-}
-
 .pagination {
   float: right;
   font-size: 0.9em;
@@ -16,17 +12,19 @@
   }
 
   a, span.page.current {
-    @include rounded(0px);
-    margin-right: 4px;
+    margin-right: 3px;
     padding: 2px 5px;
   }
 }
 
 .pagination_information {
-  float: right;
-  margin-bottom: 5px;
   color: #b3bcc1;
-  b { color: #5c6469; }
+  float: right;
+  margin-top: 2px; // match pagination link top padding so both appear vertically aligned
+
+  b {
+    color: #5c6469;
+  }
 }
 
 .download_links {
@@ -35,10 +33,5 @@
 
 .pagination_per_page {
   float: right;
-  margin-left: 4px;
-  select {
-    @include light-button;
-    @include rounded(0px);
-    padding: 1px 5px;
-  }
+  margin: 2px 0 0 4px;
 }

From 5316c9deae8815b504430855a6c4fee75ef93ff1 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 26 Mar 2015 00:15:41 -0400
Subject: [PATCH 026/170] Add clearfix to index_footer and use normal font size
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The original font size can be so difficult to read. I don’t think its
necessary to decrease the font size to decrease its importance to other
content.
---
 .../active_admin/structure/_footer.scss           | 15 +++++----------
 1 file changed, 5 insertions(+), 10 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/structure/_footer.scss b/app/assets/stylesheets/active_admin/structure/_footer.scss
index f387d207e1d..03825f9163f 100644
--- a/app/assets/stylesheets/active_admin/structure/_footer.scss
+++ b/app/assets/stylesheets/active_admin/structure/_footer.scss
@@ -1,14 +1,9 @@
 #footer {
-  padding: 30px 30px;
-  font-size: 0.8em;
-  clear: both;
-
-  p {
-    padding-top: 10px
-  }
+  font-size: 0.9em;
+  padding: 30px;
 }
 
 // -------------------------------------- Index Footer (Under Table)
-#index_footer { padding-top: 5px; text-align: right; font-size: 0.85em; }
-
-.index_content { clear: both; }
+#index_footer {
+  @include clearfix;
+}

From 724f3e21ad787cdc8ab00e23b0f7dab19227c5a0 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 26 Mar 2015 00:35:45 -0400
Subject: [PATCH 027/170] Decrease selector specificity and streamline styles

---
 .../components/_blank_slates.scss             | 35 +++++++------------
 1 file changed, 13 insertions(+), 22 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_blank_slates.scss b/app/assets/stylesheets/active_admin/components/_blank_slates.scss
index 7cd17638a28..4e63ae94bd7 100644
--- a/app/assets/stylesheets/active_admin/components/_blank_slates.scss
+++ b/app/assets/stylesheets/active_admin/components/_blank_slates.scss
@@ -1,30 +1,21 @@
 .blank_slate_container {
-  clear: both;
   text-align: center;
+}
 
-  .blank_slate {
-    @include rounded;
-    border:  $blank-slate-border;
-    color: $blank-slate-primary-color;
-    display: inline-block;
-    font-size: 1.2em;
-    font-weight: bold;
-    padding: 14px 25px;
-    text-align: center;
+.blank_slate {
+  color: $blank-slate-primary-color;
+  display: inline-block;
+  font-size: 1.3em;
+  font-weight: bold;
 
-    small {
-      display: block;
-      font-size: 0.9em;
-      font-weight: normal;
-    }
+  small {
+    display: block;
+    font-size: 0.9em;
+    font-weight: normal;
   }
 }
 
-.admin_dashboard .blank_slate_container .blank_slate {
-  margin-top: 40px;
-  margin-bottom: 40px;
-}
-
-.with_sidebar .blank_slate_container .blank_slate {
-  margin-top: 80px;
+.admin_dashboard .blank_slate,
+.with_sidebar .blank_slate {
+  margin: 80px 0;
 }

From 445b71a5baad568a5294b2cbed38bfe87b5aaba4 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 26 Mar 2015 01:00:18 -0400
Subject: [PATCH 028/170] Improve date picker styles and link hit area

Adjust some padding values so content renders neatly. Set display:
block; on day links so hit area is bigger (pretty much the size of the
table cell).
---
 .../active_admin/components/_date_picker.scss      | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index 8e50b0e2034..d2c4c7ed091 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -16,11 +16,10 @@
 
   .ui-datepicker-header {
     @include primary-gradient;
-    padding: 12px 5px 7px 4px;
+    padding: 8px 5px;
     margin: 0px 0px 2px 2px;
     width: 156px;
-    border-top-left-radius: 7px;
-    border-top-right-radius: 7px;
+    border-radius: 3px 3px 0 0;
     position: relative;
     z-index: 2000;
 
@@ -86,7 +85,6 @@
   }
 
   table.ui-datepicker-calendar {
-    @include rounded-bottom;
     background-color: #f4f4f4;
     border: solid 1px #63686e;
     left: 2px;
@@ -102,10 +100,11 @@
 
     thead th {
       background-color: #dbdddf;
+      border-bottom: none;
       color: #333333;
       font-weight: normal;
       font-size: 0.8em;
-      padding-top: 1px;
+      padding: 1px 0;
     }
 
     tbody {
@@ -117,10 +116,11 @@
         width: 22px;
 
         a {
-          @include rounded;
+          border-radius: 3px;
           color: #666666;
-          font-weight: bold;
+          display: block;
           font-size: 0.85em;
+          font-weight: bold;
           padding: 4px;
 
           &.ui-state-active {

From f92ebcf8c676a7582af4639b8d3738c3e366f833 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 26 Mar 2015 01:02:42 -0400
Subject: [PATCH 029/170] Remove rounded mixin

The border-radius property has wide support and has a helpful
shorthand. These values will be configured.
---
 .../stylesheets/active_admin/mixins/_all.scss |  1 -
 .../active_admin/mixins/_rounded.scss         | 22 -------------------
 2 files changed, 23 deletions(-)
 delete mode 100644 app/assets/stylesheets/active_admin/mixins/_rounded.scss

diff --git a/app/assets/stylesheets/active_admin/mixins/_all.scss b/app/assets/stylesheets/active_admin/mixins/_all.scss
index 864727b1c37..98db45b1048 100644
--- a/app/assets/stylesheets/active_admin/mixins/_all.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_all.scss
@@ -1,6 +1,5 @@
 @import "active_admin/mixins/variables";
 @import "active_admin/mixins/gradients";
-@import "active_admin/mixins/rounded";
 @import "active_admin/mixins/buttons";
 @import "active_admin/mixins/sections";
 @import "active_admin/mixins/utilities";
diff --git a/app/assets/stylesheets/active_admin/mixins/_rounded.scss b/app/assets/stylesheets/active_admin/mixins/_rounded.scss
deleted file mode 100644
index 4e8201d4f62..00000000000
--- a/app/assets/stylesheets/active_admin/mixins/_rounded.scss
+++ /dev/null
@@ -1,22 +0,0 @@
-@mixin rounded($radius: 3px) {
-  border-radius: $radius;
-}
-
-@mixin rounded-all($top-left:3px, $top-right:3px, $bottom-right:3px, $bottom-left:3px) {
-  border-top-right-radius: $top-right;
-  border-top-left-radius: $top-left;
-  border-bottom-right-radius: $bottom-right;
-  border-bottom-left-radius: $bottom-left;
-}
-
-@mixin rounded-top($radius: 3px) {
-  @include rounded(0);
-  border-top-right-radius: $radius;
-  border-top-left-radius: $radius;
-}
-
-@mixin rounded-bottom($radius: 3px) {
-  @include rounded(0);
-  border-bottom-right-radius: $radius;
-  border-bottom-left-radius: $radius;
-}

From f370177c75a53d483fbac64d7815ca619ae3c41d Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 26 Mar 2015 01:03:35 -0400
Subject: [PATCH 030/170] Apply better padding default for form controls

No need to make padding so large.
---
 app/assets/stylesheets/active_admin/_forms.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 582891fa71f..928968eb31a 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -130,7 +130,7 @@ form {
     border: $border-width solid #c9d0d6;
     border-radius: 3px;
     outline: none;
-    padding: 8px $text-input-horizontal-padding 7px;
+    padding: 6px 8px;
 
     &:focus {
       border: $border-width solid #99a2aa;

From eee34147910578ba1507212c77cec3b502082642 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 26 Mar 2015 01:04:07 -0400
Subject: [PATCH 031/170] DRYify including section mixin

---
 .../stylesheets/active_admin/components/_panels.scss   | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_panels.scss b/app/assets/stylesheets/active_admin/components/_panels.scss
index dc28c04a829..d358d8773b8 100644
--- a/app/assets/stylesheets/active_admin/components/_panels.scss
+++ b/app/assets/stylesheets/active_admin/components/_panels.scss
@@ -1,6 +1,6 @@
 // ----------------------------------- Helper class to apply to elements to make them sections
-.section, .panel{ @include section; }
-
-// ----------------------------------- Sidebar Sections
-
-.sidebar_section { @include section; }
+.section,
+.panel,
+.sidebar_section {
+  @include section;
+}

From 4ba4bedf94c24332bc5d6fedc959eef5e18bf972 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 27 Mar 2015 01:13:31 -0400
Subject: [PATCH 032/170] Remove unnecessary br tags

Causing excessive bottom padding in login panel (logged_out view)
---
 app/views/active_admin/devise/shared/_links.erb | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/app/views/active_admin/devise/shared/_links.erb b/app/views/active_admin/devise/shared/_links.erb
index 9daf5702436..63813da717f 100644
--- a/app/views/active_admin/devise/shared/_links.erb
+++ b/app/views/active_admin/devise/shared/_links.erb
@@ -1,27 +1,27 @@
 <%- if controller_name != 'sessions' %>
   <% scope = Devise::Mapping.find_scope!(resource_name) %>
-  <%= link_to t('active_admin.devise.links.sign_in'), send(:"new_#{scope}_session_path") %><br />
+  <%= link_to t('active_admin.devise.links.sign_in'), send(:"new_#{scope}_session_path") %>
 <% end -%>
 
 <%- if devise_mapping.registerable? && controller_name != 'registrations' %>
-  <%= link_to t('active_admin.devise.links.sign_up'), new_registration_path(resource_name) %><br />
+  <%= link_to t('active_admin.devise.links.sign_up'), new_registration_path(resource_name) %>
 <% end -%>
 
 <%- if devise_mapping.recoverable? && controller_name != 'passwords' %>
-  <%= link_to t('active_admin.devise.links.forgot_your_password'), new_password_path(resource_name) %><br />
+  <%= link_to t('active_admin.devise.links.forgot_your_password'), new_password_path(resource_name) %>
 <% end -%>
 
 <%- if devise_mapping.confirmable? && controller_name != 'confirmations' %>
-  <%= link_to t('active_admin.devise.links.resend_confirmation_instructions'), new_confirmation_path(resource_name) %><br />
+  <%= link_to t('active_admin.devise.links.resend_confirmation_instructions'), new_confirmation_path(resource_name) %>
 <% end -%>
 
 <%- if devise_mapping.lockable? && resource_class.unlock_strategy_enabled?(:email) && controller_name != 'unlocks' %>
-  <%= link_to t('active_admin.devise.links.resend_unlock_instructions'), new_unlock_path(resource_name) %><br />
+  <%= link_to t('active_admin.devise.links.resend_unlock_instructions'), new_unlock_path(resource_name) %>
 <% end -%>
 
 <%- if devise_mapping.omniauthable? %>
   <%- resource_class.omniauth_providers.each do |provider| %>
     <%= link_to t('active_admin.devise.links.sign_in_with_omniauth_provider', provider: provider.to_s.titleize),
-          omniauth_authorize_path(resource_name, provider) %><br />
+          omniauth_authorize_path(resource_name, provider) %>
   <% end -%>
 <% end -%>

From ebb12994f8d362a33cf29681ea02a49990e7e931 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 27 Mar 2015 01:15:20 -0400
Subject: [PATCH 033/170] Simplify selectors and styles

Make it easier to override by not having such heavy selectors. Remove
background color on panel header as it competes with the login button.
Keep the theme plain.
---
 .../active_admin/pages/_logged_out.scss       | 50 ++++++++-----------
 1 file changed, 22 insertions(+), 28 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/pages/_logged_out.scss b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
index ede936f470b..d15844d5cfb 100644
--- a/app/assets/stylesheets/active_admin/pages/_logged_out.scss
+++ b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
@@ -1,40 +1,34 @@
 body.logged_out {
-  background: #e8e9ea;
+  background-color: #e8e9ea;
+}
 
-  #content_wrapper{
-    width: 500px;
-    margin: 70px auto;
-    #active_admin_content {
-      background: #fff;
-      border-radius: 4px;
-      padding: 13px 30px;
-    }
-  }
+#login {
+  background-color: #fff;
+  border-radius: 4px;
+  margin: 70px auto;
+  padding: 15px;
+  width: 500px;
 
   h2 {
-    @include section-header;
-    background-color: darken($primary-color, 7%);
-    color: #fff;
-    margin: -13px -30px 20px -30px;
+    font-size: 1.8em;
   }
 
-  #login {
-    /* Login Form */
-    form {
-      fieldset {
-        background: none;
-        padding: 0;
-        li { padding: 10px 0; }
+  fieldset.inputs {
+    background-color: transparent;
+    margin-bottom: 0;
+    padding: 0;
 
-        input[type=text], input[type=email], input[type=password] {
-          width: 70%;
-        }
-        &.buttons { margin-left: 20%; }
-        margin-bottom: 0;
-      }
+    li {
+      padding: 10px 0;
     }
 
-    a { float: right; margin-top: -32px; }
+    input[type=text], input[type=email], input[type=password] {
+      width: 79%;
+    }
   }
 
+  a {
+    float: right;
+    margin-top: -55px;
+  }
 }

From 6bda1fbe04c0e165481a48eb5488d1c3b9499c61 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 27 Mar 2015 01:16:01 -0400
Subject: [PATCH 034/170] Streamline segmented control styles

---
 .../active_admin/components/_table_tools.scss | 38 +++++--------------
 1 file changed, 9 insertions(+), 29 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_table_tools.scss b/app/assets/stylesheets/active_admin/components/_table_tools.scss
index be72735c9b2..0b64b2edbba 100644
--- a/app/assets/stylesheets/active_admin/components/_table_tools.scss
+++ b/app/assets/stylesheets/active_admin/components/_table_tools.scss
@@ -1,6 +1,6 @@
 .table_tools {
   @include clearfix;
-  margin-bottom: 16px;
+  margin-bottom: 15px;
 }
 
 .table_tools .dropdown_menu {
@@ -9,57 +9,37 @@
 
 a.table_tools_button, .table_tools .dropdown_menu_button {
   @include light-button;
-  @include gradient(#FFFFFF, #F0F0F0);
-  @include border-colors(#d9d9d9, #d0d0d0, #c5c5c5);
-  font-size: 0.9em;
-  padding: 4px 14px 4px;
-  margin: 0;
-
-  &:not(.disabled) {
-    &:hover {
-      @include gradient(#FFFFFF, #F6F6F6);
-    }
-
-    &:active {
-      @include border-colors(#d7d7d7, #c8c8c8, #c3c3c3);
-      @include gradient(#FFFFFF, #E8E8E8);
-    }
-  }
+  font-weight: normal;
+  padding: 4px 10px;
 }
 
 .table_tools_segmented_control {
+  @include clearfix;
   list-style-type: none;
-  padding: 0;
   margin: 0;
+  padding: 0;
 
   li {
     float: left;
 
-    a {
-      border-width: 1px .5px 1px .5px;
-      border-radius: 0;
+    & + li a {
+      border-left-width: 0;
     }
 
     &:first-child a {
-      border-left-width: 1px;
-      border-top-left-radius: 12px;
-      border-bottom-left-radius: 12px;
+      border-radius: 0.25em 0 0 0.25em;
     }
 
     &:last-child a {
-      border-right-width: 1px;
-      border-top-right-radius: 12px;
-      border-bottom-right-radius: 12px;
+      border-radius: 0 0.25em 0.25em 0;
     }
 
     &.selected a {
       @include gradient(#F0F0F0, #FDFDFD);
-      cursor: default;
 
       &:hover {
         @include gradient(#F0F0F0, #FDFDFD);
       }
     }
-
   }
 }

From 35f9bf3dac3bbb89f579743253bbaa3acf9eb7fe Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 27 Mar 2015 01:17:10 -0400
Subject: [PATCH 035/170] Apply font-family directly on body element

Remove sans-family and typography mixin as its no longer needed. This
will be configured. No other components need font-family explicitly set
as it will inherit the value, even forms (normalize took care of that
issue for us).
---
 app/assets/stylesheets/active_admin/_base.scss              | 2 +-
 app/assets/stylesheets/active_admin/mixins/_all.scss        | 1 -
 app/assets/stylesheets/active_admin/mixins/_typography.scss | 3 ---
 3 files changed, 1 insertion(+), 5 deletions(-)
 delete mode 100644 app/assets/stylesheets/active_admin/mixins/_typography.scss

diff --git a/app/assets/stylesheets/active_admin/_base.scss b/app/assets/stylesheets/active_admin/_base.scss
index e9e11b328a4..ade05aac116 100644
--- a/app/assets/stylesheets/active_admin/_base.scss
+++ b/app/assets/stylesheets/active_admin/_base.scss
@@ -37,7 +37,7 @@
 }
 
 body {
-  @include sans-family;
+  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
   line-height: 1.5;
   font-size: 72%;
   background: $body-background-color;
diff --git a/app/assets/stylesheets/active_admin/mixins/_all.scss b/app/assets/stylesheets/active_admin/mixins/_all.scss
index 98db45b1048..26fae7cc3b5 100644
--- a/app/assets/stylesheets/active_admin/mixins/_all.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_all.scss
@@ -3,5 +3,4 @@
 @import "active_admin/mixins/buttons";
 @import "active_admin/mixins/sections";
 @import "active_admin/mixins/utilities";
-@import "active_admin/mixins/typography";
 @import "bourbon";
diff --git a/app/assets/stylesheets/active_admin/mixins/_typography.scss b/app/assets/stylesheets/active_admin/mixins/_typography.scss
deleted file mode 100644
index 8ec668216ff..00000000000
--- a/app/assets/stylesheets/active_admin/mixins/_typography.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-@mixin sans-family {
-  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
-}

From 2814af762cfc794215720f099fe08d7f26c688aa Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 27 Mar 2015 01:26:11 -0400
Subject: [PATCH 036/170] Drastic streamline of dropdown_menu styles and script
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Several properties where specified twice on the same selector! Ouch.
Keep the theme very basic here as well so we can clean out a lot of
styles. No need for top arrow on dropdown list or excessive spacing.
Further positioning doesn’t need to happen at all in JS, we can do
everything we need to in CSS. Further decrease selector weight.
Consider removing underline on links by default? We are using primary
color on them.
---
 .../active_admin/lib/dropdown-menu.js.coffee  |  31 ---
 .../components/_dropdown_menu.scss            | 179 +++++-------------
 2 files changed, 43 insertions(+), 167 deletions(-)

diff --git a/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee b/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee
index bdb7b7c0233..062f2c41370 100644
--- a/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee
@@ -21,11 +21,8 @@ class ActiveAdmin.DropdownMenu
   open: ->
     @isOpen = true
     @$menuList.fadeIn @options.fadeInDuration
-
-    @_position()
     @
 
-
   close: ->
     @isOpen = false
     @$menuList.fadeOut this.options.fadeOutDuration
@@ -56,8 +53,6 @@ class ActiveAdmin.DropdownMenu
   # Private
 
   _buildMenuList: ->
-    @$nipple = $('<div class="dropdown_menu_nipple"></div>')
-    @$menuList.prepend @$nipple
     @$menuList.hide()
 
   _bind: ->
@@ -69,32 +64,6 @@ class ActiveAdmin.DropdownMenu
         if @isOpen then @close() else @open()
       false
 
-  _position: ->
-    @$menuList.css 'top', @$menuButton.position().top + @$menuButton.outerHeight() + 10
-
-    button_left = @$menuButton.position().left
-    button_center =  @$menuButton.outerWidth() / 2
-    button_right = button_left + button_center * 2
-    menu_center = @$menuList.outerWidth() / 2
-    nipple_center = @$nipple.outerWidth() / 2
-    window_right = $(window).width()
-
-    centered_menu_left = button_left + button_center - menu_center
-    centered_menu_right = button_left + button_center + menu_center
-
-    if centered_menu_left < 0
-      # Left align with button
-      @$menuList.css 'left', button_left
-      @$nipple.css   'left', button_center - nipple_center
-    else if centered_menu_right > window_right
-      # Right align with button
-      @$menuList.css 'right', window_right - button_right
-      @$nipple.css   'right', button_center - nipple_center
-    else
-      # Center align under button
-      @$menuList.css 'left', centered_menu_left
-      @$nipple.css   'left', menu_center - nipple_center
-
 $.widget.bridge 'aaDropdownMenu', ActiveAdmin.DropdownMenu
 
 $(document).on 'ready page:load turbolinks:load', ->
diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index ea7c2332674..31aafb90013 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -1,148 +1,55 @@
 .dropdown_menu {
-  display: inline;
-
-  .dropdown_menu_button {
-    @include light-button;
-    position: relative;
-    padding-right: 22px !important;
-    cursor: pointer;
-
-    &:before {
-      content: ' ';
-      position: absolute;
-      width: 0;
-      height: 0;
-      border-width: 3px 3px 0;
-      border-style: solid;
-      border-color: #FFF transparent;
-      right: 12px;
-      top: 45%;
-    }
-
-    &:after {
-      content: ' ';
-      position: absolute;
-      width: 0;
-      height: 0;
-      border-width: 3px 3px 0;
-      border-style: solid;
-      border-color: #777 transparent;
-      right: 12px;
-      top: 45%;
-    }
-  }
-
-  .dropdown_menu_nipple {
+  display: inline-block;
+  position: relative;
+}
 
-    // The nipple's border
-    content: "";
+.dropdown_menu_button,
+.dropdown_menu .dropdown_menu_button { // needed to outweigh a,a:link,.. selectors
+  @include light-button;
+  position: relative;
+  padding-right: 22px;
+
+  &:after {
+    content: '';
+    border-left: 4px solid transparent;
+    border-right: 4px solid transparent;
+    border-top: 4px dashed;
+    height: 0;
     position: absolute;
-    top: -6px;
-    display: block;
+    right: 11px;
+    top: 45%;
     width: 0;
-    height: 0;
-    border-width: 0 6px 6px;
-    border-style: solid;
-    border-color: darken($primary-color, 4%) transparent;
-    z-index: 100;
-
-    // The nipple's inner shadow
-
-    &:before {
-      content: ' ';
-      position: absolute;
-      width: 0;
-      height: 0;
-      border-width: 0 5px 5px;
-      border-style: solid;
-      border-color: lighten($primary-color, 15%) transparent;
-      left: -5px;
-      top: 1px;
-    }
-
-    // The nipple's background color
-
-    &:after {
-      content: ' ';
-      position: absolute;
-      width: 0;
-      height: 0;
-      border-width: 0 5px 5px;
-      border-style: solid;
-      border-color: lighten($primary-color, 4%) transparent;
-      left: -5px;
-      top: 2px;
-    }
   }
+}
 
-  .dropdown_menu_list_wrapper {
-    display: inline-block;
-    position: absolute;
-    background-color: white;
-    padding: 2px;
-    box-shadow: rgba(0,0,0,0.4) 0 1px 3px;
-    background-color: $primary-color;
-    @include gradient(lighten($primary-color, 4%), darken($primary-color, 5%));
-    border: solid 1px darken($primary-color, 10%);
-    border-top-color: darken($primary-color, 4%);
-    border-bottom-color: darken($primary-color, 17%);
-    border-radius: 4px;
-    z-index: 2000;
-    display: none;
+.dropdown_menu_list_wrapper {
+  display: none;
+  left: 0;
+  position: absolute;
+  top: 100%;
+  z-index: 2000;
+}
 
-    .dropdown_menu_list {
+.dropdown_menu_list {
+  background-color: #FFF;
+  border: 1px solid #c7c7c7;
+  border-radius: 3px;
+  box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
+  display: block;
+  list-style-type: none;
+  margin: 2px 0 0 0;
+  min-width: 160px;
+  padding: 5px 0;
+
+  > li {
+    > a {
       display: block;
-      background-color: #FFF;
-      border: solid 1px darken($primary-color, 10%);
-      border-radius: 3px;
-      margin: 0;
-      overflow: hidden;
-      padding: 8px;
-
-      list-style-type: none;
-      padding: 0;
-
-      li {
-        display: block;
-        border-bottom: solid 1px #ebebeb;
-
-        a {
-          display: block;
-          box-sizing: padding-box;
-          font-size: 0.95em;
-          font-weight: bold;
-          padding: 7px 16px 5px;
-          text-decoration: none;
-          text-align: center;
-          white-space: nowrap;
-
-          &:hover {
-            @include highlight-gradient;
-            color: #FFF;
-          }
-
-          &:active {
-            @include reverse-highlight-gradient;
-            color: #FFF;
-          }
-
-        }
-
-        &:first-child {
-          a {
-            border-top-left-radius: 2px;
-            border-top-right-radius: 2px;
-          }
-
-        }
+      padding: 4px 15px;
+      text-decoration: none;
+      white-space: nowrap;
 
-        &:last-child {
-          a {
-            border-bottom-left-radius: 2px;
-            border-bottom-right-radius: 2px;
-          }
-          border: none;
-        }
+      &:hover {
+        background-color: #e9e9e9;
       }
     }
   }

From 3f5c5a3ab2d5ec21349b339f74101445594923fe Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 27 Mar 2015 01:26:19 -0400
Subject: [PATCH 037/170] Remove unused border-colors mixin

---
 .../stylesheets/active_admin/mixins/_utilities.scss       | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/mixins/_utilities.scss b/app/assets/stylesheets/active_admin/mixins/_utilities.scss
index 3fb5842b7f2..e2ee99d10bc 100644
--- a/app/assets/stylesheets/active_admin/mixins/_utilities.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_utilities.scss
@@ -9,11 +9,3 @@
     clear: both;
   }
 }
-
-@mixin border-colors($top, $sides, $bottom) {
-  border-color: $sides;
-  border-top-color: $top;
-  border-right-color: $sides;
-  border-bottom-color: $bottom;
-  border-left-color: $sides;
-}

From 8f45701e13e0ed0e935471750c489c87bcb0cb82 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 27 Mar 2015 21:01:41 -0400
Subject: [PATCH 038/170] Remove styles that have no effect

---
 .../stylesheets/active_admin/components/_dropdown_menu.scss | 4 ++--
 .../stylesheets/active_admin/components/_table_tools.scss   | 6 +-----
 2 files changed, 3 insertions(+), 7 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index 31aafb90013..9cef592c8a3 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -6,14 +6,14 @@
 .dropdown_menu_button,
 .dropdown_menu .dropdown_menu_button { // needed to outweigh a,a:link,.. selectors
   @include light-button;
-  position: relative;
   padding-right: 22px;
+  position: relative;
 
   &:after {
-    content: '';
     border-left: 4px solid transparent;
     border-right: 4px solid transparent;
     border-top: 4px dashed;
+    content: '';
     height: 0;
     position: absolute;
     right: 11px;
diff --git a/app/assets/stylesheets/active_admin/components/_table_tools.scss b/app/assets/stylesheets/active_admin/components/_table_tools.scss
index 0b64b2edbba..dd81388adcf 100644
--- a/app/assets/stylesheets/active_admin/components/_table_tools.scss
+++ b/app/assets/stylesheets/active_admin/components/_table_tools.scss
@@ -3,11 +3,7 @@
   margin-bottom: 15px;
 }
 
-.table_tools .dropdown_menu {
-  float: left;
-}
-
-a.table_tools_button, .table_tools .dropdown_menu_button {
+a.table_tools_button {
   @include light-button;
   font-weight: normal;
   padding: 4px 10px;

From b77295daf01f63c23ca97242a102bf2bb04f9e89 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 27 Mar 2015 21:02:03 -0400
Subject: [PATCH 039/170] Fix cursor typo and add pointer cursor as default

---
 app/assets/stylesheets/active_admin/mixins/_buttons.scss | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index aaefc520f77..fd03d481a3c 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -1,5 +1,6 @@
 @mixin basic-button {
   border-radius: 0.25em;
+  cursor: pointer;
   display: inline-block;
   font-size: 1.0em;
   font-weight: bold;
@@ -8,7 +9,7 @@
   text-decoration: none;
 
   &.disabled {
-    cursor: now-allowed;
+    cursor: not-allowed;
     opacity: 0.5;
   }
 }

From cdc5abc64b7790ba416aeb0b6cbbb1677536b565 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 27 Mar 2015 22:13:07 -0400
Subject: [PATCH 040/170] Simplify action_item selector and format changes

---
 .../active_admin/structure/_title_bar.scss           | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/structure/_title_bar.scss b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
index a78e4ece9f6..3d8a1205f15 100644
--- a/app/assets/stylesheets/active_admin/structure/_title_bar.scss
+++ b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
@@ -16,16 +16,16 @@
     font-weight: bold;
   }
 
-  .action_items {
-    span.action_item {
-      & > a, & > .dropdown_menu > a {
-        @include light-button;
-      }
+  .action_item {
+    & > a,
+    & > .dropdown_menu > a {
+      @include light-button;
     }
   }
 }
 
-#titlebar_left, #titlebar_right {
+#titlebar_left,
+#titlebar_right {
   display: table-cell;
   height: 50px; // acts as minimum height
   vertical-align: middle;

From 3547113f6cba0af10b8b46b9095581581dec9d24 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 27 Mar 2015 22:54:34 -0400
Subject: [PATCH 041/170] Major forms revamp
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* removed separator (can be done in CSS if necessary)
* add “action” class on cancel button for consistent selecting
* simplified form selectors and removed styles not having any effect as
much as possible

I can do a lot more but the code for generating forms is rather dynamic
and hard to follow. I’ll need more time to give this a bigger revamp.
Most important is I’d like to standardize some classes on components
rather than targeting elements in specific areas. Keeps both our HTML
and CSS simple and predictable.

Conflicts:
	app/assets/stylesheets/active_admin/_forms.scss
	lib/active_admin/form_builder.rb
---
 .../stylesheets/active_admin/_forms.scss      | 380 ++++++++----------
 .../active_admin/mixins/_variables.scss       |   2 +-
 lib/active_admin/form_builder.rb              |   2 +-
 .../inputs/filters/date_range_input.rb        |  16 +-
 spec/unit/filters/filter_form_builder_spec.rb |   3 -
 5 files changed, 185 insertions(+), 218 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 928968eb31a..61401169652 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -1,35 +1,65 @@
 //= depend_on_asset "active_admin/datepicker/datepicker-input-icon.png"
-// -------------------------------------- Active Admin Forms
-form {
-  /* Reset margins & Padding */
-  ul, ol, li, fieldset, legend, input, textarea, select, p { margin:0; padding:0; }
-  ol, ul { list-style: none }
+
+input[type=text],
+input[type=password],
+input[type=email],
+input[type=number],
+input[type=url],
+input[type=tel],
+textarea {
+  border: $border-width solid #c9d0d6;
+  border-radius: 3px;
+  outline: none;
+  padding: 6px 8px;
+  width: calc(80% - #{$text-input-total-padding});
+
+  &:focus {
+    border: $border-width solid #99a2aa;
+    box-shadow: 0 0 4px #99a2aa;
+  }
+}
+
+.formtastic {
+  ol, ul {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+
+  .input {
+    margin-bottom: 15px;
+  }
+
+  .label {
+    color: $form-label-color;
+    display: block;
+    float: left;
+    font-weight: bold;
+    width: 20%;
+
+    abbr {
+      border: none;
+      color:  $required-field-marker-color;
+      margin-left: 0.3em;
+    }
+  }
 
   fieldset {
     border: 0;
-    padding: 10px 0;
-    margin-bottom: 20px;
+    margin: 0 0 20px 0;
+    padding: 0;
 
-    &.inputs { @include section-background; }
+    &.inputs {
+      @include section-background;
+      padding: 10px;
+    }
 
     legend {
       width: 100%;
-      span { display: block; @include section-header; }
-    }
 
-    ol > li {
-      padding: 10px;
-      label {
+      span {
         display: block;
-        width: 20%;
-        float: left;
-        font-size: 1.0em;
-        font-weight: bold;
-        color: $form-label-color;
-        abbr {
-          border: none;
-          color:  $required-field-marker-color;
-        }
+        @include section-header;
       }
     }
 
@@ -78,172 +108,102 @@ form {
     }
   }
 
-  /* Nested Fieldsets and Legends */
+  /* Nested Fieldsets and Legends (radio, check boxes and date/time inputs use nested fieldsets) */
 
-  fieldset > ol > li {
-    fieldset {
-      position:relative;
-      padding: 0;
-      margin-bottom: 0;
-
-      legend {
-        position:absolute;
-        width:95%;
-        padding-top:0.1em;
-        left: 0px;
-        font-size: 100%;
-        font-weight: normal;
-        span { position:absolute; }
-        &.label label { position:absolute; }
-      }
+  legend.label {
+    font-size: inherit;
+    left: 0;
+    padding-top: 0.1em;
+    position: absolute
+  }
 
-      &:not(.has_many_fields) ol {
-        float: left;
-        width: 74%;
-        margin: 0;
-        padding: 0 0 0 20%;
+  .choices-group,
+  .fragments-group {
+    float: left;
+    padding: 0 0 0 20%;
+    width: 74%;
+  }
 
-        li {
-          padding: 0;
-          border: 0;
-        }
-      }
+  .choice,
+  .fragment {
+    margin: 0 0 0.5em 0;
+  }
 
-      &.has_many_fields ol {
-        float: left;
-        width: 100%;
-        margin: 0;
-      }
+  .fragment {
+    display: inline-block;
+    margin: 0 5px 0 0;
+    width: auto;
+
+    label {
+      display: none;
     }
   }
 
-  /* Text Fields */
-  input[type=text],
-  input[type=password],
-  input[type=email],
-  input[type=number],
-  input[type=url],
-  input[type=tel],
-  input[type=date],
-  textarea {
-    width: calc(80% - #{$text-input-total-padding});
-    border: $border-width solid #c9d0d6;
-    border-radius: 3px;
-    outline: none;
-    padding: 6px 8px;
+  /* BOOLEAN OVERRIDES */
 
-    &:focus {
-      border: $border-width solid #99a2aa;
-      box-shadow: 0 0 4px #99a2aa;
-    }
+  .boolean input,
+  .choice input {
+    margin: 0 0.3em 0 0;
   }
 
-  input[type=date] {
-    width: calc(100% - #{$text-input-total-padding});
+  .boolean label {
+    padding-left:20%;
+    padding-right: 10px;
+    width: 80%;
   }
 
   fieldset > ol > li {
+    fieldset {
+      position:relative;
+      padding: 0;
+      margin: 0;
 
-    /* Hints */
-    p.inline-hints {
-      font-size: 0.95em;
-      font-style: italic;
-      color:#666;
-      margin: 0.5em 0 0 20%;
-    }
-
-    /* Date and Time Fields */
-    &.date_select, &.time_select, &.datetime_select {
-      fieldset ol li {
-        float:left; width:auto; margin:0 0.5em 0 0;
-        label { display: none; }
-        input { display:inline; margin:0; padding:0;  }
-      }
-    }
-
-    /* Check Boxes or Radio fields */
-    &.check_boxes, &.radio {
-      fieldset ol {
-        margin-bottom:-0.6em;
-        li {
-          margin:0.1em 0 0.5em 0;
-          label {
-            float:none;
-            width:100%;
-            input { margin-right:0.2em; }
-          }
-        }
-      }
-    }
-
-    /* Boolean Field */
-    &.boolean {
-      min-height: 1.1em;
-      label {
-        width: 80%;
-        padding-left:20%;
-        padding-right: 10px;
-        text-transform: none !important;
-        font-weight: normal;
-        input { margin:0 0.5em 0 0.2em; }
+      &.has_many_fields ol {
+        float: left;
+        width: 100%;
+        margin: 0;
       }
     }
+  }
 
-    /* Hidden fields */
-    &.hidden {
-      padding: 0;
-    }
-
-    /* Errors */
-    p.inline-errors {
-      color: $error-color;
-      font-weight: bold;
-      margin:0.3em 0 0 20%;
-    }
-    ul.errors {
-      color: $error-color;
-      margin:0.5em 0 0 20%;
-      list-style:square;
-      li { padding:0; border:none; display:list-item; }
-    }
+  .inline-hints {
+    color: #999;
+    margin: 0.3em 0 0 20%;
+  }
 
-    &.error {
-      input[type=text], input[type=password], input[type=email], input[type=number], input[type=url], input[type=tel], textarea {
-        border: $border-width solid $error-color;
-      }
-    }
+  .inline-errors, .errors {
+    color: $error-color;
+    font-weight: bold;
+    margin: 0.3em 0 0 20%;
   }
 
-  /* semantic_errors */
-  ul.errors {
-    background: lighten($error-color, 60%);
+  .errors {
+    background-color: lighten($error-color, 60%);
     border-radius: 3px;
     color: $error-color;
-    font-weight: bold;
-    margin-bottom: 10px;
-    padding: 10px;
-    list-style:square;
-    li { margin-left:15px; padding:0; border:none; display:list-item; }
+    list-style-type: square;
+    margin: 0.5em 0 0 20%;
+    padding: 10px 10px 10px 25px;
+    width: calc(80% - 22px);
   }
 
-  /* Buttons */
+  // Buttons
 
   input[type=submit], input[type=button], button {
     @include dark-button;
-    cursor: pointer;
-
   }
 
-  .buttons, .actions {
-    margin-top: 15px;
-    input[type=submit], input[type=button], button { margin-right: 10px; }
+  .button,
+  .action {
+    display: inline-block;
+    margin-right: 0.5em;
   }
 
-  fieldset.buttons li, fieldset.actions li {
-    float:left;
-    padding: 0;
-
-    &.cancel a { @include light-button; }
+  .cancel {
+    a {
+      @include light-button;
+      @include icon(#777, 9px);
+    }
   }
 }
 
@@ -252,79 +212,81 @@ form {
 $sidebar-inner-content-width: $sidebar-width - ($section-padding * 2);
 
 .sidebar_section {
-
-  label {
-    color:  $form-label-color;
-    display: block;
-    font-weight: bold;
-    margin: 0 0 0.18em 2px;
-  }
-
   select {
     width: $sidebar-inner-content-width;
   }
 
-  input[type=text], input[type=password], input[type=email], input[type=url], input[type=tel], textarea {
+  input[type=text],
+  input[type=password],
+  input[type=email],
+  input[type=url],
+  input[type=tel],
+  textarea {
     width: $sidebar-inner-content-width - ($text-input-horizontal-padding * 2);
   }
-
 }
 
 // -------------------------------------- Filter Forms
 
 $filter-field-seperator-width: 12px;
 
-$side-by-side-filter-input-width: ($sidebar-inner-content-width / 2) - ($text-input-horizontal-padding * 2) - $filter-field-seperator-width;
-$side-by-side-filter-select-width: ($sidebar-inner-content-width / 2) - $filter-field-seperator-width;
+$side-by-side-filter-input-width: ($sidebar-inner-content-width / 2) - $filter-field-seperator-width;
+$side-by-side-filter-select-width: ($sidebar-inner-content-width / 2);
 
-$date-range-filter-input-right-padding: 27px;
-$date-range-filter-input-horizontal-padding: $date-range-filter-input-right-padding + $text-input-horizontal-padding;
-$date-range-filter-input-width: ($sidebar-inner-content-width / 2) - $filter-field-seperator-width - $date-range-filter-input-horizontal-padding;
+$date-range-filter-input-right-padding: 25px;
 
-form.filter_form {
-  .filter_form_field {
-    margin-bottom: 10px;
-    clear: both;
+$date-range-filter-input-width: ($sidebar-inner-content-width / 2) - ($filter-field-seperator-width / 2);
 
-    &.select_and_search {
-      input[type=text] {
-        margin-left: $filter-field-seperator-width + 4;
-        width: $side-by-side-filter-input-width;
-      }
-      select {
-        width: $side-by-side-filter-select-width;
-      }
+.filter_form_field {
+  margin-bottom: 12px;
+
+  .label {
+    display: block;
+    margin: 0 0 0.18em 0;
+  }
+
+  &.select_and_search {
+    input[type=text] {
+      margin-left: $filter-field-seperator-width;
+      width: $side-by-side-filter-input-width;
     }
 
-    &.filter_check_boxes {
-      label { margin-bottom: 3px; }
-      fieldset {
-        margin-bottom: 0px;
-        padding-bottom: 0px;
-      }
-      .check_boxes_wrapper label {
-        font-weight: normal;
-        margin-bottom: 3px;
-        text-transform: none;
-        font-size: 1.0em;
-        input { vertical-align: baseline; }
-      }
+    select {
+      width: $side-by-side-filter-select-width;
     }
+  }
 
-    &.filter_date_range {
-      .seperator {
-        display: inline-block;
-        text-align: center;
-        width: $filter-field-seperator-width;
-      }
+  &.filter_date_range {
+    input {
+      background: #fff image-url('active_admin/datepicker/datepicker-input-icon.png') no-repeat 100% 6px;
+      padding-right: $date-range-filter-input-right-padding;
+      width: $date-range-filter-input-width;
+    }
 
-      input[type=text] {
-        background: #fff image-url('active_admin/datepicker/datepicker-input-icon.png') no-repeat 100% 7px;
-        padding-right: $date-range-filter-input-right-padding;
-        width: $date-range-filter-input-width;
-      }
+    input + input {
+      margin-left: 6px;
     }
   }
-  a.clear_filters_btn { @include light-button; }
 }
 
+.filter_check_boxes {
+  .choices {
+    border: none;
+    margin: 0;
+    padding: 0;
+
+    > label {
+      display: block;
+    }
+  }
+}
+
+.filter_form {
+  .buttons > * {
+    margin-right: 5px;
+  }
+
+  a.clear_filters_btn {
+    @include light-button;
+  }
+}
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 7637de072e0..04d73088d5b 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -28,7 +28,7 @@ $sidebar-width: 270px !default;
 $cell-padding: 5px 10px 3px 10px !default;
 $cell-horizontal-padding: 12px !default;
 $section-padding: 15px !default;
-$text-input-horizontal-padding: 10px !default;
+$text-input-horizontal-padding: 8px !default;
 $text-input-total-padding: $text-input-horizontal-padding * 2 + $border-width * 2;
 
 $blank-slate-border: 1px dashed #DADADA !default;
diff --git a/lib/active_admin/form_builder.rb b/lib/active_admin/form_builder.rb
index 911f4e04384..e01b26a65eb 100644
--- a/lib/active_admin/form_builder.rb
+++ b/lib/active_admin/form_builder.rb
@@ -22,7 +22,7 @@ class FormBuilder < ::Formtastic::FormBuilder
     self.action_class_finder = ::Formtastic::ActionClassFinder
 
     def cancel_link(url = {action: "index"}, html_options = {}, li_attrs = {})
-      li_attrs[:class] ||= "cancel"
+      li_attrs[:class] ||= "action cancel"
       li_content = template.link_to I18n.t('active_admin.cancel'), url, html_options
       template.content_tag(:li, li_content, li_attrs)
     end
diff --git a/lib/active_admin/inputs/filters/date_range_input.rb b/lib/active_admin/inputs/filters/date_range_input.rb
index 11821351c73..b66b44ecee9 100644
--- a/lib/active_admin/inputs/filters/date_range_input.rb
+++ b/lib/active_admin/inputs/filters/date_range_input.rb
@@ -7,9 +7,8 @@ class DateRangeInput < ::Formtastic::Inputs::StringInput
         def to_html
           input_wrapping do
             [ label_html,
-              builder.text_field(gt_input_name, input_html_options(gt_input_name)),
-              template.content_tag(:span, "-", class: "seperator"),
-              builder.text_field(lt_input_name, input_html_options(lt_input_name)),
+              builder.text_field(gt_input_name, input_html_options(gt_input_name, gt_input_placeholder)),
+              builder.text_field(lt_input_name, input_html_options(lt_input_name, lt_input_placeholder)),
             ].join("\n").html_safe
           end
         end
@@ -23,11 +22,20 @@ def lt_input_name
           "#{method}_lteq_date"
         end
 
-        def input_html_options(input_name = gt_input_name)
+        def gt_input_placeholder
+          I18n.t("active_admin.filters.predicates.starts_with")
+        end
+
+        def lt_input_placeholder
+          I18n.t("active_admin.filters.predicates.ends_with")
+        end
+
+        def input_html_options(input_name = gt_input_name, placeholder = gt_input_placeholder)
           current_value = @object.public_send input_name
           { size: 12,
             class: "datepicker",
             maxlength: 10,
+            placeholder: placeholder,
             value: current_value.respond_to?(:strftime) ? current_value.strftime("%Y-%m-%d") : "" }
         end
       end
diff --git a/spec/unit/filters/filter_form_builder_spec.rb b/spec/unit/filters/filter_form_builder_spec.rb
index 17c8aeca974..3feca27193c 100644
--- a/spec/unit/filters/filter_form_builder_spec.rb
+++ b/spec/unit/filters/filter_form_builder_spec.rb
@@ -159,9 +159,6 @@ def filter(name, options = {})
     it "should generate a date greater than" do
       expect(body).to have_selector("input.datepicker[name='q[created_at_gteq_date]']")
     end
-    it "should generate a seperator" do
-      expect(body).to have_selector("span.seperator")
-    end
     it "should generate a date less than" do
       expect(body).to have_selector("input.datepicker[name='q[created_at_lteq_date]']")
     end

From dae4077c7d2e39ee6dcf5b79afd08b23956c693a Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 27 Mar 2015 22:55:00 -0400
Subject: [PATCH 042/170] Adjust login styles due to form changes

---
 .../stylesheets/active_admin/pages/_logged_out.scss    | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/pages/_logged_out.scss b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
index d15844d5cfb..8cdc1565154 100644
--- a/app/assets/stylesheets/active_admin/pages/_logged_out.scss
+++ b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
@@ -18,17 +18,15 @@ body.logged_out {
     margin-bottom: 0;
     padding: 0;
 
-    li {
-      padding: 10px 0;
-    }
-
-    input[type=text], input[type=email], input[type=password] {
+    input[type=text],
+    input[type=email],
+    input[type=password] {
       width: 79%;
     }
   }
 
   a {
     float: right;
-    margin-top: -55px;
+    margin-top: -45px;
   }
 }

From 36a8258850e5f2d3b18ccd2d001827c067421445 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 27 Mar 2015 22:55:27 -0400
Subject: [PATCH 043/170] Simplify flash selectors and styles

---
 .../components/_flash_messages.scss           | 34 +++++++------------
 1 file changed, 12 insertions(+), 22 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_flash_messages.scss b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
index 02b112ba22e..565701847f0 100644
--- a/app/assets/stylesheets/active_admin/components/_flash_messages.scss
+++ b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
@@ -1,27 +1,17 @@
-body.logged_in {
-  .flash {
-    background-color: #f7f1d3;
-    color: #cb9810;
-    font-weight: bold;
-    font-size: 1.1em;
-    padding: 13px 30px 11px;
-    position: relative;
+.flash {
+  background-color: #f7f1d3;
+  color: #cb9810;
+  font-size: 1.1em;
+  font-weight: bold;
+  padding: 15px 30px;
 
-    &.flash_notice {
-      background-color: #ccdfcd;
-      color: #416347;
-    }
-    &.flash_error {
-      background-color: #f1dcdc;
-      color: #b33c33;
-    }
+  &.flash_notice {
+    background-color: #ccdfcd;
+    color: #416347;
   }
-}
 
-body.logged_out {
-  .flash {
-    color: #666;
-    font-weight: bold;
-    margin-bottom: 8px;
+  &.flash_error {
+    background-color: #f1dcdc;
+    color: #b33c33;
   }
 }

From 794802efb265f02669677524b8aa1aa754a951c0 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Sat, 28 Mar 2015 01:37:01 -0400
Subject: [PATCH 044/170] Misc style changes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Don’t need font-size: 1.0em as that’s the default size. Add border-box
for all pseudo elements. Alphabetize properties.
---
 app/assets/stylesheets/active_admin/_base.scss   | 10 +++++++---
 app/assets/stylesheets/active_admin/_forms.scss  |  2 +-
 app/assets/stylesheets/active_admin/_header.scss |  1 -
 3 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_base.scss b/app/assets/stylesheets/active_admin/_base.scss
index ade05aac116..53b69baecdd 100644
--- a/app/assets/stylesheets/active_admin/_base.scss
+++ b/app/assets/stylesheets/active_admin/_base.scss
@@ -35,11 +35,15 @@
 * {
   box-sizing: border-box;
 }
+*:before,
+*:after {
+  box-sizing: border-box;
+}
 
 body {
-  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
-  line-height: 1.5;
-  font-size: 72%;
   background: $body-background-color;
   color: $text-color;
+  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  font-size: 72%;
+  line-height: 1.5;
 }
diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 61401169652..cf1a7999165 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -187,7 +187,7 @@ textarea {
     width: calc(80% - 22px);
   }
 
-  // Buttons
+  /* Buttons */
 
   input[type=submit], input[type=button], button {
     @include dark-button;
diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index ead6bb37d75..3a7069e80f7 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -49,7 +49,6 @@
       margin-right: 4px;
       margin-top: 5px;
       margin-bottom: 5px;
-      font-size: 1.0em;
       position: relative;
 
       a {

From 8f9b5cfb4dd09780364f46a56d726b73661727e1 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Sat, 28 Mar 2015 01:38:06 -0400
Subject: [PATCH 045/170] Update search status panel HTML

Remove inline styles and update HTML structure.
---
 .../filters/resource_extension.rb             | 32 +++++++++----------
 1 file changed, 16 insertions(+), 16 deletions(-)

diff --git a/lib/active_admin/filters/resource_extension.rb b/lib/active_admin/filters/resource_extension.rb
index d6cbe45a8a5..12d7bb9f0f9 100644
--- a/lib/active_admin/filters/resource_extension.rb
+++ b/lib/active_admin/filters/resource_extension.rb
@@ -166,28 +166,28 @@ def search_status_section
         ActiveAdmin::SidebarSection.new I18n.t("active_admin.search_status.headline"), only: :index, if: -> { params[:q] || params[:scope] } do
           active = ActiveAdmin::Filters::Active.new(resource_class, params)
 
-          span do
-            h4 I18n.t("active_admin.search_status.current_scope"), style: 'display: inline'
-            b active.scope, style: "display: inline"
-
-            div style: "margin-top: 10px" do
-              h4 I18n.t("active_admin.search_status.current_filters"), style: 'margin-bottom: 10px'
-              ul do
-                if active.filters.blank?
-                  li I18n.t("active_admin.search_status.no_current_filters")
-                else
-                  active.filters.each do |filter|
-                    li do
-                      span filter.body
-                      b filter.value
-                    end
-                  end
+          para do
+            span I18n.t("active_admin.search_status.current_scope")
+            b active.scope
+          end
+
+          div I18n.t("active_admin.search_status.current_filters")
+          ul do
+            if active.filters.blank?
+              li I18n.t("active_admin.search_status.no_current_filters")
+            else
+              active.filters.each do |filter|
+                li do
+                  span filter.body
+                  b filter.value
+
                 end
               end
             end
           end
         end
       end
+
     end
 
   end

From 346671bd7ae0b1a0836fb3f164e994ee3d1cf728 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Sat, 28 Mar 2015 01:39:33 -0400
Subject: [PATCH 046/170] Default links have no underline, update button

On hover have normal links have an underline. Adjust button styles to
account for changes.
---
 .../active_admin/components/_dropdown_menu.scss     |  3 +--
 .../stylesheets/active_admin/components/_links.scss | 11 ++++++++---
 .../stylesheets/active_admin/mixins/_buttons.scss   | 13 ++++++++++++-
 3 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index 9cef592c8a3..5821024973a 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -3,8 +3,7 @@
   position: relative;
 }
 
-.dropdown_menu_button,
-.dropdown_menu .dropdown_menu_button { // needed to outweigh a,a:link,.. selectors
+.dropdown_menu_button {
   @include light-button;
   padding-right: 22px;
   position: relative;
diff --git a/app/assets/stylesheets/active_admin/components/_links.scss b/app/assets/stylesheets/active_admin/components/_links.scss
index 0e6a62c2d24..ffab04f40c5 100644
--- a/app/assets/stylesheets/active_admin/components/_links.scss
+++ b/app/assets/stylesheets/active_admin/components/_links.scss
@@ -1,5 +1,10 @@
-a, a:link, a:visited {
+a {
   color: $link-color;
-  text-decoration: underline;
+  text-decoration: none;
+
+  &:hover,
+  &:focus {
+    color: $link-color;
+    text-decoration: underline;
+  }
 }
-a:hover { text-decoration: none; }
diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index fd03d481a3c..f695973f215 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -5,9 +5,15 @@
   font-size: 1.0em;
   font-weight: bold;
   line-height: 1.5; // needed for input/button elements to match a.button size
-  padding: 6px 15px;
+  padding: 6px 10px;
   text-decoration: none;
 
+  &:hover,
+  &:focus {
+    color: $primary-color;
+    text-decoration: none;
+  }
+
   &.disabled {
     cursor: not-allowed;
     opacity: 0.5;
@@ -51,4 +57,9 @@
 
 @mixin dark-button {
   @include default-button;
+
+  &:hover,
+  &:focus {
+    color: #efefef;
+  }
 }

From f4407e3345070d72ebc9fee0a2fef53ebb84247b Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Sat, 28 Mar 2015 01:44:11 -0400
Subject: [PATCH 047/170] Streamline comments styles and layout
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Add new “commented on” text to locale. Need to translate for other
languages. Comment selectors are no longer nested unless necessary.
---
 .../active_admin/components/_comments.scss    | 53 ++++++-------------
 config/locales/en.yml                         |  1 +
 .../comments/views/active_admin_comments.rb   |  3 +-
 3 files changed, 20 insertions(+), 37 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_comments.scss b/app/assets/stylesheets/active_admin/components/_comments.scss
index 22743e76fdc..dc1d6c11891 100644
--- a/app/assets/stylesheets/active_admin/components/_comments.scss
+++ b/app/assets/stylesheets/active_admin/components/_comments.scss
@@ -1,40 +1,21 @@
-// -------------------------------------- Admin Notes
-.comments {
+.active_admin_comment {
+  margin-bottom: 25px;
+  max-width: 700px;
+}
 
-  .active_admin_comment {
-    clear: both;
-    margin-top: 10px;
-    margin-bottom: 40px;
-    max-width: 700px;
+.active_admin_comment_meta {
+  color: #999;
+  margin-bottom: 5px;
+}
 
-    .active_admin_comment_meta {
-      width: 130px;
-      float: left;
-      overflow: hidden;
-      font-size: 0.9em;
-      color: lighten($primary-color, 10%);
-      .active_admin_comment_author {
-        font-size: 1.2em;
-        font-weight: bold;
-        margin: 0;
-        color: $primary-color;
-      }
-    }
-    .active_admin_comment_body {
-      margin-left: 150px;
-    }
-  }
-  form.active_admin_comment {
-    margin: 0;
-    padding: 0;
-    margin-left: 150px;
+.active_admin_comment_author {
+  color: $primary-color;
+  font-weight: bold;
+  margin: 0;
+}
 
-    fieldset.inputs {
-      margin: 0;
-      padding: 0;
-      background: none;
-    }
-    li { padding: 0; }
-    fieldset.buttons { padding: 0; margin-top: 5px;}
-  }
+.active_admin_comment fieldset.inputs {
+  background-color: transparent;
+  margin: 0;
+  padding: 0;
 }
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 6ee2dd4bfb1..1d0a0323b00 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -88,6 +88,7 @@ en:
       title_content: "Comments (%{count})"
       errors:
         empty_text: "Comment wasn't saved, text was empty."
+      commented_on: "commented on"
     devise:
       username:
         title: "Username"
diff --git a/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb b/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
index bca28b5eb08..196cc70ef78 100644
--- a/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
+++ b/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
@@ -31,9 +31,10 @@ def build_comments
         def build_comment(comment)
           div for: comment do
             div class: 'active_admin_comment_meta' do
-              h4 class: 'active_admin_comment_author' do
+              span class: 'active_admin_comment_author' do
                 comment.author ? auto_link(comment.author) : I18n.t('active_admin.comments.author_missing')
               end
+              span I18n.t('active_admin.comments.commented_on')
               span pretty_format comment.created_at
               if authorized?(ActiveAdmin::Auth::DESTROY, comment)
                 text_node link_to I18n.t('active_admin.comments.delete'), comments_url(comment.id), method: :delete, data: { confirm: I18n.t('active_admin.comments.delete_confirmation') }

From df1b7258a2f62f388a76547c5bcb2509034e7d0c Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Sat, 28 Mar 2015 02:25:12 -0400
Subject: [PATCH 048/170] Update typography styles

---
 .../stylesheets/active_admin/_typography.scss | 112 +++++++-----------
 1 file changed, 40 insertions(+), 72 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_typography.scss b/app/assets/stylesheets/active_admin/_typography.scss
index 3eb0096f2ce..886d452ced3 100644
--- a/app/assets/stylesheets/active_admin/_typography.scss
+++ b/app/assets/stylesheets/active_admin/_typography.scss
@@ -1,90 +1,58 @@
-// Adapted from Blueprint CSS Framework
-//
-// Copyright (c) 2007 - 2010 blueprintcss.org
-//
-// Permission is hereby granted, free of charge, to any person
-// obtaining a copy of this software and associated documentation
-// files (the "Software"), to deal in the Software without
-// restriction, including without limitation the rights to use,
-// copy, modify, merge, publish, distribute, sublicense, and/or sell
-// copies of the Software, and to permit persons to whom the
-// Software is furnished to do so, subject to the following
-// conditions:
-//
-// The above copyright notice and this permission notice shall be
-// included in all copies or substantial portions of the Software.
-//
-// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
-// EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
-// OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
-// NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
-// HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
-// WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
-// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
-// OTHER DEALINGS IN THE SOFTWARE.
+h1, h2, h3, h4, h5, h6 {
+  color: $primary-color;
+}
 
-// Default font settings.  The font-size percentage is of 16px. (0.75 * 16px = 12px) */
-html { font-size:100.01%; }
-body { font-size: 75%; font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; }
+h1 {
+  font-size: 3em;
+  margin-bottom: 0.5em;
+}
 
-// Headings
-h1,h2,h3,h4,h5,h6 {
-  font-weight: normal;
-  color: $primary-color;
+h2 {
+  font-size: 2em;
+  margin-bottom: 0.75em;
 }
 
-h1 { font-size: 3em; line-height: 1; margin-bottom: 0.5em; }
-h2 { font-size: 2em; margin-bottom: 0.75em; }
-h3 { font-size: 1.5em; line-height: 1; margin-bottom: 1em; }
-h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; }
-h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; }
-h6 { font-size: 1em; font-weight: bold; }
+h3 {
+  font-size: 1.5em;
+  margin-bottom: 1em;
+}
 
+h4 {
+  font-size: 1.2em;
+  margin-bottom: 1.25em;
+}
+
+h5, h6 {
+  font-size: 1em;
+}
 
 p {
   margin: 0 0 1.5em;
-
-  .left     { margin: 1.5em 1.5em 1.5em 0; padding: 0; }
-  .right { margin: 1.5em 0 1.5em 1.5em; padding: 0; }
 }
 
-.left              { float: left !important; }
-.right             { float: right !important; }
+blockquote  {
+  color: #888;
+  margin: 1.5em;
+}
 
-blockquote  { margin: 1.5em; color: #666; font-style: italic; }
+pre {
+  line-height: 1;
+}
 
-abbr,
-acronym     { border-bottom: 1px dotted #666; }
-address     { margin: 0 0 1.5em; font-style: italic; }
-del         { color:#666; }
+pre,
+code {
+  font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
+}
 
-pre         { margin: 1.5em 0; white-space: pre; }
-pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; }
+ul, ol {
+  margin: 0 1.5em 1.5em 0;
+  padding-left: 1.5em;
+}
 
-// Lists
 li ul,
-li ol       { margin: 0; }
-ul, ol      { margin: 0 1.5em 1.5em 0; padding-left: 1.5em; }
-
-dl          { margin: 0 0 1.5em 0; }
-dl dt       { font-weight: bold; }
-dd          { margin-left: 1.5em;}
-
-// Helper Classes
-.small      { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; }
-.large      { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; }
-.hide       { display: none; }
-
-.quiet      { color: #666; }
-.loud       { color: #000; }
-.highlight  { background:#ff0; }
-.added      { background:#060; color: #fff; }
-.removed    { background:#900; color: #fff; }
-
-.first      { margin-left:0; padding-left:0; }
-.last       { margin-right:0; padding-right:0; }
-.top        { margin-top:0; padding-top:0; }
-.bottom     { margin-bottom:0; padding-bottom:0; }
+li ol {
+  margin: 0;
+}
 
 hr {
   border: none;

From 9a5458dbd9ec37b931e67e5f40a0ad2c068e55a7 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 31 Mar 2015 02:17:50 -0400
Subject: [PATCH 049/170] Fix form padding so legend renders correctly

---
 app/assets/stylesheets/active_admin/_forms.scss              | 5 ++++-
 .../stylesheets/active_admin/components/_comments.scss       | 4 ++++
 .../stylesheets/active_admin/components/_dropdown_menu.scss  | 2 +-
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index cf1a7999165..eb296e382be 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -51,7 +51,10 @@ textarea {
 
     &.inputs {
       @include section-background;
-      padding: 10px;
+
+      > ol {
+        padding: 15px;
+      }
     }
 
     legend {
diff --git a/app/assets/stylesheets/active_admin/components/_comments.scss b/app/assets/stylesheets/active_admin/components/_comments.scss
index dc1d6c11891..38dbe8020aa 100644
--- a/app/assets/stylesheets/active_admin/components/_comments.scss
+++ b/app/assets/stylesheets/active_admin/components/_comments.scss
@@ -18,4 +18,8 @@
   background-color: transparent;
   margin: 0;
   padding: 0;
+
+  & > ol {
+    padding: 0;
+  }
 }
diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index 5821024973a..dbc6601349c 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -35,7 +35,7 @@
   border-radius: 3px;
   box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
   display: block;
-  list-style-type: none;
+  list-style: none;
   margin: 2px 0 0 0;
   min-width: 160px;
   padding: 5px 0;

From e8563378cf8acca1b9f60179605c497719c78de8 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 31 Mar 2015 02:20:43 -0400
Subject: [PATCH 050/170] Replace nested menu image with CSS arrow

Simplifies styles and no need to load any images. Plus the arrow will
by default use whatever color is applied to link. Streamline header CSS
further and adjust horizontal padding.
---
 .../images/active_admin/nested_menu_arrow.gif | Bin 70 -> 0 bytes
 .../active_admin/nested_menu_arrow_dark.gif   | Bin 70 -> 0 bytes
 .../stylesheets/active_admin/_forms.scss      |   6 +-
 .../stylesheets/active_admin/_header.scss     |  76 ++++++++----------
 4 files changed, 37 insertions(+), 45 deletions(-)
 delete mode 100644 app/assets/images/active_admin/nested_menu_arrow.gif
 delete mode 100644 app/assets/images/active_admin/nested_menu_arrow_dark.gif

diff --git a/app/assets/images/active_admin/nested_menu_arrow.gif b/app/assets/images/active_admin/nested_menu_arrow.gif
deleted file mode 100644
index 878357fe4c3cc8df2bccb444a16b593af2941e54..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 70
zcmZ?wbhEHbWM^PuSj51vZ{NN>d-im6bWEK(_5c6>)z#GuV4(Pug^_`Ql|cu@1F2<T
T=8o8<`q^1SeC7l#Mh0sDIL#C-

diff --git a/app/assets/images/active_admin/nested_menu_arrow_dark.gif b/app/assets/images/active_admin/nested_menu_arrow_dark.gif
deleted file mode 100644
index 006372c8243d7711b7f29ce3fe05e31730445672..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 70
zcmZ?wbhEHbWM^PuSj51Po12@HljG^>84wWg|Nnm{Cnp9lQ2fcl$iTqLpabH8)G{!0
SN9<Dl?5rU^bAlElgEatam=F^H

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index eb296e382be..0e20d1cfb07 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -111,7 +111,7 @@ textarea {
     }
   }
 
-  /* Nested Fieldsets and Legends (radio, check boxes and date/time inputs use nested fieldsets) */
+  // Nested Fieldsets and Legends (radio, check boxes and date/time inputs use nested fieldsets)
 
   legend.label {
     font-size: inherit;
@@ -142,7 +142,7 @@ textarea {
     }
   }
 
-  /* BOOLEAN OVERRIDES */
+  // BOOLEAN OVERRIDES
 
   .boolean input,
   .choice input {
@@ -190,7 +190,7 @@ textarea {
     width: calc(80% - 22px);
   }
 
-  /* Buttons */
+  // Buttons
 
   input[type=submit], input[type=button], button {
     @include dark-button;
diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index 3a7069e80f7..34d33ec14bb 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -1,11 +1,8 @@
-//= depend_on_asset "active_admin/nested_menu_arrow.gif"
-//= depend_on_asset "active_admin/nested_menu_arrow_dark.gif"
-// ----------------------------------- Header
 .header {
   background-color: lighten($primary-color, 5%);
   display: table;
+  padding: 5px $horizontal-page-margin;
   width: 100%;
-  padding: 5px 0;
   z-index: 900;
 
   a, a:link, a:visited {
@@ -17,43 +14,42 @@
     color: #fff;
   }
 
-  h1 {
+  h1,
+  .tabs {
     display: table-cell;
     vertical-align: middle;
     white-space: nowrap;
+  }
+
+  h1 {
     color:  $page-header-text-color;
-    padding: 0 $horizontal-page-margin;
     font-size: 1.3em;
     font-weight: normal;
-    line-height: 1.2;
+    padding: 0;
 
     a:hover {
       color: #fff;
     }
   }
 
-  .header-item {
-    position: relative;
-  }
-
-  ul.tabs {
+  .tabs {
     display: table-cell;
-    height: 100%;
     margin: 0;
-    padding: 0;
-    vertical-align: middle;
+    padding: 0 20px;
     width: 100%;
 
     & > li {
       display: inline-block;
-      margin-right: 4px;
-      margin-top: 5px;
-      margin-bottom: 5px;
       position: relative;
 
+      & + li {
+        margin-left: 5px;
+      }
+
       a {
         border-radius: 4px;
-        padding: 6px 10px 4px 10px;
+        display: inline-block;
+        padding: 5px 10px;
         position: relative;
       }
 
@@ -62,14 +58,22 @@
         color: #fff;
       }
 
-      &.has_nested > a {
-        background: image-url('active_admin/nested_menu_arrow.gif') no-repeat calc(100% - 7px) 50%;
-        padding-right: 20px;
-      }
-
-      &.has_nested.current > a {
-        background: $current-menu-item-background image-url('active_admin/nested_menu_arrow_dark.gif') no-repeat calc(100% - 7px) 50%;
-        padding-right: 20px;
+      &.has_nested > a,
+      &.has_nested.current > a,
+      &.has_nested:hover > a {
+        padding-right: 22px;
+
+        &:after {
+          border-left: 4px solid transparent;
+          border-right: 4px solid transparent;
+          border-top: 4px dashed;
+          content: '';
+          height: 0;
+          position: absolute;
+          right: 10px;
+          top: 45%;
+          width: 0;
+        }
       }
 
       &:hover > a {
@@ -78,34 +82,26 @@
       }
 
       &.has_nested:hover > a {
-        border-bottom: 5px solid $hover-menu-item-background;
-        background: $hover-menu-item-background image-url('active_admin/nested_menu_arrow_dark.gif') no-repeat calc(100% - 7px) 50%;
+        border-radius: 4px 4px 0 0;
         z-index: 1020;
       }
 
-      /* Hover on li, display the ul */
       &:hover ul {
         display: block;
       }
 
-      /* Drop down menus */
       ul {
         background: $hover-menu-item-background;
         border-radius: 0 4px 4px 4px;
-        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
+        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.175);
         display: none;
         list-style: none;
-        margin-top: 5px;
         min-width: 175px;
         padding: 5px 0;
         position: absolute;
         z-index: 1010;
 
         li {
-          a {
-            display: block;
-          }
-
           &.current a,
           a:hover {
             color: #fff;
@@ -117,11 +113,7 @@
 }
 
 #utility_nav {
-  color: #aaa;
-  display: table-cell;
-  white-space: nowrap;
-  margin: 0;
   padding: 0;
-  padding-right: 26px;
   text-align: right;
+  white-space: nowrap;
 }

From 1fe557d0e6436709cc8b1b990fe00d0eef44a996 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 31 Mar 2015 02:21:50 -0400
Subject: [PATCH 051/170] Update horizontal page padding to be 20px now

Further update main_content right margin with calculated value
difference rather than use a hard coded value.
---
 .../stylesheets/active_admin/components/_flash_messages.scss    | 2 +-
 app/assets/stylesheets/active_admin/mixins/_variables.scss      | 2 +-
 .../stylesheets/active_admin/structure/_main_structure.scss     | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_flash_messages.scss b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
index 565701847f0..252857cbf1f 100644
--- a/app/assets/stylesheets/active_admin/components/_flash_messages.scss
+++ b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
@@ -3,7 +3,7 @@
   color: #cb9810;
   font-size: 1.1em;
   font-weight: bold;
-  padding: 15px 30px;
+  padding: 12px $horizontal-page-margin;
 
   &.flash_notice {
     background-color: #ccdfcd;
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 04d73088d5b..49c87e55e49 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -23,7 +23,7 @@ $page-header-text-color: #cdcdcd !default;
 
 // Sizes
 $border-width: 1px !default;
-$horizontal-page-margin: 30px !default;
+$horizontal-page-margin: 20px !default;
 $sidebar-width: 270px !default;
 $cell-padding: 5px 10px 3px 10px !default;
 $cell-horizontal-padding: 12px !default;
diff --git a/app/assets/stylesheets/active_admin/structure/_main_structure.scss b/app/assets/stylesheets/active_admin/structure/_main_structure.scss
index a69fbccc7fd..99fac114fa1 100644
--- a/app/assets/stylesheets/active_admin/structure/_main_structure.scss
+++ b/app/assets/stylesheets/active_admin/structure/_main_structure.scss
@@ -9,7 +9,7 @@
 }
 
 #main_content{
-  margin-right: 300px;
+  margin-right: $sidebar-width + $horizontal-page-margin;
 }
 
 .without_sidebar #main_content {

From 3642918a0080cdfea948c527d3e78bed766bb2e3 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 31 Mar 2015 03:10:28 -0400
Subject: [PATCH 052/170] Consolidate columns styles and move to grid scss

Remove styles that have no effect. Since columns styles are specified
in 2 places just keep everything in the grid stylesheet. Remove the
clear:both; closing tag as its no longer necessary (we add the clearfix
mixin to the columns class).
---
 app/assets/stylesheets/active_admin/_base.scss       |  1 -
 .../active_admin/components/_columns.scss            |  3 ---
 .../stylesheets/active_admin/components/_grid.scss   | 12 +++++++++---
 lib/active_admin/views/components/columns.rb         |  5 -----
 4 files changed, 9 insertions(+), 12 deletions(-)
 delete mode 100644 app/assets/stylesheets/active_admin/components/_columns.scss

diff --git a/app/assets/stylesheets/active_admin/_base.scss b/app/assets/stylesheets/active_admin/_base.scss
index 53b69baecdd..6ed08d7a2b1 100644
--- a/app/assets/stylesheets/active_admin/_base.scss
+++ b/app/assets/stylesheets/active_admin/_base.scss
@@ -20,7 +20,6 @@
 @import "active_admin/components/links";
 @import "active_admin/components/pagination";
 @import "active_admin/components/panels";
-@import "active_admin/components/columns";
 @import "active_admin/components/scopes";
 @import "active_admin/components/status_tags";
 @import "active_admin/components/table_tools";
diff --git a/app/assets/stylesheets/active_admin/components/_columns.scss b/app/assets/stylesheets/active_admin/components/_columns.scss
deleted file mode 100644
index 3587763ddf0..00000000000
--- a/app/assets/stylesheets/active_admin/components/_columns.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-.columns {
-  margin-bottom: 10px;
-}
diff --git a/app/assets/stylesheets/active_admin/components/_grid.scss b/app/assets/stylesheets/active_admin/components/_grid.scss
index 7a8efbc551b..b1c9c6c50d1 100644
--- a/app/assets/stylesheets/active_admin/components/_grid.scss
+++ b/app/assets/stylesheets/active_admin/components/_grid.scss
@@ -1,9 +1,15 @@
 // -------------------------------------- Index as Grid
-table.index_grid td { border: none; background: none; padding: 0 20px 20px 0; margin: 0;}
+table.index_grid td {
+  border: none;
+}
 
 // -------------------------------------- Columns
 .columns {
-  clear: both;
+  @include clearfix;
+  margin-bottom: 10px;
   padding: 0;
-  .column { float: left; }
+
+  .column {
+    float: left;
+  }
 }
diff --git a/lib/active_admin/views/components/columns.rb b/lib/active_admin/views/components/columns.rb
index c2e298c55b5..79bb55420fb 100644
--- a/lib/active_admin/views/components/columns.rb
+++ b/lib/active_admin/views/components/columns.rb
@@ -76,11 +76,6 @@ def add_child(*)
 
       protected
 
-      # Override the closing tag to include a clear
-      def closing_tag
-        "<div style=\"clear:both;\"></div>" + super
-      end
-
       def margin_size
         2
       end

From 493b440bf52473715f7d8c3bac7514685543f3a8 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 31 Mar 2015 03:39:49 -0400
Subject: [PATCH 053/170] Streamline breadcrumbs and titlebar h2 styles

Lots of styles are already inherited or defaults so unnecessary to set
again. Move .breadcrumb_sep out so its no longer nested (easier to
customize, shorter selector).
---
 .../active_admin/components/_breadcrumbs.scss | 20 +++++++------------
 .../active_admin/structure/_title_bar.scss    |  6 +-----
 2 files changed, 8 insertions(+), 18 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss b/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss
index b339907ff8e..ec4341dd179 100644
--- a/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss
+++ b/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss
@@ -1,20 +1,14 @@
 .breadcrumb {
   display: block;
-  font-size: 0.9em;
-  font-weight: normal;
-  line-height: 1.0em;
-  margin-bottom: 12px;
-  text-transform: uppercase;
+  margin-bottom: 2px;
 
-  a, a:link, a:visited, a:active {
+  a,
+  a:hover {
     color: $breadcrumbs-color;
-    text-decoration: none;
   }
+}
 
-  a:hover { text-decoration: underline; }
-
-  .breadcrumb_sep {
-    margin: 0 2px;
-    color: $breadcrumbs-separator-color;
-  }
+.breadcrumb_sep {
+  color: $breadcrumbs-separator-color;
+  margin: 0 2px;
 }
diff --git a/app/assets/stylesheets/active_admin/structure/_title_bar.scss b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
index 3d8a1205f15..75ef9c92729 100644
--- a/app/assets/stylesheets/active_admin/structure/_title_bar.scss
+++ b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
@@ -3,17 +3,13 @@
   color: $section-header-text-color;
   display: table;
   font-size: 1em;
-  font-weight: bold;
   padding: 10px $horizontal-page-margin;
   width: 100%;
   z-index: 800;
 
   h2 {
-    margin: 0;
-    padding: 0;
     font-size: 2.2em;
-    line-height: 100%;
-    font-weight: bold;
+    margin: 0;
   }
 
   .action_item {

From d49371e14f8c209f4ee1780deddb2a07752630ea Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 31 Mar 2015 03:58:13 -0400
Subject: [PATCH 054/170] Bring back tabs styles and streamline
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

I removed this because it was poorly named so when I searched for
ui-tab-nav nothing came up. That class name is used by jQuery UI but we
should be using our own (which is tabs.rb sets as “nav-tabs”) to style
the component otherwise its confusing if its being used or not.
---
 .../active_admin/components/_tabs.scss        | 40 +++++++++++++++++--
 1 file changed, 37 insertions(+), 3 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_tabs.scss b/app/assets/stylesheets/active_admin/components/_tabs.scss
index 7f86699c9c9..ae2c70195a2 100644
--- a/app/assets/stylesheets/active_admin/components/_tabs.scss
+++ b/app/assets/stylesheets/active_admin/components/_tabs.scss
@@ -1,6 +1,40 @@
+.nav-tabs {
+  @include clearfix;
+  list-style: none;
+  display: block;
+  margin: 0 0 -12px 15px;
+  padding-left: 0;
+
+  li {
+    display: block;
+    float: left;
+
+    & + li a {
+      border-left-width: 0;
+    }
+
+    &:first-child a {
+      border-radius: 0.25em 0 0 0.25em;
+    }
+
+    &:last-child a {
+      border-radius: 0 0.25em 0.25em 0;
+    }
+
+    a {
+      @include light-button;
+    }
+
+    &.ui-tabs-active {
+      a,
+      a:hover {
+        @include gradient(#F0F0F0, #FDFDFD);
+      }
+    }
+  }
+}
+
 .tab-content {
   border: 1px solid #D3D3D3;
-  padding: 15px;
-  padding-top: 30px;
-  text-align: left;
+  padding: 30px 15px 15px 15px;
 }

From 9bd260bc0bb8a0e2086d23eb5c8ceb0c8b708e27 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 31 Mar 2015 21:13:38 -0400
Subject: [PATCH 055/170] For footer padding use $horizontal-page-margin

---
 app/assets/stylesheets/active_admin/structure/_footer.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/active_admin/structure/_footer.scss b/app/assets/stylesheets/active_admin/structure/_footer.scss
index 03825f9163f..46d6e3b3103 100644
--- a/app/assets/stylesheets/active_admin/structure/_footer.scss
+++ b/app/assets/stylesheets/active_admin/structure/_footer.scss
@@ -1,6 +1,6 @@
 #footer {
   font-size: 0.9em;
-  padding: 30px;
+  padding: $horizontal-page-margin;
 }
 
 // -------------------------------------- Index Footer (Under Table)

From 66fe3842ca173471be71876b622347deecece5ef Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 31 Mar 2015 21:17:53 -0400
Subject: [PATCH 056/170] Update table_tools so segment and drop down align
 correctly
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

We can consolidate some styles into table_tools, no need for the
duplication. The existing classes are still there so users can
customize if need be. Removed table_tools JS as its unnecessary and
causes issues with aligning a dropdown and segment control together.
Further where this was added posed no benefit since the content wasn’t
long enough to wrap (edge case, no need to handle).
---
 app/assets/stylesheets/active_admin/_base.scss     |  2 --
 .../active_admin/components/_index_list.scss       | 12 ------------
 .../active_admin/components/_scopes.scss           | 10 ----------
 .../active_admin/components/_table_tools.scss      | 14 ++++++++++----
 4 files changed, 10 insertions(+), 28 deletions(-)
 delete mode 100644 app/assets/stylesheets/active_admin/components/_index_list.scss
 delete mode 100644 app/assets/stylesheets/active_admin/components/_scopes.scss

diff --git a/app/assets/stylesheets/active_admin/_base.scss b/app/assets/stylesheets/active_admin/_base.scss
index 6ed08d7a2b1..d4099d5f8b8 100644
--- a/app/assets/stylesheets/active_admin/_base.scss
+++ b/app/assets/stylesheets/active_admin/_base.scss
@@ -20,10 +20,8 @@
 @import "active_admin/components/links";
 @import "active_admin/components/pagination";
 @import "active_admin/components/panels";
-@import "active_admin/components/scopes";
 @import "active_admin/components/status_tags";
 @import "active_admin/components/table_tools";
-@import "active_admin/components/index_list";
 @import "active_admin/components/unsupported_browser";
 @import "active_admin/components/tabs";
 @import "active_admin/pages/logged_out";
diff --git a/app/assets/stylesheets/active_admin/components/_index_list.scss b/app/assets/stylesheets/active_admin/components/_index_list.scss
deleted file mode 100644
index c81cc6998a5..00000000000
--- a/app/assets/stylesheets/active_admin/components/_index_list.scss
+++ /dev/null
@@ -1,12 +0,0 @@
-.indexes {
-  float: right;
-
-  li {
-    .count {
-      color: #8e979e;
-      font-weight: normal;
-      font-size: 0.9em;
-      line-height: 10px;
-    }
-  }
-}
diff --git a/app/assets/stylesheets/active_admin/components/_scopes.scss b/app/assets/stylesheets/active_admin/components/_scopes.scss
deleted file mode 100644
index 1164fc2f612..00000000000
--- a/app/assets/stylesheets/active_admin/components/_scopes.scss
+++ /dev/null
@@ -1,10 +0,0 @@
-.scopes {
-  li {
-    .count {
-      color: #8e979e;
-      font-weight: normal;
-      font-size: 0.9em;
-      line-height: 10px;
-    }
-  }
-}
diff --git a/app/assets/stylesheets/active_admin/components/_table_tools.scss b/app/assets/stylesheets/active_admin/components/_table_tools.scss
index dd81388adcf..7cd86ccfc99 100644
--- a/app/assets/stylesheets/active_admin/components/_table_tools.scss
+++ b/app/assets/stylesheets/active_admin/components/_table_tools.scss
@@ -1,25 +1,31 @@
 .table_tools {
-  @include clearfix;
   margin-bottom: 15px;
 }
 
 a.table_tools_button {
   @include light-button;
   font-weight: normal;
-  padding: 4px 10px;
 }
 
 .table_tools_segmented_control {
   @include clearfix;
-  list-style-type: none;
+  display: inline-block;
+  list-style: none;
   margin: 0;
   padding: 0;
+  vertical-align: bottom; // required so this aligns correctly with .dropdown_menu
+
+  .count {
+    color: #8e979e;
+    font-weight: normal;
+  }
 
   li {
     float: left;
 
     & + li a {
-      border-left-width: 0;
+      border-radius: 0;
+      margin-left: -1px;
     }
 
     &:first-child a {

From 15ef060ff8183cb708e59de65e8eeecd9f5123b5 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 31 Mar 2015 23:24:19 -0400
Subject: [PATCH 057/170] Streamline has_many form styles

Several properties we can remove since we have good defaults now in
place. Added slight bottom border on has_many field sets with
horizontal indentation so it appears somewhat grouped/related.
Consolidate same styles so we have less duplication.
---
 .../stylesheets/active_admin/_base.scss       |  4 +-
 .../stylesheets/active_admin/_forms.scss      | 99 +++++++------------
 2 files changed, 39 insertions(+), 64 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_base.scss b/app/assets/stylesheets/active_admin/_base.scss
index d4099d5f8b8..101a4c6761e 100644
--- a/app/assets/stylesheets/active_admin/_base.scss
+++ b/app/assets/stylesheets/active_admin/_base.scss
@@ -29,9 +29,7 @@
 @import "active_admin/structure/main_structure";
 @import "active_admin/structure/title_bar";
 
-* {
-  box-sizing: border-box;
-}
+*,
 *:before,
 *:after {
   box-sizing: border-box;
diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 0e20d1cfb07..91f603a1ec7 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -9,6 +9,7 @@ input[type=tel],
 textarea {
   border: $border-width solid #c9d0d6;
   border-radius: 3px;
+  display: inline-block;
   outline: none;
   padding: 6px 8px;
   width: calc(80% - #{$text-input-total-padding});
@@ -26,6 +27,10 @@ textarea {
     padding: 0;
   }
 
+  .hidden {
+    display: none;
+  }
+
   .input {
     margin-bottom: 15px;
   }
@@ -44,18 +49,19 @@ textarea {
     }
   }
 
+  .inputs {
+    @include section-background;
+
+    > ol {
+      padding: 15px;
+    }
+  }
+
   fieldset {
     border: 0;
     margin: 0 0 20px 0;
     padding: 0;
-
-    &.inputs {
-      @include section-background;
-
-      > ol {
-        padding: 15px;
-      }
-    }
+    position: relative; // for abosolute positioning sub fieldset legends for choices/fragments
 
     legend {
       width: 100%;
@@ -66,48 +72,28 @@ textarea {
       }
     }
 
-    ol > li.has_many_container {
-      padding: 20px 10px;
+    .has_many_container {
       h3 {
-        font-size: 12px;
-        font-weight: bold;
-      }
-      .has_many_fields { margin: 10px 0 }
-    }
-
-    ol > li > li label {
-      line-height:100%;
-      padding-top:0;
-      input {
-        line-height:100%;
-        vertical-align:middle;
-        margin-top:-0.1em;
+        border-bottom: 1px solid #e8e8e8;
+        margin-bottom: 20px;
       }
     }
   }
 
   // relative so the absolutely-positioned handle will fit
-  .has_many_fields { position: relative }
+  .has_many_fields {
+    border-bottom: 1px solid #e8e8e8;
+
+    ol {
+      padding: 0 15px;
+      position: relative;
+    }
 
-  .has_many_container {
     .handle {
+      cursor: move;
       position: absolute;
+      right: 0;
       top: calc(50% - 3em / 2);
-      right: 2px;
-      padding: 0;
-      cursor: move;
-    }
-
-    // If a sortable is nested in a sortable, give the parent handle space!
-    &.ui-sortable .has_many_container {
-      margin-right: 2em;
-    }
-  }
-
-  .ui-sortable {
-    // give the handle space!
-    input[type=text], input[type=password], input[type=email], input[type=number], input[type=url], input[type=tel], textarea {
-      width: calc(80% - #{$text-input-total-padding} - 2em - 1px);
     }
   }
 
@@ -116,7 +102,6 @@ textarea {
   legend.label {
     font-size: inherit;
     left: 0;
-    padding-top: 0.1em;
     position: absolute
   }
 
@@ -134,8 +119,7 @@ textarea {
 
   .fragment {
     display: inline-block;
-    margin: 0 5px 0 0;
-    width: auto;
+    margin: 0 0.5em 0 0;
 
     label {
       display: none;
@@ -146,53 +130,46 @@ textarea {
 
   .boolean input,
   .choice input {
-    margin: 0 0.3em 0 0;
+    display: inline-block; // for IE
+    margin: 0 0.5em 0 0;
   }
 
   .boolean label {
-    padding-left:20%;
+    padding-left: 20%;
     padding-right: 10px;
     width: 80%;
   }
 
-  fieldset > ol > li {
-    fieldset {
-      position:relative;
-      padding: 0;
-      margin: 0;
+  // HINTS and ERRORS
 
-      &.has_many_fields ol {
-        float: left;
-        width: 100%;
-        margin: 0;
-      }
-    }
+  .inline-hints,
+  .inline-errors,
+  .errors {
+    margin: 0.3em 0 0 20%;
   }
 
   .inline-hints {
     color: #999;
-    margin: 0.3em 0 0 20%;
   }
 
   .inline-errors, .errors {
     color: $error-color;
     font-weight: bold;
-    margin: 0.3em 0 0 20%;
   }
 
   .errors {
     background-color: lighten($error-color, 60%);
     border-radius: 3px;
-    color: $error-color;
     list-style-type: square;
-    margin: 0.5em 0 0 20%;
     padding: 10px 10px 10px 25px;
     width: calc(80% - 22px);
   }
 
   // Buttons
 
-  input[type=submit], input[type=button], button {
+  input[type=submit],
+  input[type=button],
+  button {
     @include dark-button;
   }
 

From 6709befd98f8435d63afdabc3e3a4f39ff4c9682 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 1 Apr 2015 21:17:56 -0400
Subject: [PATCH 058/170] Set table columns to vertical align top

The table header columns though are set to align bottom.
---
 .../active_admin/components/_tables.scss           | 14 ++++++++------
 .../active_admin/structure/_main_structure.scss    |  2 +-
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index cc765860fe0..b6f8b38f59d 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -6,12 +6,6 @@ table {
   width: 100%;
 }
 
-thead {
-  th {
-    border-bottom: 2px solid #ccc;
-  }
-}
-
 th {
   text-align: left;
 }
@@ -19,6 +13,14 @@ th {
 th, td {
   border-bottom: 1px solid #e8e8e8;
   padding: 8px;
+  vertical-align: top;
+}
+
+thead {
+  th {
+    border-bottom: 2px solid #ccc;
+    vertical-align: bottom;
+  }
 }
 
 // --------- Index Tables
diff --git a/app/assets/stylesheets/active_admin/structure/_main_structure.scss b/app/assets/stylesheets/active_admin/structure/_main_structure.scss
index 99fac114fa1..25d2c03f1e0 100644
--- a/app/assets/stylesheets/active_admin/structure/_main_structure.scss
+++ b/app/assets/stylesheets/active_admin/structure/_main_structure.scss
@@ -8,7 +8,7 @@
   width: 100%;
 }
 
-#main_content{
+#main_content {
   margin-right: $sidebar-width + $horizontal-page-margin;
 }
 

From 3954d02ecbc1a209ceefa7c3efdf1cfe8e13def2 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 1 Apr 2015 22:31:14 -0400
Subject: [PATCH 059/170] Remove orderable image and use CSS arrows instead
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This has the added benefit that the CSS arrows don’t need an explicit
color set as they just inherit the link text color.
---
 app/assets/images/active_admin/orderable.png  | Bin 220 -> 0 bytes
 .../active_admin/components/_tables.scss      |  29 +++++++++++++-----
 2 files changed, 22 insertions(+), 7 deletions(-)
 delete mode 100644 app/assets/images/active_admin/orderable.png

diff --git a/app/assets/images/active_admin/orderable.png b/app/assets/images/active_admin/orderable.png
deleted file mode 100644
index 427009e7207b41aad99c2f59d3d76246a1f9f1e6..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 220
zcmeAS@N?(olHy`uVBq!ia0vp^>_F_s!3HE5!uq6uq-2R}L`iUdT1k0gQ7VIDN`6wR
zf@f}GdTLN=VoGJ<$y6JlqB>6($B>F!Nq2UnS~H7WVKkH$xPE{oVnGSFK)CbGGY&DF
zNd^l&8yr{#$`7hI9y3_<&}fE=-vO4=6ZIx{m?q~ql_?5rIrKxvgQ<R@UasqRE{>7~
zw@?1~|G$0@pVU;DsWK9t(|%mhSyXcE;3tk=<M$bHl2c_WcjnBv;=#bk#&AkYhsV&z
Q{}9O4p00i_>zopr0Q0s>`v3p{

diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index b6f8b38f59d..3c3bdccb975 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -1,4 +1,3 @@
-//= depend_on_asset "active_admin/orderable.png"
 // ----------------------------------- Tables
 
 table {
@@ -30,24 +29,40 @@ table.index_table {
     a, a:link, a:visited {
       color: $section-header-text-color;
       display: block;
+      position: relative;
       text-decoration: none;
       white-space: nowrap;
     }
 
     &.sortable a {
-      background: image-url('active_admin/orderable.png') no-repeat 0 4px; padding-left: 13px;
+      &:after,
+      &:before {
+        border-left: 4px solid transparent;
+        border-right: 4px solid transparent;
+        bottom: 100%;
+        content: '';
+        height: 0;
+        position: absolute;
+        right: 0;
+        top: calc(50% - 2px);
+        width: 0;
+      }
     }
 
     &.sorted-asc a {
-      background-position: 0 -27px;
+      padding-right: 11px;
+
+      &:after { // upward pointing arrow
+        border-bottom: 4px solid;
+      }
     }
 
     &.sorted-desc a {
-      background-position: 0 -56px;
-    }
+      padding-right: 11px;
 
-    &.sorted-asc, &.sorted-desc {
-      background-color: #e6e6e6;
+      &:before { // downward pointing arrow
+        border-top: 4px solid;
+      }
     }
   }
 

From 493d84b0b127e8a9ddeacfc94972de6ed9526e6f Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 1 Apr 2015 22:37:17 -0400
Subject: [PATCH 060/170] Streamline datepicker styles
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The outermost container had a 2px offset that it doesn’t need. Lots of
dated stuff here we can remove and simplify. Further we can absolute
position the month navigation arrows and easily vertically align while
also giving a bigger hit area (rather than floating them). Removed top
arrow pointing to field since we can’t easily detect when the date
picker shows up below or above the field, should normally always be
below but since we’ve removed that accessory across the board lets do
it here. The pull request for the webkit native date picker also
doesn’t have that top arrow. Keep it consistent.
---
 .../active_admin/components/_date_picker.scss | 130 +++++++-----------
 1 file changed, 52 insertions(+), 78 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index d2c4c7ed091..3ac9a0b2979 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -1,81 +1,63 @@
 // -------------------------------------- Date Picker
 .ui-datepicker {
-  color: #fff;
+  box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
   display: none;
-  margin-top: 2px;
-  padding: 0;
-  text-align: center;
   width: 160px;
 
-  a {
+  a,
+  a:hover {
     text-decoration: none;
-    &:hover {
-      cursor: pointer;
-    }
   }
 
   .ui-datepicker-header {
-    @include primary-gradient;
-    padding: 8px 5px;
-    margin: 0px 0px 2px 2px;
-    width: 156px;
-    border-radius: 3px 3px 0 0;
+    background-color: lighten($primary-color, 5%);
+    border-radius: 0.25em 0.25em 0 0;
+    color: #fff;
+    padding: 5px;
     position: relative;
     z-index: 2000;
 
-    &:before {
-       content: "";
-       position: absolute;
-       right: 45%;
-       top: -6px;
-       width: 0px;
-       height: 0px;
-       border-left: 8.5px solid rgba(0, 0, 0, 0);
-       border-right: 8.5px solid rgba(0, 0, 0, 0);
-       border-bottom: 10px solid #676e73;
-    }
-
     .ui-datepicker-title {
-      color: #fff;
       display: block;
-      font-size: 1.1em;
       font-weight: bold;
-      line-height: 0.8em;
       text-align: center;
-
-      .ui-datepicker-month {
-        margin: -4px 0 0 0;
-      }
-      .ui-datepicker-year {
-        margin: -4px 0 0 0;
-      }
     }
 
-
     a {
+      bottom: 0;
       color: #fff;
+      cursor: pointer;
       display: block;
-      height: 19px;
-      margin-top: -4px;
-      width: 10px;
+      position: absolute;
+      top: 0;
+      width: 20px;
+
+      &:after {
+        border-bottom: 4px solid transparent;
+        border-top: 4px solid transparent;
+        content: '';
+        height: 0;
+        position: absolute;
+        top: calc(50% - 4px);
+        width: 0;
+      }
 
       &.ui-datepicker-prev {
-        float: left;
-        width: 0;
-        height: 0;
-        margin: 0px 0px 0px 4px;
-        border-top: 5px solid transparent;
-        border-right: 5px solid white;
-        border-bottom: 5px solid transparent;
+        left: 0;
+
+        &:after {
+          border-right: 5px solid;
+          left: calc(50% - 2px);
+        }
       }
+
       &.ui-datepicker-next {
-        float: right;
-        width: 0;
-        height: 0;
-        margin: 0px 4px 0px 0px;
-        border-top: 5px solid transparent;
-        border-left: 5px solid white;
-        border-bottom: 5px solid transparent;
+        right: 0;
+
+        &:after {
+          border-left: 5px solid;
+          right: calc(50% - 2px);
+        }
       }
 
       span {
@@ -87,54 +69,46 @@
   table.ui-datepicker-calendar {
     background-color: #f4f4f4;
     border: solid 1px #63686e;
-    left: 2px;
-    margin-bottom: 0px;
-    position: relative;
-    top: -2px;
-    width: 156px;
+    border-width: 0 1px 1px 1px;
+    margin-bottom: 0;
 
     td, th {
-      padding: 0px;
+      padding: 0;
       text-align: center;
     }
 
     thead th {
-      background-color: #dbdddf;
       border-bottom: none;
-      color: #333333;
+      font-size: 0.9em;
       font-weight: normal;
-      font-size: 0.8em;
-      padding: 1px 0;
+      padding: 2px 0;
     }
 
     tbody {
-      color: #666666;
-
       td {
         border: none;
-        height: 24px;
+        height: 22px;
         width: 22px;
 
         a {
-          border-radius: 3px;
-          color: #666666;
+          border-radius: 0.25em;
+          color: #666;
           display: block;
-          font-size: 0.85em;
+          font-size: 0.9em;
           font-weight: bold;
           padding: 4px;
 
-          &.ui-state-active {
+          &:hover {
+            background-color: #eceef0;
+          }
+
+          &.ui-state-active,
+          &.ui-state-active:hover {
             background-color: #5a5f64;
             color: #fff;
-            &.ui-state-hover {
-              background-color: #5a5f64;
-              color: #fff;
-            }
           }
-          &.ui-state-hover {
-            background-color: #eceef0;
-          }
-          &.ui-state-highlight {
+
+          &.ui-state-highlight { // today's date
             background-color: #dbdddf;
           }
         }

From 2106cde9cd69e36c41aca3e4793e816f248e120b Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 1 Apr 2015 22:39:17 -0400
Subject: [PATCH 061/170] Fix failing form_builder_spec
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

I added “action” to the class for a form cancel link button so the
selector here needs to be changed to a contains lookup. Spec now
passing.
---
 spec/unit/form_builder_spec.rb | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/spec/unit/form_builder_spec.rb b/spec/unit/form_builder_spec.rb
index f7adad3ba2a..5ff42975706 100644
--- a/spec/unit/form_builder_spec.rb
+++ b/spec/unit/form_builder_spec.rb
@@ -164,7 +164,7 @@ def build_form(options = {}, form_object = Post.new, &block)
         f.actions
       end
       expect(body).to have_selector("[type=submit]", count: 1)
-      expect(body).to have_selector("[class=cancel]", count: 1)
+      expect(body).to have_selector("[class~=cancel]", count: 1)
     end
     it "should generate multiple actions" do
       body = build_form do |f|
@@ -174,7 +174,7 @@ def build_form(options = {}, form_object = Post.new, &block)
         end
       end
       expect(body).to have_selector("[type=submit]", count: 2)
-      expect(body).to have_selector("[class=cancel]", count: 0)
+      expect(body).to have_selector("[class~=cancel]", count: 0)
     end
 
   end

From 2e87b81ef6955affd449b5ba016d2c6f12046d91 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 3 Apr 2015 22:35:12 -0400
Subject: [PATCH 062/170] Display date placeholder in date picker field, remove
 icon
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

We should show placeholders where possible. Clearer to show format than
to have the icon. Ideally we’d like to have SVG icons that can work in
both CSS and in HTML (current Iconic solution only works in HTML). The
icons look like they could be updated too (Iconic is a paid solution so
we should look into an open source SVG one if necessary). Remove nbsp
as its unnecessary.
---
 .../datepicker/datepicker-input-icon.png        | Bin 1535 -> 0 bytes
 app/assets/stylesheets/active_admin/_forms.scss |   6 ------
 config/locales/en.yml                           |   4 ++--
 .../inputs/filters/date_range_input.rb          |  16 ++++++----------
 4 files changed, 8 insertions(+), 18 deletions(-)
 delete mode 100644 app/assets/images/active_admin/datepicker/datepicker-input-icon.png

diff --git a/app/assets/images/active_admin/datepicker/datepicker-input-icon.png b/app/assets/images/active_admin/datepicker/datepicker-input-icon.png
deleted file mode 100644
index 40ad6f74074ef3e705c688416b70c933b01d0316..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1535
zcmeAS@N?(olHy`uVBq!ia0vp^A|N&g8<1QX;1>s^BuiW)N`mv#O3D+9QW+dm@{>{(
zJaZG%Q-e|yQz{EjrrIztFe_z-M3hAM`dB6B=jtVb)aX^@765fKFxc2v6eK2Rr<N!r
zrKV@**($x?y<bToGsRXZ+|<{=x4=0yBh#a*C^fjsFC@7tJJ~Wt$=*)EroswnKyGSD
zqC!P(PF}H9g{>0UTq__OB&@Hb09I0xZL0)vRD^GUf^&XRs)DJWfo`&anSp|tp`M|!
ziMhGCj)IYap@F`Ek-njkuA#Y=v5}R5fdUjL0c|TvNwW%aaf8|g<k>1^l#~=$>Fbx5
zm+O@q>*W`v>l<2HT7t|lGSUUA&@HaaD@m--%_~-hnc$LIoLrPyP?DLSrvNfBF)6>a
z#8wIDQivCF3*g4)6+?pw7-0Gpi3R$GdIlgb!4&%X;#ZoR3s+rS5|oN?FIIz#Ln;eW
z^@CE2^Gl18ff1Lc46>@g%DE^tu_V7JBtJg~7K#BG`6c<q8TkbY&cUV%zKO}1c_2Pm
zy|1s8XI^nhVqS8pr;Du;&;-5A%oHn2Cj(bgGgD(rOJ_?%LstV!Cl?nN3j-%hR|_Lk
zb4N3nUYGpj(%jU%5}4i;gkBSzdO=Acw*Y9fOKMSOS!#+~QGTuh*vnR#xZMJbDqL=X
z=uN@x79*T`^?{Dj2SqGWM8kxDsRzV_CtDx~p72xifT_I*n5=nMxh-X2U@G=>aSW-r
z)f0TyJ0wtK|NQ)W()WL)nPi=DIwrY^pZnq!v8@FQS(In6ii$MyBua;`&ANR2kl58l
z9U2?z6>dFQ7V3D#>6e4I;BhvoVuRvkg;MfX^6&56mOMS-!a?Teh4*%T|8wr=++w{T
zuZ5;>xxSl~mwx~D_xWqq_~TXamZ=3h*^=Kd#V+dE7I<pbrS6$KKi7&cE||v>@7;U<
zeNU}a{LZSk&-P3@RcZJ~r_oH1%|Y;3#D(Xd`z-njmV_u-{e3F%_)p0OyALLIpM4L^
z{P*hX?8S4kt2x~wJEU2Bb2&UTr}ktYS}NT;{kO7y@X9Z@Cw`az?!4jg)-~t2pP%D1
zZ*k(~m*c-$>|3m5E64k&%3*#^kfLKxVB+o5U+x`V*yp5}&#hR~Q)p-^YrOBAik}GA
z`K1Dv&RUAA286gts6{ZYV7hfkkjctHOHx^tS+Qs8V+)z&U9&`l7ilb9C8H2&ye%|b
z^mg>@>38y+t8A8K<ma9Y3;)?Q#jteA+k&$1>u%ZHYWl;>!^*79{CA>8`kl6WPucWb
zAIWV_Y7|mBIB)&hkH-`A4c4&fv3DF+KOb|kbn&@OYnt9&s@F|3Qe!_Cw|?s!pTA2S
z?tXZGW8UoFcJtL+BIGWM^uN0=cRxoX<!^uD3oD<wPVt6crtFN-%Qe;RSoiu_e0BDe
z*?e*v-t)xu|J)O{F683fX!A!09b(-sn^dk^ZmsLZ+`Nz>;pV~%w!fwN4|Y{_A6-=S
zJ<-H`_6+0hz6X<o11$|LU6)J|O`fmrqnNs~fR!`kN5yldBYk;0%sxypV3{b-?I~L&
z*7Ce9=e8TerqBGYEuUDoM$K&DzoQ%dFrSf)fg?zHLdhmJe^8O^>FVdQ&MBb@05PIE
A@Bjb+

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 91f603a1ec7..472c744800e 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -1,5 +1,3 @@
-//= depend_on_asset "active_admin/datepicker/datepicker-input-icon.png"
-
 input[type=text],
 input[type=password],
 input[type=email],
@@ -213,8 +211,6 @@ $filter-field-seperator-width: 12px;
 $side-by-side-filter-input-width: ($sidebar-inner-content-width / 2) - $filter-field-seperator-width;
 $side-by-side-filter-select-width: ($sidebar-inner-content-width / 2);
 
-$date-range-filter-input-right-padding: 25px;
-
 $date-range-filter-input-width: ($sidebar-inner-content-width / 2) - ($filter-field-seperator-width / 2);
 
 .filter_form_field {
@@ -238,8 +234,6 @@ $date-range-filter-input-width: ($sidebar-inner-content-width / 2) - ($filter-fi
 
   &.filter_date_range {
     input {
-      background: #fff image-url('active_admin/datepicker/datepicker-input-icon.png') no-repeat 100% 6px;
-      padding-right: $date-range-filter-input-right-padding;
       width: $date-range-filter-input-width;
     }
 
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 1d0a0323b00..1ff4c976ea2 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -49,8 +49,8 @@ en:
       empty: "No %{model} found"
       one: "Displaying <b>1</b> %{model}"
       one_page: "Displaying <b>all %{n}</b> %{model}"
-      multiple: "Displaying %{model} <b>%{from}&nbsp;-&nbsp;%{to}</b> of <b>%{total}</b> in total"
-      multiple_without_total: "Displaying %{model} <b>%{from}&nbsp;-&nbsp;%{to}</b>"
+      multiple: "Displaying %{model} <b>%{from} - %{to}</b> of <b>%{total}</b> in total"
+      multiple_without_total: "Displaying %{model} <b>%{from} - %{to}</b>"
       entry:
         one: "entry"
         other: "entries"
diff --git a/lib/active_admin/inputs/filters/date_range_input.rb b/lib/active_admin/inputs/filters/date_range_input.rb
index b66b44ecee9..d1429a3e9a5 100644
--- a/lib/active_admin/inputs/filters/date_range_input.rb
+++ b/lib/active_admin/inputs/filters/date_range_input.rb
@@ -7,8 +7,8 @@ class DateRangeInput < ::Formtastic::Inputs::StringInput
         def to_html
           input_wrapping do
             [ label_html,
-              builder.text_field(gt_input_name, input_html_options(gt_input_name, gt_input_placeholder)),
-              builder.text_field(lt_input_name, input_html_options(lt_input_name, lt_input_placeholder)),
+              builder.text_field(gt_input_name, input_html_options(gt_input_name)),
+              builder.text_field(lt_input_name, input_html_options(lt_input_name)),
             ].join("\n").html_safe
           end
         end
@@ -22,20 +22,16 @@ def lt_input_name
           "#{method}_lteq_date"
         end
 
-        def gt_input_placeholder
-          I18n.t("active_admin.filters.predicates.starts_with")
+        def input_placeholder
+          I18n.t("active_admin.filters.placeholders.date")
         end
 
-        def lt_input_placeholder
-          I18n.t("active_admin.filters.predicates.ends_with")
-        end
-
-        def input_html_options(input_name = gt_input_name, placeholder = gt_input_placeholder)
+        def input_html_options(input_name = gt_input_name)
           current_value = @object.public_send input_name
           { size: 12,
             class: "datepicker",
             maxlength: 10,
-            placeholder: placeholder,
+            placeholder: input_placeholder,
             value: current_value.respond_to?(:strftime) ? current_value.strftime("%Y-%m-%d") : "" }
         end
       end

From bf3efdd0611e60ed26c27734a268d9d036f241da Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 3 Apr 2015 22:36:26 -0400
Subject: [PATCH 063/170] Update breadcrumbs to use an ordered list

This way we can control more of the appearance in CSS and allow others
to customize it. For example, no need for the slash to be in HTML as
this is a presentation detail we can easily do through CSS.
---
 .../active_admin/components/_breadcrumbs.scss | 19 +++++++++++++------
 features/step_definitions/breadcrumb_steps.rb |  2 +-
 lib/active_admin/views/title_bar.rb           |  7 ++++---
 3 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss b/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss
index ec4341dd179..684edb2ab87 100644
--- a/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss
+++ b/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss
@@ -1,14 +1,21 @@
 .breadcrumb {
   display: block;
-  margin-bottom: 2px;
+  list-style: none;
+  margin: 0 0 2px 0;
+  padding: 0;
+
+  > li {
+    display: inline-block;
+
+    & + li:before {
+      color: $breadcrumbs-separator-color;
+      content: "/";
+      padding: 0 6px 0 2px;
+    }
+  }
 
   a,
   a:hover {
     color: $breadcrumbs-color;
   }
 }
-
-.breadcrumb_sep {
-  color: $breadcrumbs-separator-color;
-  margin: 0 2px;
-}
diff --git a/features/step_definitions/breadcrumb_steps.rb b/features/step_definitions/breadcrumb_steps.rb
index 5c4c7da7cc7..b91778e7bde 100644
--- a/features/step_definitions/breadcrumb_steps.rb
+++ b/features/step_definitions/breadcrumb_steps.rb
@@ -1,3 +1,3 @@
 Then /^I should see a link to "([^"]*)" in the breadcrumb$/ do |text|
-  expect(page).to have_css '.breadcrumb > a', text: text
+  expect(page).to have_css '.breadcrumb > li > a', text: text
 end
diff --git a/lib/active_admin/views/title_bar.rb b/lib/active_admin/views/title_bar.rb
index 8f32aca0199..d63d5591029 100644
--- a/lib/active_admin/views/title_bar.rb
+++ b/lib/active_admin/views/title_bar.rb
@@ -34,10 +34,11 @@ def build_breadcrumb(separator = "/")
           breadcrumb_links
         end
         return unless links.present? && links.is_a?(::Array)
-        span class: "breadcrumb" do
+        ol class: "breadcrumb" do
           links.each do |link|
-            text_node link
-            span(separator, class: "breadcrumb_sep")
+            li do
+              text_node link
+            end
           end
         end
       end

From cd794c1330943b5fb31c20bb26aab3f42f7340b0 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 3 Apr 2015 22:38:53 -0400
Subject: [PATCH 064/170] Clean up status_tag styles and reformat

Trying to keep everything very readable so no need to decrease the font
size here. Looks and reads better at the default font size and normal
case (visually it has enough distinction with the use of color).
---
 .../active_admin/components/_status_tags.scss | 37 ++++++++++++++-----
 1 file changed, 28 insertions(+), 9 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_status_tags.scss b/app/assets/stylesheets/active_admin/components/_status_tags.scss
index 8cfe13cac69..bdde260d7ed 100644
--- a/app/assets/stylesheets/active_admin/components/_status_tags.scss
+++ b/app/assets/stylesheets/active_admin/components/_status_tags.scss
@@ -1,16 +1,35 @@
 .status_tag {
-  background: darken($secondary-color, 15%);
+  background-color: darken($secondary-color, 15%);
   border-radius: 0.25em;
   color: #fff;
-  font-size: 0.8em;
+  padding: 0.2em 0.5em;
   text-align: center;
-  text-transform: uppercase;
-  padding: 0.3em 0.6em;
 
-  &.ok, &.published, &.complete, &.completed, &.green { background: #8daa92; }
-  &.warn, &.warning, &.orange { background: #e29b20; }
-  &.error, &.errored, &.red { background: #d45f53; }
+  &.ok,
+  &.published,
+  &.complete,
+  &.completed,
+  &.green {
+    background-color: #8daa92;
+  }
 
-  &.yes { background: #6090DB }
-  &.no  { background: grey }
+  &.warn,
+  &.warning,
+  &.orange {
+    background-color: #e29b20;
+  }
+
+  &.error,
+  &.errored,
+  &.red {
+    background-color: #d45f53;
+  }
+
+  &.yes {
+    background-color: #6090DB;
+  }
+
+  &.no {
+    background-color: grey;
+  }
 }

From dd40e9d1e2f415010404af98b583a862c8839b5f Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 3 Apr 2015 23:25:38 -0400
Subject: [PATCH 065/170] Use "starts/ends with" placeholders for date range
 fields
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The date formats don’t work well here since its not immediately clear
what each field does. This is the best label for now and its using an
already supported locale text which saves us some trouble.
---
 .../inputs/filters/date_range_input.rb             | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/lib/active_admin/inputs/filters/date_range_input.rb b/lib/active_admin/inputs/filters/date_range_input.rb
index d1429a3e9a5..e0042d972bc 100644
--- a/lib/active_admin/inputs/filters/date_range_input.rb
+++ b/lib/active_admin/inputs/filters/date_range_input.rb
@@ -7,8 +7,8 @@ class DateRangeInput < ::Formtastic::Inputs::StringInput
         def to_html
           input_wrapping do
             [ label_html,
-              builder.text_field(gt_input_name, input_html_options(gt_input_name)),
-              builder.text_field(lt_input_name, input_html_options(lt_input_name)),
+              builder.text_field(gt_input_name, input_html_options(gt_input_name, gt_input_placeholder)),
+              builder.text_field(lt_input_name, input_html_options(lt_input_name, lt_input_placeholder)),
             ].join("\n").html_safe
           end
         end
@@ -22,11 +22,15 @@ def lt_input_name
           "#{method}_lteq_date"
         end
 
-        def input_placeholder
-          I18n.t("active_admin.filters.placeholders.date")
+        def gt_input_placeholder
+          I18n.t("active_admin.filters.predicates.starts_with")
         end
 
-        def input_html_options(input_name = gt_input_name)
+        def lt_input_placeholder
+          I18n.t("active_admin.filters.predicates.ends_with")
+        end
+
+        def input_html_options(input_name = gt_input_name, input_placeholder = gt_input_placeholder)
           current_value = @object.public_send input_name
           { size: 12,
             class: "datepicker",

From 331baa7da52f534a27d2a4eb7307d2778d0301ca Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 3 Apr 2015 23:28:07 -0400
Subject: [PATCH 066/170] Update pagination styles
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Keep font at the default size. No value making it so small. Keep it
readable. Include just the necessary styles directly on current page
rather than including button styles since that also adds other actions
we don’t want since its not interactive.
---
 .../active_admin/components/_pagination.scss  | 21 ++++++++++++-------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_pagination.scss b/app/assets/stylesheets/active_admin/components/_pagination.scss
index 756253951b2..abb81ea27cf 100644
--- a/app/assets/stylesheets/active_admin/components/_pagination.scss
+++ b/app/assets/stylesheets/active_admin/components/_pagination.scss
@@ -1,29 +1,34 @@
 .pagination {
   float: right;
-  font-size: 0.9em;
   margin-left: 10px;
 
   a {
     @include light-button;
   }
 
-  span.page.current {
-    @include default-button;
+  .page.current {
+    background-color: $primary-color;
+    border: 1px solid darken($primary-color, 5%);
+    border-radius: 0.25em;
+    color: #fff;
+    cursor: default;
+    display: inline-block;
+    font-weight: bold;
   }
 
-  a, span.page.current {
-    margin-right: 3px;
-    padding: 2px 5px;
+  a,
+  .page.current {
+    padding: 1px 5px;
   }
 }
 
 .pagination_information {
-  color: #b3bcc1;
+  color: #aab2ba;
   float: right;
   margin-top: 2px; // match pagination link top padding so both appear vertically aligned
 
   b {
-    color: #5c6469;
+    color: $text-color;
   }
 }
 

From 85450e27eea040232150b718689c8547595c3379 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Sat, 4 Apr 2015 00:59:57 -0400
Subject: [PATCH 067/170] Update basic-button mixin styles

---
 app/assets/stylesheets/active_admin/mixins/_buttons.scss | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index f695973f215..88b0fcb4ead 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -1,4 +1,5 @@
 @mixin basic-button {
+  border: 1px solid transparent;
   border-radius: 0.25em;
   cursor: pointer;
   display: inline-block;
@@ -7,6 +8,7 @@
   line-height: 1.5; // needed for input/button elements to match a.button size
   padding: 6px 10px;
   text-decoration: none;
+  transition: background-color .2s, border-color .2s, color .2s;
 
   &:hover,
   &:focus {
@@ -14,6 +16,10 @@
     text-decoration: none;
   }
 
+  &:active {
+    outline: 0;
+  }
+
   &.disabled {
     cursor: not-allowed;
     opacity: 0.5;

From 906c0eeed160c7bcae8e57c1314ba722eb14b187 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Sat, 4 Apr 2015 01:01:01 -0400
Subject: [PATCH 068/170] Update tabs to have default tab look

Previously it appeared the same as rounded gradient buttons.
---
 .../active_admin/components/_tabs.scss        | 37 ++++++++++---------
 1 file changed, 19 insertions(+), 18 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_tabs.scss b/app/assets/stylesheets/active_admin/components/_tabs.scss
index ae2c70195a2..3113a65cef8 100644
--- a/app/assets/stylesheets/active_admin/components/_tabs.scss
+++ b/app/assets/stylesheets/active_admin/components/_tabs.scss
@@ -1,40 +1,41 @@
 .nav-tabs {
   @include clearfix;
-  list-style: none;
   display: block;
-  margin: 0 0 -12px 15px;
+  list-style: none;
+  margin: 0 0 0 5px;
   padding-left: 0;
 
   li {
-    display: block;
     float: left;
-
-    & + li a {
-      border-left-width: 0;
-    }
-
-    &:first-child a {
-      border-radius: 0.25em 0 0 0.25em;
-    }
-
-    &:last-child a {
-      border-radius: 0 0.25em 0.25em 0;
-    }
+    margin: 0 2px -1px 0;
+    position: relative;
 
     a {
-      @include light-button;
+      @include basic-button;
+      border-radius: 0.25em 0.25em 0 0;
+      outline: none;
+
+      &:hover {
+        background-color: darken(#fff, 10%);
+        border-bottom-color: #d3d3d3;
+      }
     }
 
     &.ui-tabs-active {
       a,
       a:hover {
-        @include gradient(#F0F0F0, #FDFDFD);
+        background-color: #fff;
+        border: 1px solid #d3d3d3;
+        border-bottom-color: transparent;
+        color: $text-color;
       }
     }
   }
 }
 
 .tab-content {
+  background-color: #fff;
   border: 1px solid #D3D3D3;
-  padding: 30px 15px 15px 15px;
+  border-radius: 0.25em;
+  padding: 15px;
 }

From 28271a33312386d6fd97d38432e1494a5ba66eed Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 7 Apr 2015 22:55:31 -0400
Subject: [PATCH 069/170] Update z-indexes and remove unnecessary ones

---
 app/assets/stylesheets/active_admin/_header.scss             | 5 ++---
 .../stylesheets/active_admin/components/_date_picker.scss    | 1 -
 .../stylesheets/active_admin/components/_dropdown_menu.scss  | 2 +-
 .../stylesheets/active_admin/structure/_title_bar.scss       | 1 -
 4 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index 34d33ec14bb..720368c669a 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -3,7 +3,6 @@
   display: table;
   padding: 5px $horizontal-page-margin;
   width: 100%;
-  z-index: 900;
 
   a, a:link, a:visited {
     color: $page-header-text-color;
@@ -83,7 +82,7 @@
 
       &.has_nested:hover > a {
         border-radius: 4px 4px 0 0;
-        z-index: 1020;
+        z-index: 960; // so top part of sub menu box-shadow doesn't appear over this link
       }
 
       &:hover ul {
@@ -99,7 +98,7 @@
         min-width: 175px;
         padding: 5px 0;
         position: absolute;
-        z-index: 1010;
+        z-index: 950;
 
         li {
           &.current a,
diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index 3ac9a0b2979..958d9481fa3 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -15,7 +15,6 @@
     color: #fff;
     padding: 5px;
     position: relative;
-    z-index: 2000;
 
     .ui-datepicker-title {
       display: block;
diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index dbc6601349c..4ed314045ad 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -26,7 +26,7 @@
   left: 0;
   position: absolute;
   top: 100%;
-  z-index: 2000;
+  z-index: 950;
 }
 
 .dropdown_menu_list {
diff --git a/app/assets/stylesheets/active_admin/structure/_title_bar.scss b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
index 75ef9c92729..8b2cc717857 100644
--- a/app/assets/stylesheets/active_admin/structure/_title_bar.scss
+++ b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
@@ -5,7 +5,6 @@
   font-size: 1em;
   padding: 10px $horizontal-page-margin;
   width: 100%;
-  z-index: 800;
 
   h2 {
     font-size: 2.2em;

From 0ea05bb4c6109289598fa41672aae2ff5e5f6f2e Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 7 Apr 2015 23:48:35 -0400
Subject: [PATCH 070/170] Update modal dialog styles

---
 .../components/_modal_dialog.scss             | 54 ++++++++++++-------
 1 file changed, 36 insertions(+), 18 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
index f3bd4971f24..a40bcd250d1 100644
--- a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
+++ b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
@@ -1,34 +1,52 @@
 .ui-widget-overlay {
+  background-color: rgba(0, 0, 0, 0.5);
+  bottom: 0;
+  left: 0;
   position: fixed;
-  background: rgba(0,0,0,.2);
-  top: 0; left: 0; right: 0; bottom: 0;
+  right: 0;
+  top: 0;
   z-index: 1001;
 }
 
 .ui-dialog {
+  @include section-background;
+  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
+  outline: none;
   position: fixed;
   z-index: 1002;
-  @include section-background;
-  box-shadow: rgba(0,0,0,0.5) 0 0 10px;
 
-  .ui-dialog-titlebar {
-    @include section-header;
-    span { font-size: 1.1em }
+  ul {
+    list-style-type: none;
+    margin: 0;
+    padding: 0;
   }
 
-  ul { list-style-type: none }
-  li { margin: 10px 0 }
-  label { margin-right: 10px }
-
-  .ui-dialog-buttonpane, form {
-    padding: 7px 15px 13px
+  label {
+    margin-right: 10px;
   }
-  .ui-dialog-buttonpane button {
-    & { @include dark-button } // OK
-    &:last-child { @include light-button } // Cancel
+
+  form,
+  .ui-dialog-buttonpane {
+    padding: 15px;
   }
 }
 
-.active_admin_dialog.ui-dialog {
-  .ui-dialog-titlebar-close { display: none }
+.ui-dialog-titlebar {
+  @include section-header;
+}
+
+.ui-dialog-titlebar-close {
+  display: none;
+}
+
+.ui-dialog-buttonpane button {
+  margin-right: 5px;
+
+  & {
+    @include dark-button;
+  }
+
+  &.cancel {
+    @include light-button;
+  }
 }

From 4b6e18b31f6d8f6f11d6f5f75f94b14f57aa020e Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 7 Apr 2015 23:50:13 -0400
Subject: [PATCH 071/170] Add explicit dialog buttons so we can add classes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

In the long run we’d like to style all buttons via a reusable set of
classes rather than have to target each element uniquely and use a
mixin. Buttons are so common it would be great to have a reusable class
especially if someone is customizing ActiveAdmin with custom
interactions and needs buttons.
---
 .../active_admin/lib/modal_dialog.js.coffee      | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/active_admin/lib/modal_dialog.js.coffee b/app/assets/javascripts/active_admin/lib/modal_dialog.js.coffee
index 9ea767b639b..a011c2784ac 100644
--- a/app/assets/javascripts/active_admin/lib/modal_dialog.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/modal_dialog.js.coffee
@@ -38,8 +38,14 @@ ActiveAdmin.modal_dialog = (message, inputs, callback)->
       $('body').trigger 'modal_dialog:after_open', [form]
     dialogClass: 'active_admin_dialog'
     buttons:
-      OK: ->
-        callback $(@).serializeObject()
-        $(@).dialog('close')
-      Cancel: ->
-        $(@).dialog('close').remove()
+      OK:
+        text: 'OK'
+        class: 'button'
+        click: ->
+          callback $(@).serializeObject()
+          $(@).dialog('close')
+      Cancel:
+        text: 'Cancel'
+        class: 'button cancel'
+        click: ->
+          $(@).dialog('close').remove()

From fe121470937014545fa8c25cadd59336f43ac517 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 8 Apr 2015 00:05:37 -0400
Subject: [PATCH 072/170] Add indeterminate support if some checkboxes are
 checked
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

A nice visual enhancement that shows the toggle all checkbox in an
indeterminate state which is visual only (similar to GitHub for Mac or
Gmail web). I have a jQuery plugin I’m working for this behavior so I’m
already familiar with what to add. For more info:
https://css-tricks.com/indeterminate-checkboxes/

Performance improvements as there is no need to loop over checkboxes to
set checked property, the prop method will work on a collection.
Further the loop was needed to trigger didChangeCheckbox method for the
table-checkbox-toggler sub class but the better way is for that
subclass to override the didChangeToggleAllCheckbox otherwise you’re
calling didChangeCheckbox for every checkbox and running DOM queries
and updates that are unnecessary. Existing behavior preserved as all
tests are passing.
---
 .../active_admin/lib/checkbox-toggler.js.coffee  | 16 +++++++++-------
 .../lib/table-checkbox-toggler.js.coffee         |  8 ++++++++
 2 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/app/assets/javascripts/active_admin/lib/checkbox-toggler.js.coffee b/app/assets/javascripts/active_admin/lib/checkbox-toggler.js.coffee
index 4b7800b59a6..78bde365504 100644
--- a/app/assets/javascripts/active_admin/lib/checkbox-toggler.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/checkbox-toggler.js.coffee
@@ -23,15 +23,17 @@ class ActiveAdmin.CheckboxToggler
     @toggle_all_checkbox.change => @_didChangeToggleAllCheckbox()
 
   _didChangeCheckbox: (checkbox)->
-    switch @checkboxes.filter(':checked').length
-      when @checkboxes.length - 1 then @toggle_all_checkbox.prop checked: null
-      when @checkboxes.length     then @toggle_all_checkbox.prop checked: true
+    numChecked = @checkboxes.filter(':checked').length
+
+    allChecked = numChecked == @checkboxes.length
+    someChecked = numChecked > 0 && numChecked < @checkboxes.length
+
+    @toggle_all_checkbox.prop checked: allChecked, indeterminate: someChecked
 
   _didChangeToggleAllCheckbox: ->
-    setting = if @toggle_all_checkbox.prop 'checked' then true else null
-    @checkboxes.each (index, el)=>
-      $(el).prop checked: setting
-      @_didChangeCheckbox(el)
+    setting = @toggle_all_checkbox.prop 'checked'
+    @checkboxes.prop checked: setting
+    setting
 
   option: (key, value) ->
     if $.isPlainObject(key)
diff --git a/app/assets/javascripts/active_admin/lib/table-checkbox-toggler.js.coffee b/app/assets/javascripts/active_admin/lib/table-checkbox-toggler.js.coffee
index 25ec31c5877..2ba5f2dc880 100644
--- a/app/assets/javascripts/active_admin/lib/table-checkbox-toggler.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/table-checkbox-toggler.js.coffee
@@ -18,6 +18,14 @@ class ActiveAdmin.TableCheckboxToggler extends ActiveAdmin.CheckboxToggler
     else
       $row.removeClass 'selected'
 
+  _didChangeToggleAllCheckbox: ->
+    checked = super
+
+    if checked
+      @$container.find('tbody tr').addClass 'selected'
+    else
+      @$container.find('tbody tr').removeClass 'selected'
+
   _didClickCell: (cell) ->
     $(cell).parent('tr').find(':checkbox').click()
 

From df99f483f642ebf5b84e1e934a3e31b352554934 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 8 Apr 2015 00:58:53 -0400
Subject: [PATCH 073/170] Wrap resource_selection_toggle_cell in a label tag

This way the text itself is clickable and toggles the checkbox.
---
 .../batch_actions/views/selection_cells.rb            | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/lib/active_admin/batch_actions/views/selection_cells.rb b/lib/active_admin/batch_actions/views/selection_cells.rb
index f152181435f..fb5c58f51f9 100644
--- a/lib/active_admin/batch_actions/views/selection_cells.rb
+++ b/lib/active_admin/batch_actions/views/selection_cells.rb
@@ -7,8 +7,11 @@ module BatchActions
     class ResourceSelectionToggleCell < ActiveAdmin::Component
       builder_method :resource_selection_toggle_cell
 
-      def build
-        input type: "checkbox", id: "collection_selection_toggle_all", name: "collection_selection_toggle_all", class: "toggle_all"
+      def build(label_text='')
+        label do
+          input type: "checkbox", id: "collection_selection_toggle_all", name: "collection_selection_toggle_all", class: "toggle_all"
+          text_node label_text if label_text.present?
+        end
       end
     end
 
@@ -27,10 +30,8 @@ class ResourceSelectionTogglePanel < ActiveAdmin::Component
 
       def build
         super(id: "collection_selection_toggle_panel")
-        resource_selection_toggle_cell
-        div(id: "collection_selection_toggle_explaination" ) { I18n.t('active_admin.batch_actions.selection_toggle_explanation', default: "(Toggle Selection)") }
+        resource_selection_toggle_cell(I18n.t('active_admin.batch_actions.selection_toggle_explanation', default: "(Toggle Selection)"))
       end
-
     end
 
   end

From 6a92e4442d715e83c48b6cab767d8ba237d9a277 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 8 Apr 2015 00:59:39 -0400
Subject: [PATCH 074/170] Clean up batch actions styles

No need to for floats now since the checkbox and label text are now
wrapped in a label tag as they should be so they already appear side by
side.
---
 .../active_admin/components/_batch_actions.scss      | 12 ++----------
 1 file changed, 2 insertions(+), 10 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_batch_actions.scss b/app/assets/stylesheets/active_admin/components/_batch_actions.scss
index 12ad1517474..5c67015b113 100644
--- a/app/assets/stylesheets/active_admin/components/_batch_actions.scss
+++ b/app/assets/stylesheets/active_admin/components/_batch_actions.scss
@@ -1,11 +1,3 @@
-#collection_selection_toggle_panel {
-  @include clearfix;
-  >.resource_selection_toggle_cell {
-    float:left;
-  }
-  #collection_selection_toggle_explaination {
-    float:left;
-    margin-left:5px;
-    font-style:italic;
-  }
+.resource_selection_toggle_panel {
+  margin-bottom: 15px;
 }

From 4794379c164cb04d100d18ea26ed220edfb28504 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 8 Apr 2015 01:12:31 -0400
Subject: [PATCH 075/170] Decrease selector nesting as much as possible

Easier to do here since jQuery UI applies good specific class names.
---
 .../active_admin/components/_date_picker.scss | 183 +++++++++---------
 1 file changed, 92 insertions(+), 91 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index 958d9481fa3..d30defb9348 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -1,4 +1,3 @@
-// -------------------------------------- Date Picker
 .ui-datepicker {
   box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
   display: none;
@@ -8,108 +7,110 @@
   a:hover {
     text-decoration: none;
   }
+}
 
-  .ui-datepicker-header {
-    background-color: lighten($primary-color, 5%);
-    border-radius: 0.25em 0.25em 0 0;
-    color: #fff;
-    padding: 5px;
-    position: relative;
-
-    .ui-datepicker-title {
-      display: block;
-      font-weight: bold;
-      text-align: center;
-    }
+.ui-datepicker-title {
+  display: block;
+  font-weight: bold;
+  text-align: center;
+}
 
-    a {
-      bottom: 0;
-      color: #fff;
-      cursor: pointer;
-      display: block;
-      position: absolute;
-      top: 0;
-      width: 20px;
-
-      &:after {
-        border-bottom: 4px solid transparent;
-        border-top: 4px solid transparent;
-        content: '';
-        height: 0;
-        position: absolute;
-        top: calc(50% - 4px);
-        width: 0;
-      }
+.ui-datepicker-header {
+  background-color: lighten($primary-color, 5%);
+  border-radius: 0.25em 0.25em 0 0;
+  color: #fff;
+  padding: 5px;
+  position: relative; // for datepicker prev/next buttons
+}
 
-      &.ui-datepicker-prev {
-        left: 0;
+.ui-datepicker-prev,
+.ui-datepicker-next {
+  bottom: 0;
+  color: #fff;
+  cursor: pointer;
+  display: block;
+  position: absolute;
+  top: 0;
+  width: 20px; // with top/bottom provide larger hit area for button
+
+  // base for arrows
+  &:after {
+    border-bottom: 4px solid transparent;
+    border-top: 4px solid transparent;
+    content: '';
+    height: 0;
+    position: absolute;
+    top: calc(50% - 4px);
+    width: 0;
+  }
 
-        &:after {
-          border-right: 5px solid;
-          left: calc(50% - 2px);
-        }
-      }
+  span {
+    display: none; // hide Next/Prev text
+  }
+}
 
-      &.ui-datepicker-next {
-        right: 0;
+.ui-datepicker-prev {
+  left: 0;
 
-        &:after {
-          border-left: 5px solid;
-          right: calc(50% - 2px);
-        }
-      }
+  &:after {
+    border-right: 5px solid; // arrow pointing left
+    left: calc(50% - 2px); // half of arrow size (border) to horizontally center
+  }
+}
 
-      span {
-        display: none;
-      }
-    }
+.ui-datepicker-next {
+  right: 0;
+
+  &:after {
+    border-left: 5px solid; // arrow pointing right
+    right: calc(50% - 2px); // half of arrow size (border) to horizontally center
   }
+}
 
-  table.ui-datepicker-calendar {
-    background-color: #f4f4f4;
-    border: solid 1px #63686e;
-    border-width: 0 1px 1px 1px;
-    margin-bottom: 0;
+.ui-datepicker-calendar {
+  background-color: #f4f4f4;
+  border: solid 1px #63686e;
+  border-width: 0 1px 1px 1px;
+  margin-bottom: 0;
 
-    td, th {
-      padding: 0;
-      text-align: center;
-    }
+  td, th {
+    padding: 0;
+    text-align: center;
+  }
 
-    thead th {
-      border-bottom: none;
-      font-size: 0.9em;
-      font-weight: normal;
-      padding: 2px 0;
-    }
+  thead th {
+    border-bottom: none;
+    font-size: 0.9em;
+    font-weight: normal;
+    padding: 2px 0;
+  }
+
+  tbody {
+    td {
+      border: none;
+      height: 22px;
+      width: 22px;
+
+      a {
+        border-radius: 0.25em;
+        color: #666;
+        display: block;
+        font-size: 0.9em;
+        font-weight: bold;
+        padding: 4px;
+
+        &:hover {
+          background-color: #eceef0;
+        }
+
+        &.ui-state-active,
+        &.ui-state-active:hover {
+          background-color: #5a5f64;
+          color: #fff;
+        }
 
-    tbody {
-      td {
-        border: none;
-        height: 22px;
-        width: 22px;
-
-        a {
-          border-radius: 0.25em;
-          color: #666;
-          display: block;
-          font-size: 0.9em;
-          font-weight: bold;
-          padding: 4px;
-
-          &:hover {
-            background-color: #eceef0;
-          }
-
-          &.ui-state-active,
-          &.ui-state-active:hover {
-            background-color: #5a5f64;
-            color: #fff;
-          }
-
-          &.ui-state-highlight { // today's date
-            background-color: #dbdddf;
-          }
+        &.ui-state-highlight { // today's date
+          background-color: #dbdddf;
         }
       }
     }

From fc61444e5b33b44a4ca3b7980eed15bafb8ba71d Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 8 Apr 2015 01:54:09 -0400
Subject: [PATCH 076/170] Remove excessive status_tag classes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Confusing to have so many, keep it to just a select few so its
consistent. Removed: warn, orange, errored, red, complete, published,
and green. For the ok status I left in ok and completed (this probably
should be “success”).

I think the default status_tag background color should be gray, the
same as the “no” class but we can decide that later once configuring
all values.
---
 .../stylesheets/active_admin/components/_grid.scss  |  4 +---
 .../active_admin/components/_status_tags.scss       | 13 +++----------
 .../active_admin/components/_tables.scss            |  8 ++------
 3 files changed, 6 insertions(+), 19 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_grid.scss b/app/assets/stylesheets/active_admin/components/_grid.scss
index b1c9c6c50d1..4199f743190 100644
--- a/app/assets/stylesheets/active_admin/components/_grid.scss
+++ b/app/assets/stylesheets/active_admin/components/_grid.scss
@@ -1,9 +1,7 @@
-// -------------------------------------- Index as Grid
-table.index_grid td {
+.index_grid td {
   border: none;
 }
 
-// -------------------------------------- Columns
 .columns {
   @include clearfix;
   margin-bottom: 10px;
diff --git a/app/assets/stylesheets/active_admin/components/_status_tags.scss b/app/assets/stylesheets/active_admin/components/_status_tags.scss
index bdde260d7ed..d61e7bbc81a 100644
--- a/app/assets/stylesheets/active_admin/components/_status_tags.scss
+++ b/app/assets/stylesheets/active_admin/components/_status_tags.scss
@@ -6,22 +6,15 @@
   text-align: center;
 
   &.ok,
-  &.published,
-  &.complete,
-  &.completed,
-  &.green {
+  &.completed {
     background-color: #8daa92;
   }
 
-  &.warn,
-  &.warning,
-  &.orange {
+  &.warning {
     background-color: #e29b20;
   }
 
-  &.error,
-  &.errored,
-  &.red {
+  &.error {
     background-color: #d45f53;
   }
 
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 3c3bdccb975..8aa4d25496c 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -1,5 +1,3 @@
-// ----------------------------------- Tables
-
 table {
   margin-bottom: 1.4em;
   width: 100%;
@@ -22,8 +20,7 @@ thead {
   }
 }
 
-// --------- Index Tables
-
+// -------------------------------------- Index Tables
 table.index_table {
   th {
     a, a:link, a:visited {
@@ -75,8 +72,7 @@ table.index_table {
   }
 }
 
-// --------- Tables inside Panels
-
+// -------------------------------------- Tables inside Panels
 .panel_contents table {
   thead {
     background-color: transparent;

From 0e2730bf72ddd422b2e89310eb7df6368a7eea18 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 8 Apr 2015 02:04:16 -0400
Subject: [PATCH 077/170] Rename "count" class to "badge"

The badge name is a much better fit. Bootstrap uses this for the same
type of element so lets bring over some of the basic styles.
---
 .../active_admin/components/_table_tools.scss         | 11 ++++++++---
 lib/active_admin/views/components/scopes.rb           |  4 ++--
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_table_tools.scss b/app/assets/stylesheets/active_admin/components/_table_tools.scss
index 7cd86ccfc99..f9b3823a7f4 100644
--- a/app/assets/stylesheets/active_admin/components/_table_tools.scss
+++ b/app/assets/stylesheets/active_admin/components/_table_tools.scss
@@ -15,9 +15,14 @@ a.table_tools_button {
   padding: 0;
   vertical-align: bottom; // required so this aligns correctly with .dropdown_menu
 
-  .count {
-    color: #8e979e;
-    font-weight: normal;
+  .badge {
+    background-color: rgba(0,0,0,0.35);
+    border-radius: 10px;
+    color: #fff;
+    display: inline-block;
+    line-height: 1;
+    padding: 3px 7px;
+    vertical-align: baseline;
   }
 
   li {
diff --git a/lib/active_admin/views/components/scopes.rb b/lib/active_admin/views/components/scopes.rb
index e5700a5b06c..1c86119065b 100644
--- a/lib/active_admin/views/components/scopes.rb
+++ b/lib/active_admin/views/components/scopes.rb
@@ -36,8 +36,8 @@ def build_scope(scope, options)
 
           a href: url_for(scope: scope.id, params: params), class: 'table_tools_button' do
             text_node scope_name
-            span class: 'count' do
-              "(#{get_scope_count(scope)})"
+            span class: 'badge' do
+              "#{get_scope_count(scope)}"
             end if options[:scope_count] && scope.show_count
           end
         end

From e8df8baf1ecd7c9e04c24bd099a8840f9ed93ae7 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 9 Apr 2015 00:32:55 -0400
Subject: [PATCH 078/170] Remove use of gradient mixin (popovers eventually
 will be removed)

---
 .../stylesheets/active_admin/components/_popovers.scss       | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_popovers.scss b/app/assets/stylesheets/active_admin/components/_popovers.scss
index 4441462db81..46af6b01a67 100644
--- a/app/assets/stylesheets/active_admin/components/_popovers.scss
+++ b/app/assets/stylesheets/active_admin/components/_popovers.scss
@@ -5,7 +5,6 @@
   padding: 2px;
   box-shadow: rgba(0,0,0,0.4) 0 1px 3px, lighten($primary-color, 15%) 0px 1px 0px 0px inset;
   background-color: $primary-color;
-  @include gradient(lighten($primary-color, 4%), darken($primary-color, 5%));
   border: solid 1px darken($primary-color, 10%);
   border-top-color: darken($primary-color, 4%);
   border-bottom-color: darken($primary-color, 17%);
@@ -89,12 +88,12 @@
         text-align: center;
 
         &:hover {
-          @include highlight-gradient;
+          background-color: #75a1c2;
           color: #FFF;
         }
 
         &:active {
-          @include reverse-highlight-gradient;
+          background-color: #608cb4;
           color: #FFF;
         }
 

From 50f7655a628cd41cfd1838d2804b0bf7b2c1c441 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 9 Apr 2015 00:33:56 -0400
Subject: [PATCH 079/170] Simplify status_tag classes, no type and add
 FALSE_VALUES

---
 .../active_admin/components/_status_tags.scss | 19 ++-----------
 .../views/components/status_tag.rb            | 15 ++++------
 spec/unit/views/components/status_tag_spec.rb | 28 ++-----------------
 3 files changed, 10 insertions(+), 52 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_status_tags.scss b/app/assets/stylesheets/active_admin/components/_status_tags.scss
index d61e7bbc81a..80346c8d19b 100644
--- a/app/assets/stylesheets/active_admin/components/_status_tags.scss
+++ b/app/assets/stylesheets/active_admin/components/_status_tags.scss
@@ -1,28 +1,15 @@
 .status_tag {
-  background-color: darken($secondary-color, 15%);
   border-radius: 0.25em;
   color: #fff;
   padding: 0.2em 0.5em;
   text-align: center;
 
-  &.ok,
-  &.completed {
-    background-color: #8daa92;
-  }
-
-  &.warning {
-    background-color: #e29b20;
-  }
-
-  &.error {
-    background-color: #d45f53;
+  &,
+  &.no {
+    background-color: #777;
   }
 
   &.yes {
     background-color: #6090DB;
   }
-
-  &.no {
-    background-color: grey;
-  }
 }
diff --git a/lib/active_admin/views/components/status_tag.rb b/lib/active_admin/views/components/status_tag.rb
index 01b6682afd3..00cc18376c8 100644
--- a/lib/active_admin/views/components/status_tag.rb
+++ b/lib/active_admin/views/components/status_tag.rb
@@ -2,6 +2,8 @@ module ActiveAdmin
   module Views
     # Build a StatusTag
     class StatusTag < ActiveAdmin::Component
+      FALSE_VALUES = [nil, false, 0, '0', 'f', 'F', 'false', 'FALSE', 'off', 'OFF']
+
       builder_method :status_tag
 
       def tag_name
@@ -14,7 +16,6 @@ def default_class_name
 
       # @overload status_tag(status, type = nil, options = {})
       #   @param [String] status the status to display. One of the span classes will be an underscored version of the status.
-      #   @param [Symbol] type type of status. Will become a class of the span. ActiveAdmin provide style for :ok, :warning and :error.
       #   @param [Hash] options
       #   @option options [String] :class to override the default class
       #   @option options [String] :id to override the default id
@@ -26,17 +27,12 @@ def default_class_name
       #   # => <span class='status_tag in_progress'>In Progress</span>
       #
       # @example
-      #   status_tag('active', :ok)
-      #   # => <span class='status_tag active ok'>Active</span>
-      #
-      # @example
-      #   status_tag('active', :ok, class: 'important', id: 'status_123', label: 'on')
-      #   # => <span class='status_tag active ok important' id='status_123'>on</span>
+      #   status_tag('active', class: 'important', id: 'status_123', label: 'on')
+      #   # => <span class='status_tag active important' id='status_123'>on</span>
       #
       def build(*args)
         options = args.extract_options!
         status = args[0]
-        type = args[1]
         label = options.delete(:label)
         classes = options.delete(:class)
         status = convert_to_boolean_status(status)
@@ -50,7 +46,6 @@ def build(*args)
         super(content, options)
 
         add_class(status_to_class(status)) if status
-        add_class(type.to_s) if type
         add_class(classes) if classes
       end
 
@@ -60,7 +55,7 @@ def convert_to_boolean_status(status)
         case status
         when true, 'true'
           'Yes'
-        when false, 'false', nil
+        when *FALSE_VALUES
           'No'
         else
           status
diff --git a/spec/unit/views/components/status_tag_spec.rb b/spec/unit/views/components/status_tag_spec.rb
index 7dba5da93cf..8d4f26d8789 100644
--- a/spec/unit/views/components/status_tag_spec.rb
+++ b/spec/unit/views/components/status_tag_spec.rb
@@ -131,25 +131,6 @@ def status_tag(*args)
       end
     end
 
-    context "when status is 'Active' and type is :ok" do
-      subject { status_tag('Active', :ok) }
-
-      describe '#class_list' do
-        subject { super().class_list }
-        it      { is_expected.to include('status_tag') }
-      end
-
-      describe '#class_list' do
-        subject { super().class_list }
-        it      { is_expected.to include('active') }
-      end
-
-      describe '#class_list' do
-        subject { super().class_list }
-        it      { is_expected.to include('ok') }
-      end
-    end
-
     context "when status is 'Active' and class is 'ok'" do
       subject { status_tag('Active', class: 'ok') }
 
@@ -193,8 +174,8 @@ def status_tag(*args)
       end
     end
 
-    context "when status is 'So useless', type is :ok, class is 'woot awesome' and id is 'useless'" do
-      subject { status_tag('So useless', :ok, class: 'woot awesome', id: 'useless') }
+    context "when status is 'So useless', class is 'woot awesome' and id is 'useless'" do
+      subject { status_tag('So useless', class: 'woot awesome', id: 'useless') }
 
       describe '#content' do
         subject { super().content }
@@ -206,11 +187,6 @@ def status_tag(*args)
         it      { is_expected.to include('status_tag') }
       end
 
-      describe '#class_list' do
-        subject { super().class_list }
-        it      { is_expected.to include('ok') }
-      end
-
       describe '#class_list' do
         subject { super().class_list }
         it      { is_expected.to include('so_useless') }

From 1154956883a7534f6e6c4f65b8e0dd2fdfa6996d Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 9 Apr 2015 00:34:08 -0400
Subject: [PATCH 080/170] Fix failing spec as we renamed .count to .badge

---
 features/step_definitions/index_scope_steps.rb | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/features/step_definitions/index_scope_steps.rb b/features/step_definitions/index_scope_steps.rb
index c45d9a489a7..76d110f68fa 100644
--- a/features/step_definitions/index_scope_steps.rb
+++ b/features/step_definitions/index_scope_steps.rb
@@ -11,11 +11,11 @@
 
 Then /^I should see the scope "([^"]*)" with the count (\d+)$/ do |name, count|
   name = name.tr(' ','').underscore.downcase
-  step %{I should see "#{count}" within ".scopes .#{name} .count"}
+  step %{I should see "#{count}" within ".scopes .#{name} .badge"}
 end
 
 Then /^I should see the scope "([^"]*)" with no count$/ do |name|
   name = name.tr(" ", "").underscore.downcase
   expect(page).to     have_css ".scopes .#{name}"
-  expect(page).to_not have_css ".scopes .#{name} .count"
+  expect(page).to_not have_css ".scopes .#{name} .badge"
 end

From 0f451c0adc73901833785b60ce3e804617ff72f1 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 9 Apr 2015 00:36:02 -0400
Subject: [PATCH 081/170] Add z-index so rollover border appears on top

---
 .../active_admin/components/_table_tools.scss          | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/app/assets/stylesheets/active_admin/components/_table_tools.scss b/app/assets/stylesheets/active_admin/components/_table_tools.scss
index f9b3823a7f4..cbd3eac1d26 100644
--- a/app/assets/stylesheets/active_admin/components/_table_tools.scss
+++ b/app/assets/stylesheets/active_admin/components/_table_tools.scss
@@ -33,6 +33,16 @@ a.table_tools_button {
       margin-left: -1px;
     }
 
+    a {
+      position: relative;
+
+      &:hover,
+      &:focus,
+      &:active {
+        z-index: 2;
+      }
+    }
+
     &:first-child a {
       border-radius: 0.25em 0 0 0.25em;
     }

From bdfce9ae59f6f35044c010d84795bb1b37ba4512 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 9 Apr 2015 00:36:36 -0400
Subject: [PATCH 082/170] Use bg and border instead of gradient for selected
 state

---
 .../stylesheets/active_admin/components/_table_tools.scss  | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_table_tools.scss b/app/assets/stylesheets/active_admin/components/_table_tools.scss
index cbd3eac1d26..abe52526b4e 100644
--- a/app/assets/stylesheets/active_admin/components/_table_tools.scss
+++ b/app/assets/stylesheets/active_admin/components/_table_tools.scss
@@ -52,10 +52,13 @@ a.table_tools_button {
     }
 
     &.selected a {
-      @include gradient(#F0F0F0, #FDFDFD);
+      background-color: darken(#fff, 10%);
+      border-color: darken(#d9d9d9, 12%);
+      z-index: 2;
 
       &:hover {
-        @include gradient(#F0F0F0, #FDFDFD);
+        background-color: darken(#fff, 17%);
+        border-color: darken(#d9d9d9, 25%);
       }
     }
   }

From f88ddf74e7b85a92b53c196f2f982efd61372ea2 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 9 Apr 2015 00:40:04 -0400
Subject: [PATCH 083/170] Remove gradients and dark-button mixin, use simple
 bg's
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Eventually we’ll clean up button mixin names as default should be the
light color and the default mixin currently will be come the primary
button theme. Make buttons easier to skin by just using a simple
background color and border.
---
 .../stylesheets/active_admin/_forms.scss      |  2 +-
 .../active_admin/components/_buttons.scss     |  2 +-
 .../components/_modal_dialog.scss             |  2 +-
 .../stylesheets/active_admin/mixins/_all.scss |  1 -
 .../active_admin/mixins/_buttons.scss         | 42 ++++++++++---------
 .../active_admin/mixins/_gradients.scss       | 24 -----------
 6 files changed, 26 insertions(+), 47 deletions(-)
 delete mode 100644 app/assets/stylesheets/active_admin/mixins/_gradients.scss

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 472c744800e..a7f84db76d6 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -168,7 +168,7 @@ textarea {
   input[type=submit],
   input[type=button],
   button {
-    @include dark-button;
+    @include default-button;
   }
 
   .button,
diff --git a/app/assets/stylesheets/active_admin/components/_buttons.scss b/app/assets/stylesheets/active_admin/components/_buttons.scss
index 94c1ee18750..ff6a2464a7a 100644
--- a/app/assets/stylesheets/active_admin/components/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/components/_buttons.scss
@@ -3,4 +3,4 @@ a.member_link {
   white-space: nowrap;
 }
 
-a.button, a:link.button, a:visited.button, input[type=submit], input[type=button], button { @include dark-button; }
+a.button, a:link.button, a:visited.button, input[type=submit], input[type=button], button { @include default-button; }
diff --git a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
index a40bcd250d1..a7156d09314 100644
--- a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
+++ b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
@@ -43,7 +43,7 @@
   margin-right: 5px;
 
   & {
-    @include dark-button;
+    @include default-button;
   }
 
   &.cancel {
diff --git a/app/assets/stylesheets/active_admin/mixins/_all.scss b/app/assets/stylesheets/active_admin/mixins/_all.scss
index 26fae7cc3b5..15e652a3f28 100644
--- a/app/assets/stylesheets/active_admin/mixins/_all.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_all.scss
@@ -1,5 +1,4 @@
 @import "active_admin/mixins/variables";
-@import "active_admin/mixins/gradients";
 @import "active_admin/mixins/buttons";
 @import "active_admin/mixins/sections";
 @import "active_admin/mixins/utilities";
diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index 88b0fcb4ead..0fa30c169ba 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -28,44 +28,48 @@
 
 @mixin default-button {
   @include basic-button;
-  @include gradient(lighten($primary-color, 15%), darken($primary-color, 12%));
-  border: solid 1px #484e53;
-  color: #efefef;
+//   @include gradient(lighten($primary-color, 15%), darken($primary-color, 12%));
+// $primary-color: #3498DB;
+  background-color: $primary-color;
+  border: 1px solid darken($primary-color, 5%);
+  color: #fff;
 
   &:not(.disabled) {
     &:hover{
-      @include gradient(lighten($primary-color, 18%), darken($primary-color, 9%));
+//       @include gradient(lighten($primary-color, 18%), darken($primary-color, 9%));
+      background-color: darken($primary-color, 10%);
+      border-color: darken($primary-color, 15%);
     }
 
     &:active {
-      @include gradient(lighten($primary-color, 8%), darken($primary-color, 17%));
+//       @include gradient(lighten($primary-color, 8%), darken($primary-color, 17%));
+      box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
     }
   }
+
+  &:hover,
+  &:focus {
+    color: #fff;
+  }
 }
 
 @mixin light-button {
   @include basic-button;
-  @include gradient(#FFFFFF, #E7E7E7);
-  border: solid 1px #c7c7c7;
+//   @include gradient(#FFFFFF, #E7E7E7);
+  background-color: #fff;
+  border: 1px solid #d9d9d9;
   color: $primary-color;
 
   &:not(.disabled) {
     &:hover {
-      @include gradient(#FFFFFF, #F1F1F1);
+//       @include gradient(#FFFFFF, #F1F1F1);
+      background-color: darken(#fff, 10%);
+      border-color: darken(#d9d9d9, 12%);
     }
 
     &:active {
-      @include gradient(#F3F3F3, #D8D8D8);
+//       @include gradient(#F3F3F3, #D8D8D8);
+      box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
     }
   }
-
-}
-
-@mixin dark-button {
-  @include default-button;
-
-  &:hover,
-  &:focus {
-    color: #efefef;
-  }
 }
diff --git a/app/assets/stylesheets/active_admin/mixins/_gradients.scss b/app/assets/stylesheets/active_admin/mixins/_gradients.scss
deleted file mode 100644
index b8941107462..00000000000
--- a/app/assets/stylesheets/active_admin/mixins/_gradients.scss
+++ /dev/null
@@ -1,24 +0,0 @@
-$secondary-gradient-start: #efefef !default;
-$secondary-gradient-stop: #dfe1e2 !default;
-
-@mixin gradient($start, $end){
-  background-color: $start;
-  background-image: linear-gradient(180deg, $start, $end);
-}
-
-@mixin primary-gradient {
-  @include gradient(lighten($primary-color, 5%), darken($primary-color, 7%));
-  border-bottom: 1px solid darken($primary-color, 11%);
-}
-
-@mixin secondary-gradient {
-  @include gradient($secondary-gradient-start, $secondary-gradient-stop);
-}
-
-@mixin highlight-gradient {
-  @include gradient(#75a1c2, #608cb4);
-}
-
-@mixin reverse-highlight-gradient {
-  @include gradient(#608cb4, #75a1c2);
-}

From cc50ba01729387b98564730f6c835f7eedfd7d14 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 9 Apr 2015 01:21:13 -0400
Subject: [PATCH 084/170] Replace has_many drag icon with simple entity based
 icon

The entity used is &#6145; (the CSS hex format is \1801) but applied
several times to give the appearance of something that you can grip and
move.
---
 app/assets/stylesheets/active_admin/_forms.scss | 11 ++++++++++-
 lib/active_admin/form_builder.rb                |  4 +---
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index a7f84db76d6..a6609de3b8a 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -81,6 +81,7 @@ textarea {
   // relative so the absolutely-positioned handle will fit
   .has_many_fields {
     border-bottom: 1px solid #e8e8e8;
+    margin-bottom: 15px;
 
     ol {
       padding: 0 15px;
@@ -88,10 +89,18 @@ textarea {
     }
 
     .handle {
+      bottom: 0;
       cursor: move;
       position: absolute;
       right: 0;
-      top: calc(50% - 3em / 2);
+      top: 0;
+      width: 20px;
+
+      &:before {
+        content: '\1801\1801\1801\1801';
+        font-size: 1.8em;
+        position: absolute;
+      }
     }
   }
 
diff --git a/lib/active_admin/form_builder.rb b/lib/active_admin/form_builder.rb
index e01b26a65eb..7b1e33b626d 100644
--- a/lib/active_admin/form_builder.rb
+++ b/lib/active_admin/form_builder.rb
@@ -97,9 +97,7 @@ def has_many_actions(has_many_form, builder_options, contents)
       if builder_options[:sortable]
         has_many_form.input builder_options[:sortable], as: :hidden
 
-        contents << template.content_tag(:li, class: 'handle') do
-          "MOVE"
-        end
+        contents << template.content_tag(:li, class: 'handle') { }
       end
 
       contents

From 423ea46e80692042181a69f367352a1e0101e0ac Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 9 Apr 2015 10:10:28 -0400
Subject: [PATCH 085/170] Use toggleClass method

---
 .../lib/table-checkbox-toggler.js.coffee           | 14 ++------------
 1 file changed, 2 insertions(+), 12 deletions(-)

diff --git a/app/assets/javascripts/active_admin/lib/table-checkbox-toggler.js.coffee b/app/assets/javascripts/active_admin/lib/table-checkbox-toggler.js.coffee
index 2ba5f2dc880..ae4bd4b1d8a 100644
--- a/app/assets/javascripts/active_admin/lib/table-checkbox-toggler.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/table-checkbox-toggler.js.coffee
@@ -11,20 +11,10 @@ class ActiveAdmin.TableCheckboxToggler extends ActiveAdmin.CheckboxToggler
   _didChangeCheckbox: (checkbox) ->
     super
 
-    $row = $(checkbox).parents 'tr'
-
-    if checkbox.checked
-      $row.addClass 'selected'
-    else
-      $row.removeClass 'selected'
+    $(checkbox).parents('tr').toggleClass 'selected', checkbox.checked
 
   _didChangeToggleAllCheckbox: ->
-    checked = super
-
-    if checked
-      @$container.find('tbody tr').addClass 'selected'
-    else
-      @$container.find('tbody tr').removeClass 'selected'
+    @$container.find('tbody tr').toggleClass 'selected', super
 
   _didClickCell: (cell) ->
     $(cell).parent('tr').find(':checkbox').click()

From 603502d439697121966110d3f4f221549e3c9977 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 9 Apr 2015 21:40:43 -0400
Subject: [PATCH 086/170] Remove unnecessary block and use correct tag method

---
 lib/active_admin/form_builder.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/active_admin/form_builder.rb b/lib/active_admin/form_builder.rb
index 7b1e33b626d..a69b8abe5ea 100644
--- a/lib/active_admin/form_builder.rb
+++ b/lib/active_admin/form_builder.rb
@@ -97,7 +97,7 @@ def has_many_actions(has_many_form, builder_options, contents)
       if builder_options[:sortable]
         has_many_form.input builder_options[:sortable], as: :hidden
 
-        contents << template.content_tag(:li, class: 'handle') { }
+        contents << template.tag(:li, class: 'handle')
       end
 
       contents

From 210d68ff3f8e12329abad3b79258d52e47546334 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 9 Apr 2015 23:59:35 -0400
Subject: [PATCH 087/170] Clean up date picker and title bar styles
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

If we apply a larger font size to date picker the table cells break the
layout and the table doesn’t align with header. Made a mistake by
adding horizontal padding since we already set link to display: block;
which will expand the link to fit the cell for greater hit area.
---
 .../active_admin/components/_date_picker.scss          | 10 +++++-----
 .../stylesheets/active_admin/structure/_title_bar.scss |  4 +---
 2 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index d30defb9348..1e4c3f02e6e 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -10,7 +10,6 @@
 }
 
 .ui-datepicker-title {
-  display: block;
   font-weight: bold;
   text-align: center;
 }
@@ -93,11 +92,10 @@
 
       a {
         border-radius: 0.25em;
-        color: #666;
+        color: #555;
         display: block;
         font-size: 0.9em;
-        font-weight: bold;
-        padding: 4px;
+        padding: 4px 0;
 
         &:hover {
           background-color: #eceef0;
@@ -109,8 +107,10 @@
           color: #fff;
         }
 
-        &.ui-state-highlight { // today's date
+        &.ui-state-highlight,
+        &.ui-state-highlight:hover { // today's date
           background-color: #dbdddf;
+          color: #666;
         }
       }
     }
diff --git a/app/assets/stylesheets/active_admin/structure/_title_bar.scss b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
index 8b2cc717857..b799adb66c3 100644
--- a/app/assets/stylesheets/active_admin/structure/_title_bar.scss
+++ b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
@@ -2,12 +2,11 @@
   background-color: #eaebec;
   color: $section-header-text-color;
   display: table;
-  font-size: 1em;
   padding: 10px $horizontal-page-margin;
   width: 100%;
 
   h2 {
-    font-size: 2.2em;
+    font-size: 2em;
     margin: 0;
   }
 
@@ -22,7 +21,6 @@
 #titlebar_left,
 #titlebar_right {
   display: table-cell;
-  height: 50px; // acts as minimum height
   vertical-align: middle;
 }
 

From 40680f78f8d89475be2d52e73299a22a28e74f7c Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 10 Apr 2015 00:02:26 -0400
Subject: [PATCH 088/170] Change .header to .main-navbar and add .utility-nav

Also remove unused .header-item for now.
---
 app/assets/stylesheets/active_admin/_header.scss | 12 ++++++------
 lib/active_admin/views/header.rb                 |  7 +++----
 2 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index 720368c669a..a69da38cc04 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -1,4 +1,4 @@
-.header {
+.main-navbar {
   background-color: lighten($primary-color, 5%);
   display: table;
   padding: 5px $horizontal-page-margin;
@@ -109,10 +109,10 @@
       }
     }
   }
-}
 
-#utility_nav {
-  padding: 0;
-  text-align: right;
-  white-space: nowrap;
+  .utility-nav {
+    padding: 0;
+    text-align: right;
+    white-space: nowrap;
+  }
 }
diff --git a/lib/active_admin/views/header.rb b/lib/active_admin/views/header.rb
index 73786003b3a..d9b9332565c 100644
--- a/lib/active_admin/views/header.rb
+++ b/lib/active_admin/views/header.rb
@@ -3,7 +3,7 @@ module Views
     class Header < Component
 
       def build(namespace, menu)
-        super(id: "header")
+        super(id: "header", class: 'main-navbar')
 
         @namespace = namespace
         @menu = menu
@@ -14,17 +14,16 @@ def build(namespace, menu)
         build_utility_navigation
       end
 
-
       def build_site_title
         insert_tag view_factory.site_title, @namespace
       end
 
       def build_global_navigation
-        insert_tag view_factory.global_navigation, @menu, class: 'header-item tabs'
+        insert_tag view_factory.global_navigation, @menu, class: 'tabs'
       end
 
       def build_utility_navigation
-        insert_tag view_factory.utility_navigation, @utility_menu, id: "utility_nav", class: 'header-item tabs'
+        insert_tag view_factory.utility_navigation, @utility_menu, id: "utility_nav", class: 'utility-nav tabs'
       end
 
     end

From 30058f501fb05d5b67be127a61bbfa1fc2acde2d Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 10 Apr 2015 00:04:05 -0400
Subject: [PATCH 089/170] Change main nav items to full height of navbar
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This looks and feels much better now. The sub nav links are now set to
display: block; so the rollover area is the full width, it wasn’t
before. Added some comments on arrow calculations so I know what to do
when adding variables.
---
 .../stylesheets/active_admin/_header.scss     | 38 ++++++++-----------
 1 file changed, 16 insertions(+), 22 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index a69da38cc04..b529f830f1f 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -1,7 +1,7 @@
 .main-navbar {
   background-color: lighten($primary-color, 5%);
   display: table;
-  padding: 5px $horizontal-page-margin;
+  padding: 0 $horizontal-page-margin;
   width: 100%;
 
   a, a:link, a:visited {
@@ -24,11 +24,6 @@
     color:  $page-header-text-color;
     font-size: 1.3em;
     font-weight: normal;
-    padding: 0;
-
-    a:hover {
-      color: #fff;
-    }
   }
 
   .tabs {
@@ -41,47 +36,41 @@
       display: inline-block;
       position: relative;
 
-      & + li {
-        margin-left: 5px;
-      }
-
       a {
-        border-radius: 4px;
         display: inline-block;
-        padding: 5px 10px;
+        padding: 10px;
         position: relative;
       }
 
       &.current > a {
-        background: $current-menu-item-background;
+        background-color: $current-menu-item-background;
         color: #fff;
       }
 
       &.has_nested > a,
       &.has_nested.current > a,
       &.has_nested:hover > a {
-        padding-right: 22px;
+        padding-right: 8px + 10px + 4px; // arrow width + link right padding + little spacing
 
         &:after {
-          border-left: 4px solid transparent;
+          border-left: 4px solid transparent; // arrow width is 8px
           border-right: 4px solid transparent;
-          border-top: 4px dashed;
+          border-top: 4px dashed; // arrow height is 4px
           content: '';
           height: 0;
           position: absolute;
           right: 10px;
-          top: 45%;
+          top: calc(50% - 2px); // half of arrow height
           width: 0;
         }
       }
 
       &:hover > a {
-        background: $hover-menu-item-background;
+        background-color: $hover-menu-item-background;
         color: #fff;
       }
 
       &.has_nested:hover > a {
-        border-radius: 4px 4px 0 0;
         z-index: 960; // so top part of sub menu box-shadow doesn't appear over this link
       }
 
@@ -90,9 +79,8 @@
       }
 
       ul {
-        background: $hover-menu-item-background;
-        border-radius: 0 4px 4px 4px;
-        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.175);
+        background-color: lighten($primary-color, 5%);
+        border-radius: 0 0 4px 4px;
         display: none;
         list-style: none;
         min-width: 175px;
@@ -101,8 +89,14 @@
         z-index: 950;
 
         li {
+          a {
+            display: block;
+            padding: 5px 10px;
+          }
+
           &.current a,
           a:hover {
+            background-color: $hover-menu-item-background;
             color: #fff;
           }
         }

From f351a6c332c25acfaaa8ac952914b808c32b497b Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 10 Apr 2015 00:43:40 -0400
Subject: [PATCH 090/170] New sass variables for base, flash msg, and buttons
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This is a good first start. Started with setting the global base
variables we’ll use across the app. Using Bootstrap/Foundation as
inspiration for naming and what to configure. With this change I
increased the base font size to 13px which feels a lot better now.
Button variables only are for size, haven’t done colors yet.
---
 .../stylesheets/active_admin/_base.scss       |  6 +-
 .../components/_flash_messages.scss           | 17 +++---
 .../active_admin/mixins/_buttons.scss         | 20 +++----
 .../active_admin/mixins/_variables.scss       | 60 ++++++++++++++++++-
 4 files changed, 77 insertions(+), 26 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_base.scss b/app/assets/stylesheets/active_admin/_base.scss
index 101a4c6761e..f0617caa9e2 100644
--- a/app/assets/stylesheets/active_admin/_base.scss
+++ b/app/assets/stylesheets/active_admin/_base.scss
@@ -38,7 +38,7 @@
 body {
   background: $body-background-color;
   color: $text-color;
-  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
-  font-size: 72%;
-  line-height: 1.5;
+  font-family: $font-family-base;
+  font-size: $font-size-base;
+  line-height: $line-height-base;
 }
diff --git a/app/assets/stylesheets/active_admin/components/_flash_messages.scss b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
index 252857cbf1f..ccdfe58ef82 100644
--- a/app/assets/stylesheets/active_admin/components/_flash_messages.scss
+++ b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
@@ -1,17 +1,16 @@
 .flash {
-  background-color: #f7f1d3;
-  color: #cb9810;
-  font-size: 1.1em;
-  font-weight: bold;
-  padding: 12px $horizontal-page-margin;
+  background-color: $flash-message-default-background-color;
+  color: $flash-message-default-text-color;
+  font-weight: $flash-message-font-weight;
+  padding: $flash-message-padding;
 
   &.flash_notice {
-    background-color: #ccdfcd;
-    color: #416347;
+    background-color: $flash-message-notice-background-color;
+    color: $flash-message-notice-text-color;
   }
 
   &.flash_error {
-    background-color: #f1dcdc;
-    color: #b33c33;
+    background-color: $flash-message-error-background-color;
+    color: $flash-message-error-text-color;
   }
 }
diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index 0fa30c169ba..cb561170f61 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -3,10 +3,10 @@
   border-radius: 0.25em;
   cursor: pointer;
   display: inline-block;
-  font-size: 1.0em;
-  font-weight: bold;
-  line-height: 1.5; // needed for input/button elements to match a.button size
-  padding: 6px 10px;
+  font-size: $font-size-base;
+  font-weight: $button-font-weight;
+  line-height: $line-height-base; // needed for input/button elements to match a.button size
+  padding: $padding-base-vertical $padding-base-horizontal;
   text-decoration: none;
   transition: background-color .2s, border-color .2s, color .2s;
 
@@ -20,6 +20,7 @@
     outline: 0;
   }
 
+  &[disabled],
   &.disabled {
     cursor: not-allowed;
     opacity: 0.5;
@@ -28,22 +29,18 @@
 
 @mixin default-button {
   @include basic-button;
-//   @include gradient(lighten($primary-color, 15%), darken($primary-color, 12%));
-// $primary-color: #3498DB;
   background-color: $primary-color;
   border: 1px solid darken($primary-color, 5%);
   color: #fff;
 
   &:not(.disabled) {
     &:hover{
-//       @include gradient(lighten($primary-color, 18%), darken($primary-color, 9%));
       background-color: darken($primary-color, 10%);
       border-color: darken($primary-color, 15%);
     }
 
     &:active {
-//       @include gradient(lighten($primary-color, 8%), darken($primary-color, 17%));
-      box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
+      box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
     }
   }
 
@@ -55,21 +52,18 @@
 
 @mixin light-button {
   @include basic-button;
-//   @include gradient(#FFFFFF, #E7E7E7);
   background-color: #fff;
   border: 1px solid #d9d9d9;
   color: $primary-color;
 
   &:not(.disabled) {
     &:hover {
-//       @include gradient(#FFFFFF, #F1F1F1);
       background-color: darken(#fff, 10%);
       border-color: darken(#d9d9d9, 12%);
     }
 
     &:active {
-//       @include gradient(#F3F3F3, #D8D8D8);
-      box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
+      box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
     }
   }
 }
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 49c87e55e49..d4b5d9d9a1d 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -30,5 +30,63 @@ $cell-horizontal-padding: 12px !default;
 $section-padding: 15px !default;
 $text-input-horizontal-padding: 8px !default;
 $text-input-total-padding: $text-input-horizontal-padding * 2 + $border-width * 2;
-
 $blank-slate-border: 1px dashed #DADADA !default;
+
+
+
+// NEW VARIABLES
+
+$font-family-sans-serif: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
+$font-family-serif: Georgia, Cambria, "Times New Roman", Times, serif;
+$font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace;
+$font-family-base: $font-family-sans-serif;
+
+$font-weight-normal: normal;
+$font-weight-semibold: normal;
+$font-weight-bold: bold;
+
+$font-size-base: 13px;
+
+$line-height-base: 1.5;
+
+$text-color: #323537;
+
+$body-background-color: #fff;
+$body-font-size: $font-size-base;
+$body-font-weight: $font-weight-normal;
+
+$border-radius-base: 0.25em;
+
+$primary-color: #5E6469;
+$secondary-color: #f0f0f0;
+
+$padding-base-vertical: 6px;
+$padding-base-horizontal: 10px;
+
+// Start off with
+//
+// TODO: zindex-
+//      flash-message-default- flash-message-notice- flash-message-error-
+// ...
+
+//== z-indexes
+
+
+
+//== Buttons
+
+$button-font-weight: $font-weight-bold;
+
+//== Flash Messages
+
+$flash-message-font-weight: bold;
+$flash-message-padding: 12px $horizontal-page-margin;
+
+$flash-message-default-background-color: #f7f1d3;
+$flash-message-default-text-color: #cb9810;
+
+$flash-message-notice-background-color: #ccdfcd;
+$flash-message-notice-text-color: #416347;
+
+$flash-message-error-background-color: #f1dcdc;
+$flash-message-error-text-color: #b33c33;

From c79246c0f18ad642779a149e4e3bf6cd70b13c0a Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 14 Apr 2015 21:46:41 -0400
Subject: [PATCH 091/170] Configure panel styles and adjust class names
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

We prefer to keep element class names specific so we have simple
selectors. Update specs to account for changes. Remove sections mixin.
We might bring it back for some methods but ideally we’d like to style
forms using panels separately from form HTML although that could be
significant work.
---
 .../stylesheets/active_admin/_forms.scss      |  8 +++--
 .../components/_modal_dialog.scss             |  7 +++--
 .../active_admin/components/_panels.scss      | 29 ++++++++++++++---
 .../active_admin/components/_tables.scss      |  3 +-
 .../stylesheets/active_admin/mixins/_all.scss |  1 -
 .../active_admin/mixins/_sections.scss        | 31 -------------------
 .../active_admin/mixins/_variables.scss       | 12 +++++--
 lib/active_admin/views/components/panel.rb    | 14 ++++++---
 spec/unit/views/components/panel_spec.rb      |  6 ++--
 .../views/components/sidebar_section_spec.rb  | 19 ++++++------
 10 files changed, 68 insertions(+), 62 deletions(-)
 delete mode 100644 app/assets/stylesheets/active_admin/mixins/_sections.scss

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index a6609de3b8a..9442f4dceca 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -48,7 +48,8 @@ textarea {
   }
 
   .inputs {
-    @include section-background;
+    background-color: $panel-background-color;
+    border-radius: $panel-border-radius;
 
     > ol {
       padding: 15px;
@@ -65,8 +66,11 @@ textarea {
       width: 100%;
 
       span {
+        background-color: $panel-heading-background-color;
+        border-radius: $panel-border-radius $panel-border-radius 0 0;
         display: block;
-        @include section-header;
+        font-weight: $font-weight-bold;
+        padding: $panel-heading-padding;
       }
     }
 
diff --git a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
index a7156d09314..4168f341ccb 100644
--- a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
+++ b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
@@ -9,7 +9,8 @@
 }
 
 .ui-dialog {
-  @include section-background;
+  background-color: #fff;
+  border-radius: 0.25em;
   box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
   outline: none;
   position: fixed;
@@ -32,7 +33,9 @@
 }
 
 .ui-dialog-titlebar {
-  @include section-header;
+  border-bottom: 1px solid #eee;
+  font-weight: $font-weight-bold;
+  padding: 10px 15px;
 }
 
 .ui-dialog-titlebar-close {
diff --git a/app/assets/stylesheets/active_admin/components/_panels.scss b/app/assets/stylesheets/active_admin/components/_panels.scss
index d358d8773b8..ba65d8c0972 100644
--- a/app/assets/stylesheets/active_admin/components/_panels.scss
+++ b/app/assets/stylesheets/active_admin/components/_panels.scss
@@ -1,6 +1,25 @@
-// ----------------------------------- Helper class to apply to elements to make them sections
-.section,
-.panel,
-.sidebar_section {
-  @include section;
+.panel {
+  background-color: $panel-background-color;
+  border-radius: $panel-border-radius;
+  margin-bottom: 20px;
+}
+
+.panel-body {
+  padding: $panel-body-padding;
+}
+
+.panel-heading {
+  background-color: $panel-heading-background-color;
+  border-radius: $panel-border-radius $panel-border-radius 0 0;
+  font-weight: $font-weight-bold;
+  padding: $panel-heading-padding;
+}
+
+.panel-title {
+  font-size: $font-size-base;
+  margin: 0;
+}
+
+.panel-heading-actions {
+  float: right;
 }
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 8aa4d25496c..d881a067c4e 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -24,7 +24,7 @@ thead {
 table.index_table {
   th {
     a, a:link, a:visited {
-      color: $section-header-text-color;
+      color: $text-color;
       display: block;
       position: relative;
       text-decoration: none;
@@ -98,7 +98,6 @@ table.index_table {
   }
 
   th {
-    color: $primary-color;
     width: 150px;
   }
 
diff --git a/app/assets/stylesheets/active_admin/mixins/_all.scss b/app/assets/stylesheets/active_admin/mixins/_all.scss
index 15e652a3f28..ccb920b7d4b 100644
--- a/app/assets/stylesheets/active_admin/mixins/_all.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_all.scss
@@ -1,5 +1,4 @@
 @import "active_admin/mixins/variables";
 @import "active_admin/mixins/buttons";
-@import "active_admin/mixins/sections";
 @import "active_admin/mixins/utilities";
 @import "bourbon";
diff --git a/app/assets/stylesheets/active_admin/mixins/_sections.scss b/app/assets/stylesheets/active_admin/mixins/_sections.scss
deleted file mode 100644
index 08453a4184c..00000000000
--- a/app/assets/stylesheets/active_admin/mixins/_sections.scss
+++ /dev/null
@@ -1,31 +0,0 @@
-@mixin section-header {
-  background-color: #e6e6e6;
-  border-radius: 4px 4px 0 0;
-  font-size: 1em;
-  font-weight: bold;
-  color: $section-header-text-color;
-  margin: 0;
-  padding: 10px 15px;
-}
-
-@mixin section-background {
-  background-color: #f8f8f8;
-  border-radius: 4px;
-}
-
-@mixin section {
-  @include section-background;
-  margin-bottom: 20px;
-
-  > h3 {
-    @include section-header;
-
-    .header_action {
-      float: right;
-    }
-  }
-
-  > div {
-    padding: $section-padding;
-  }
-}
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index d4b5d9d9a1d..a773eeef5a9 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -8,7 +8,7 @@ $primary-color: #5E6469 !default;
 $secondary-color: #f0f0f0 !default;
 $text-color: #323537 !default;
 $link-color: #38678b !default;
-$section-header-text-color: $primary-color !default;
+$section-header-text-color: $primary-color !default; // REMOVED
 $current-menu-item-background: lighten($primary-color, 12%) !default;
 $hover-menu-item-background: lighten($primary-color, 12%) !default;
 $table-stripe-color: #f8f8f8 !default;
@@ -27,7 +27,7 @@ $horizontal-page-margin: 20px !default;
 $sidebar-width: 270px !default;
 $cell-padding: 5px 10px 3px 10px !default;
 $cell-horizontal-padding: 12px !default;
-$section-padding: 15px !default;
+$section-padding: 15px !default;      // $panel-body-padding
 $text-input-horizontal-padding: 8px !default;
 $text-input-total-padding: $text-input-horizontal-padding * 2 + $border-width * 2;
 $blank-slate-border: 1px dashed #DADADA !default;
@@ -90,3 +90,11 @@ $flash-message-notice-text-color: #416347;
 
 $flash-message-error-background-color: #f1dcdc;
 $flash-message-error-text-color: #b33c33;
+
+//== Panels
+
+$panel-background-color: #f8f8f8;
+$panel-body-padding: 15px;
+$panel-heading-background-color: #e6e6e6;
+$panel-heading-padding: 10px 15px;
+$panel-border-radius: $border-radius-base;
diff --git a/lib/active_admin/views/components/panel.rb b/lib/active_admin/views/components/panel.rb
index ccba21d43d9..b0f5cd1610c 100644
--- a/lib/active_admin/views/components/panel.rb
+++ b/lib/active_admin/views/components/panel.rb
@@ -6,9 +6,15 @@ class Panel < ActiveAdmin::Component
 
       def build(title, attributes = {})
         super(attributes)
+
         add_class "panel"
-        @title = h3(title.to_s)
-        @contents = div(class: "panel_contents")
+
+        @title = div(class: "panel-heading") do
+          @actions = div(class: 'panel-heading-actions')
+          h3(title.to_s, class: 'panel-title')
+        end
+
+        @contents = div(class: "panel-body")
       end
 
       def add_child(child)
@@ -29,9 +35,7 @@ def children?
       def header_action(*args)
         action = args[0]
 
-        @title << div(class: 'header_action') do
-          action
-        end
+        @actions << action
       end
     end
   end
diff --git a/spec/unit/views/components/panel_spec.rb b/spec/unit/views/components/panel_spec.rb
index a33fc5cb749..79de16c8d96 100644
--- a/spec/unit/views/components/panel_spec.rb
+++ b/spec/unit/views/components/panel_spec.rb
@@ -17,17 +17,17 @@
   end
 
   it "should add panel actions to the panel header" do
-    link = panel_html.find('h3 > div.header_action a')
+    link = panel_html.find('div.panel-heading-actions a')
     expect(link.text).to eq('My Link')
     expect(link[:href]).to eq("https://www.github.com/activeadmin/activeadmin")
   end
 
   it "should have a contents div" do
-    expect(panel_html).to have_css 'div.panel_contents'
+    expect(panel_html).to have_css 'div.panel-body'
   end
 
   it "should add children to the contents div" do
-    expect(panel_html).to have_css 'div.panel_contents > span', text: "Hello World"
+    expect(panel_html).to have_css 'div.panel-body > span', text: "Hello World"
   end
 
   context "with html-safe title" do
diff --git a/spec/unit/views/components/sidebar_section_spec.rb b/spec/unit/views/components/sidebar_section_spec.rb
index 1f7a84ef2b9..655e7b44f86 100644
--- a/spec/unit/views/components/sidebar_section_spec.rb
+++ b/spec/unit/views/components/sidebar_section_spec.rb
@@ -11,36 +11,37 @@
   end
 
   let(:html) do
-    render_arbre_component section: section do
+    result = render_arbre_component section: section do
       sidebar_section(assigns[:section])
     end
+    Capybara.string(result.to_s)
   end
 
   it "should have a title h3" do
-    expect(html.find_by_tag("h3").first.content).to eq "Help Section"
+    expect(html).to have_css '.panel-title', text: 'Help Section'
   end
 
   it "should have the class of 'sidebar_section'" do
-    expect(html.class_list).to include("sidebar_section")
+    expect(html).to have_css ".sidebar_section"
   end
 
   it "should have an id based on the title" do
-    expect(html.id).to eq "help-section_sidebar_section"
+    expect(html).to have_css "#help-section_sidebar_section"
   end
 
-  it "should have a contents div" do
-    expect(html.find_by_tag("div").first.class_list).to include("panel_contents")
+  it "should have a panel body" do
+    expect(html).to have_css '.panel-body'
   end
 
-  it "should add children to the contents div" do
-    expect(html.find_by_tag("span").first.parent).to eq html.find_by_tag("div").first
+  it "should add children to the panel body" do
+    expect(html).to have_css '.panel-body > span'
   end
 
   context 'with a custom class attribute' do
     let(:options) { { class: 'custom_class' } }
 
     it "should have 'custom_class' class" do
-      expect(html.class_list).to include("custom_class")
+      expect(html).to have_css ".custom_class"
     end
   end
 

From 9c70c5e07ae2396ae132cb07714e68e3b49669cc Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 14 Apr 2015 22:16:07 -0400
Subject: [PATCH 092/170] Configure breadcrumb, headers and tables styles

---
 .../stylesheets/active_admin/_forms.scss      |  1 -
 .../stylesheets/active_admin/_typography.scss |  6 ++--
 .../active_admin/components/_breadcrumbs.scss |  8 ++---
 .../active_admin/components/_tables.scss      |  2 +-
 .../active_admin/mixins/_variables.scss       | 36 ++++++++++++-------
 5 files changed, 32 insertions(+), 21 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 9442f4dceca..85f85ba15d0 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -34,7 +34,6 @@ textarea {
   }
 
   .label {
-    color: $form-label-color;
     display: block;
     float: left;
     font-weight: bold;
diff --git a/app/assets/stylesheets/active_admin/_typography.scss b/app/assets/stylesheets/active_admin/_typography.scss
index 886d452ced3..5272fd27137 100644
--- a/app/assets/stylesheets/active_admin/_typography.scss
+++ b/app/assets/stylesheets/active_admin/_typography.scss
@@ -1,5 +1,7 @@
 h1, h2, h3, h4, h5, h6 {
-  color: $primary-color;
+  color: $header-color;
+  font-family: $header-font-family;
+  font-weight: $header-font-weight;
 }
 
 h1 {
@@ -41,7 +43,7 @@ pre {
 
 pre,
 code {
-  font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
+  font-family: $font-family-monospace;
 }
 
 ul, ol {
diff --git a/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss b/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss
index 684edb2ab87..847a9964d08 100644
--- a/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss
+++ b/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss
@@ -8,14 +8,14 @@
     display: inline-block;
 
     & + li:before {
-      color: $breadcrumbs-separator-color;
-      content: "/";
-      padding: 0 6px 0 2px;
+      color: $breadcrumb-separator-color;
+      content: "#{$breadcrumb-separator}\00a0"; // Unicode space added since inline-block means non-collapsing white-space
+      padding: 0 5px;
     }
   }
 
   a,
   a:hover {
-    color: $breadcrumbs-color;
+    color: $breadcrumb-color;
   }
 }
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index d881a067c4e..6cfac62bca0 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -9,7 +9,7 @@ th {
 
 th, td {
   border-bottom: 1px solid #e8e8e8;
-  padding: 8px;
+  padding: $table-cell-padding;
   vertical-align: top;
 }
 
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index a773eeef5a9..86cfa5b1d32 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -15,19 +15,19 @@ $table-stripe-color: #f8f8f8 !default;
 $table-selected-color: #fcf8e3 !default;
 $error-color: #932419 !default;
 $blank-slate-primary-color: #AAA !default;
-$breadcrumbs-color: #8a949e !default;
-$breadcrumbs-separator-color: #aab2ba !default;
+$breadcrumbs-color: #8a949e !default;           // renamed: $breadcrumb-color
+$breadcrumbs-separator-color: #aab2ba !default; // renamed: $breadcrumb-separator-color
 $required-field-marker-color: #aaa !default;
-$form-label-color: $section-header-text-color !default;
+$form-label-color: $section-header-text-color !default; // REMOVED
 $page-header-text-color: #cdcdcd !default;
 
 // Sizes
 $border-width: 1px !default;
 $horizontal-page-margin: 20px !default;
 $sidebar-width: 270px !default;
-$cell-padding: 5px 10px 3px 10px !default;
-$cell-horizontal-padding: 12px !default;
-$section-padding: 15px !default;      // $panel-body-padding
+$cell-padding: 5px 10px 3px 10px !default;    // renamed: $table-cell-padding
+$cell-horizontal-padding: 12px !default;      // REMOVED
+$section-padding: 15px !default;              // renamed: $panel-body-padding
 $text-input-horizontal-padding: 8px !default;
 $text-input-total-padding: $text-input-horizontal-padding * 2 + $border-width * 2;
 $blank-slate-border: 1px dashed #DADADA !default;
@@ -55,20 +55,20 @@ $body-background-color: #fff;
 $body-font-size: $font-size-base;
 $body-font-weight: $font-weight-normal;
 
-$border-radius-base: 0.25em;
+$header-font-family: inherit;
+$header-font-weight: inherit;
+$header-color: inherit;
+
+//== Components
 
 $primary-color: #5E6469;
 $secondary-color: #f0f0f0;
 
+$border-radius-base: 0.25em;
+
 $padding-base-vertical: 6px;
 $padding-base-horizontal: 10px;
 
-// Start off with
-//
-// TODO: zindex-
-//      flash-message-default- flash-message-notice- flash-message-error-
-// ...
-
 //== z-indexes
 
 
@@ -77,6 +77,16 @@ $padding-base-horizontal: 10px;
 
 $button-font-weight: $font-weight-bold;
 
+//== Tables
+
+$table-cell-padding: 8px;
+
+//== Breadcrumbs
+
+$breadcrumb-color: #8a949e;
+$breadcrumb-separator-color: #aab2ba;
+$breadcrumb-separator: "/";
+
 //== Flash Messages
 
 $flash-message-font-weight: bold;

From 0f729b023a3d296d9bd17d4bb95717463375dba2 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 15 Apr 2015 17:39:59 -0400
Subject: [PATCH 093/170] Import variables since we import typography which
 uses vars

This is safe since any variables defined after will override existing
values.
---
 app/assets/stylesheets/active_admin/print.scss | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/app/assets/stylesheets/active_admin/print.scss b/app/assets/stylesheets/active_admin/print.scss
index 91209eb5419..fa549e7a555 100644
--- a/app/assets/stylesheets/active_admin/print.scss
+++ b/app/assets/stylesheets/active_admin/print.scss
@@ -1,5 +1,7 @@
 /* Active Admin Print Stylesheet */
 
+@import "active_admin/mixins/variables";
+
 // Set colors used elsewhere
 $primary-color: black;
 $text-color: black;

From 6b24c3cd231c27ae22268edada5887917fe057c6 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 16 Apr 2015 13:42:22 -0400
Subject: [PATCH 094/170] Mark new variables with !default

---
 .../active_admin/mixins/_variables.scss       | 80 +++++++++----------
 1 file changed, 40 insertions(+), 40 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 86cfa5b1d32..24dccb11c45 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -29,45 +29,45 @@ $cell-padding: 5px 10px 3px 10px !default;    // renamed: $table-cell-padding
 $cell-horizontal-padding: 12px !default;      // REMOVED
 $section-padding: 15px !default;              // renamed: $panel-body-padding
 $text-input-horizontal-padding: 8px !default;
-$text-input-total-padding: $text-input-horizontal-padding * 2 + $border-width * 2;
+$text-input-total-padding: $text-input-horizontal-padding * 2 + $border-width * 2 !default;
 $blank-slate-border: 1px dashed #DADADA !default;
 
 
 
 // NEW VARIABLES
 
-$font-family-sans-serif: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
-$font-family-serif: Georgia, Cambria, "Times New Roman", Times, serif;
-$font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace;
-$font-family-base: $font-family-sans-serif;
+$font-family-sans-serif: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif !default;
+$font-family-serif: Georgia, Cambria, "Times New Roman", Times, serif !default;
+$font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace !default;
+$font-family-base: $font-family-sans-serif !default;
 
-$font-weight-normal: normal;
-$font-weight-semibold: normal;
-$font-weight-bold: bold;
+$font-weight-normal: normal !default;
+$font-weight-semibold: normal !default;
+$font-weight-bold: bold !default;
 
-$font-size-base: 13px;
+$font-size-base: 13px !default;
 
-$line-height-base: 1.5;
+$line-height-base: 1.5 !default;
 
-$text-color: #323537;
+$text-color: #323537 !default;
 
-$body-background-color: #fff;
-$body-font-size: $font-size-base;
-$body-font-weight: $font-weight-normal;
+$body-background-color: #fff !default;
+$body-font-size: $font-size-base !default;
+$body-font-weight: $font-weight-normal !default;
 
-$header-font-family: inherit;
-$header-font-weight: inherit;
-$header-color: inherit;
+$header-font-family: inherit !default;
+$header-font-weight: inherit !default;
+$header-color: inherit !default;
 
 //== Components
 
-$primary-color: #5E6469;
-$secondary-color: #f0f0f0;
+$primary-color: #5E6469 !default;
+$secondary-color: #f0f0f0 !default;
 
-$border-radius-base: 0.25em;
+$border-radius-base: 0.25em !default;
 
-$padding-base-vertical: 6px;
-$padding-base-horizontal: 10px;
+$padding-base-vertical: 6px !default;
+$padding-base-horizontal: 10px !default;
 
 //== z-indexes
 
@@ -75,36 +75,36 @@ $padding-base-horizontal: 10px;
 
 //== Buttons
 
-$button-font-weight: $font-weight-bold;
+$button-font-weight: $font-weight-bold !default;
 
 //== Tables
 
-$table-cell-padding: 8px;
+$table-cell-padding: 8px !default;
 
 //== Breadcrumbs
 
-$breadcrumb-color: #8a949e;
-$breadcrumb-separator-color: #aab2ba;
-$breadcrumb-separator: "/";
+$breadcrumb-color: #8a949e !default;
+$breadcrumb-separator-color: #aab2ba !default;
+$breadcrumb-separator: "/" !default;
 
 //== Flash Messages
 
-$flash-message-font-weight: bold;
-$flash-message-padding: 12px $horizontal-page-margin;
+$flash-message-font-weight: bold !default;
+$flash-message-padding: 12px $horizontal-page-margin !default;
 
-$flash-message-default-background-color: #f7f1d3;
-$flash-message-default-text-color: #cb9810;
+$flash-message-default-background-color: #f7f1d3 !default;
+$flash-message-default-text-color: #cb9810 !default;
 
-$flash-message-notice-background-color: #ccdfcd;
-$flash-message-notice-text-color: #416347;
+$flash-message-notice-background-color: #ccdfcd !default;
+$flash-message-notice-text-color: #416347 !default;
 
-$flash-message-error-background-color: #f1dcdc;
-$flash-message-error-text-color: #b33c33;
+$flash-message-error-background-color: #f1dcdc !default;
+$flash-message-error-text-color: #b33c33 !default;
 
 //== Panels
 
-$panel-background-color: #f8f8f8;
-$panel-body-padding: 15px;
-$panel-heading-background-color: #e6e6e6;
-$panel-heading-padding: 10px 15px;
-$panel-border-radius: $border-radius-base;
+$panel-background-color: #f8f8f8 !default;
+$panel-body-padding: 15px !default;
+$panel-heading-background-color: #e6e6e6 !default;
+$panel-heading-padding: 10px 15px !default;
+$panel-border-radius: $border-radius-base !default;

From d444d408522f64bf4792a795eacf4e0b054eba71 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 16 Apr 2015 13:43:33 -0400
Subject: [PATCH 095/170] Use numeric values for font-weight

Best to use these values over keywords since it works best with both
system and imported fonts.
---
 app/assets/stylesheets/active_admin/mixins/_variables.scss | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 24dccb11c45..0dbcf1b03b7 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -41,9 +41,9 @@ $font-family-serif: Georgia, Cambria, "Times New Roman", Times, serif !default;
 $font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace !default;
 $font-family-base: $font-family-sans-serif !default;
 
-$font-weight-normal: normal !default;
-$font-weight-semibold: normal !default;
-$font-weight-bold: bold !default;
+$font-weight-normal: 400 !default;
+$font-weight-semibold: 400 !default;
+$font-weight-bold: 700 !default;
 
 $font-size-base: 13px !default;
 

From 604c3a4801ee40834b72f3f4e8d56f9086334d4b Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 16 Apr 2015 18:10:23 -0400
Subject: [PATCH 096/170] Use primary color for datepicker border to match
 header

---
 .../stylesheets/active_admin/components/_date_picker.scss       | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index 1e4c3f02e6e..97c254245e9 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -68,7 +68,7 @@
 
 .ui-datepicker-calendar {
   background-color: #f4f4f4;
-  border: solid 1px #63686e;
+  border: 1px solid lighten($primary-color, 5%);
   border-width: 0 1px 1px 1px;
   margin-bottom: 0;
 

From 561514e835b8ccf2b763f7d8fe70c3246ca251c1 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 16 Apr 2015 18:13:26 -0400
Subject: [PATCH 097/170] Configure navbar styles

---
 .../stylesheets/active_admin/_header.scss     | 40 +++++++++----------
 .../active_admin/mixins/_variables.scss       | 22 +++++++++-
 2 files changed, 40 insertions(+), 22 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index b529f830f1f..4dad50ea536 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -1,16 +1,16 @@
 .main-navbar {
-  background-color: lighten($primary-color, 5%);
+  background-color: $navbar-background-color;
   display: table;
   padding: 0 $horizontal-page-margin;
   width: 100%;
 
   a, a:link, a:visited {
-    color: $page-header-text-color;
+    color: $navbar-link-color;
     text-decoration: none;
   }
 
   a:hover {
-    color: #fff;
+    color: $navbar-link-hover-color;
   }
 
   h1,
@@ -21,7 +21,7 @@
   }
 
   h1 {
-    color:  $page-header-text-color;
+    color: $navbar-color;
     font-size: 1.3em;
     font-weight: normal;
   }
@@ -38,36 +38,36 @@
 
       a {
         display: inline-block;
-        padding: 10px;
+        padding: $navbar-padding-vertical $navbar-padding-horizontal;
         position: relative;
       }
 
       &.current > a {
-        background-color: $current-menu-item-background;
-        color: #fff;
+        background-color: $navbar-link-active-background-color;
+        color: $navbar-link-active-color;
       }
 
       &.has_nested > a,
       &.has_nested.current > a,
       &.has_nested:hover > a {
-        padding-right: 8px + 10px + 4px; // arrow width + link right padding + little spacing
+        padding-right: $navbar-arrow-width + $navbar-padding-vertical + 4px;
 
         &:after {
-          border-left: 4px solid transparent; // arrow width is 8px
-          border-right: 4px solid transparent;
-          border-top: 4px dashed; // arrow height is 4px
+          border-left: ($navbar-arrow-width / 2) solid transparent;
+          border-right: ($navbar-arrow-width / 2) solid transparent;
+          border-top: $navbar-arrow-height dashed;
           content: '';
           height: 0;
           position: absolute;
-          right: 10px;
-          top: calc(50% - 2px); // half of arrow height
+          right: $navbar-padding-vertical;
+          top: calc(50% - #{$navbar-arrow-height / 2});
           width: 0;
         }
       }
 
       &:hover > a {
-        background-color: $hover-menu-item-background;
-        color: #fff;
+        background-color: $navbar-link-hover-background-color;
+        color: $navbar-link-hover-color;
       }
 
       &.has_nested:hover > a {
@@ -79,8 +79,8 @@
       }
 
       ul {
-        background-color: lighten($primary-color, 5%);
-        border-radius: 0 0 4px 4px;
+        background-color: $navbar-background-color;
+        border-radius: 0 0 $navbar-border-radius $navbar-border-radius;
         display: none;
         list-style: none;
         min-width: 175px;
@@ -91,13 +91,13 @@
         li {
           a {
             display: block;
-            padding: 5px 10px;
+            padding: ($navbar-padding-vertical / 2) $navbar-padding-horizontal;
           }
 
           &.current a,
           a:hover {
-            background-color: $hover-menu-item-background;
-            color: #fff;
+            background-color: $navbar-link-hover-background-color;
+            color: $navbar-link-hover-color;
           }
         }
       }
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 0dbcf1b03b7..b072526d483 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -9,8 +9,8 @@ $secondary-color: #f0f0f0 !default;
 $text-color: #323537 !default;
 $link-color: #38678b !default;
 $section-header-text-color: $primary-color !default; // REMOVED
-$current-menu-item-background: lighten($primary-color, 12%) !default;
-$hover-menu-item-background: lighten($primary-color, 12%) !default;
+$current-menu-item-background: lighten($primary-color, 12%) !default; // renamed: $navbar-link-active-background-color
+$hover-menu-item-background: lighten($primary-color, 12%) !default; // renamed: $navbar-link-hover-background-color
 $table-stripe-color: #f8f8f8 !default;
 $table-selected-color: #fcf8e3 !default;
 $error-color: #932419 !default;
@@ -101,6 +101,24 @@ $flash-message-notice-text-color: #416347 !default;
 $flash-message-error-background-color: #f1dcdc !default;
 $flash-message-error-text-color: #b33c33 !default;
 
+//== Navbar
+
+$navbar-border-radius: $border-radius-base;
+$navbar-padding-horizontal: 10px !default;
+$navbar-padding-vertical: 10px !default;
+
+$navbar-color: #fff;
+$navbar-background-color: lighten($primary-color, 5%);
+
+$navbar-link-color: #fff;
+$navbar-link-hover-color: #fff;
+$navbar-link-hover-background-color: lighten($primary-color, 12%) !default;
+$navbar-link-active-color: #fff;
+$navbar-link-active-background-color: lighten($primary-color, 12%) !default;
+
+$navbar-arrow-height: 4px !default;
+$navbar-arrow-width: 8px !default;
+
 //== Panels
 
 $panel-background-color: #f8f8f8 !default;

From 2757e43655b38190b9d2962aab8c542d936a1023 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 17 Apr 2015 17:24:50 -0400
Subject: [PATCH 098/170] Add slight transition on navbar links

---
 app/assets/stylesheets/active_admin/_header.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index 4dad50ea536..e80dff6f241 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -40,6 +40,7 @@
         display: inline-block;
         padding: $navbar-padding-vertical $navbar-padding-horizontal;
         position: relative;
+        transition: background-color .15s, color .15s;
       }
 
       &.current > a {

From aa727bba25cc07f8b6b5339b3ae5c67dd736960b Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 17 Apr 2015 17:39:39 -0400
Subject: [PATCH 099/170] Configure buttons and typography styles

Add !default on some variables that were missing it. Added new
$cursor-disabled variable.
---
 .../stylesheets/active_admin/_typography.scss |  4 +--
 .../active_admin/mixins/_buttons.scss         | 27 ++++++++---------
 .../active_admin/mixins/_variables.scss       | 29 +++++++++++++++----
 3 files changed, 39 insertions(+), 21 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_typography.scss b/app/assets/stylesheets/active_admin/_typography.scss
index 5272fd27137..e4665561345 100644
--- a/app/assets/stylesheets/active_admin/_typography.scss
+++ b/app/assets/stylesheets/active_admin/_typography.scss
@@ -33,7 +33,7 @@ p {
 }
 
 blockquote  {
-  color: #888;
+  color: $blockquote-color;
   margin: 1.5em;
 }
 
@@ -58,5 +58,5 @@ li ol {
 
 hr {
   border: none;
-  border-bottom: 1px solid #E8E8E8;
+  border-bottom: 1px solid $hr-border-color;
 }
diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index cb561170f61..2e65297d403 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -1,6 +1,6 @@
 @mixin basic-button {
   border: 1px solid transparent;
-  border-radius: 0.25em;
+  border-radius: $border-radius-base;
   cursor: pointer;
   display: inline-block;
   font-size: $font-size-base;
@@ -9,6 +9,7 @@
   padding: $padding-base-vertical $padding-base-horizontal;
   text-decoration: none;
   transition: background-color .2s, border-color .2s, color .2s;
+  white-space: nowrap;
 
   &:hover,
   &:focus {
@@ -22,21 +23,21 @@
 
   &[disabled],
   &.disabled {
-    cursor: not-allowed;
+    cursor: $cursor-disabled;
     opacity: 0.5;
   }
 }
 
 @mixin default-button {
   @include basic-button;
-  background-color: $primary-color;
-  border: 1px solid darken($primary-color, 5%);
-  color: #fff;
+  background-color: $button-primary-background-color;
+  border: 1px solid $button-primary-border-color;
+  color: $button-primary-color;
 
   &:not(.disabled) {
     &:hover{
-      background-color: darken($primary-color, 10%);
-      border-color: darken($primary-color, 15%);
+      background-color: darken($button-primary-background-color, 10%);
+      border-color: darken($button-primary-border-color, 15%);
     }
 
     &:active {
@@ -46,20 +47,20 @@
 
   &:hover,
   &:focus {
-    color: #fff;
+    color: $button-primary-color;
   }
 }
 
 @mixin light-button {
   @include basic-button;
-  background-color: #fff;
-  border: 1px solid #d9d9d9;
-  color: $primary-color;
+  background-color: $button-default-background-color;
+  border: 1px solid $button-default-border-color;
+  color: $button-default-color;
 
   &:not(.disabled) {
     &:hover {
-      background-color: darken(#fff, 10%);
-      border-color: darken(#d9d9d9, 12%);
+      background-color: darken($button-default-background-color, 10%);
+      border-color: darken($button-default-border-color, 12%);
     }
 
     &:active {
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index b072526d483..d64f0edc255 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -77,6 +77,18 @@ $padding-base-horizontal: 10px !default;
 
 $button-font-weight: $font-weight-bold !default;
 
+$button-default-color: $text-color !default;
+$button-default-background-color: #fff !default;
+$button-default-border-color: #d9d9d9 !default;
+
+$button-primary-color: #fff !default;
+$button-primary-background-color: $primary-color !default;
+$button-primary-border-color: darken($primary-color, 5%) !default;
+
+//== Forms
+
+$cursor-disabled: not-allowed !default; // for forms and buttons
+
 //== Tables
 
 $table-cell-padding: 8px !default;
@@ -103,17 +115,17 @@ $flash-message-error-text-color: #b33c33 !default;
 
 //== Navbar
 
-$navbar-border-radius: $border-radius-base;
+$navbar-border-radius: $border-radius-base !default;
 $navbar-padding-horizontal: 10px !default;
 $navbar-padding-vertical: 10px !default;
 
-$navbar-color: #fff;
-$navbar-background-color: lighten($primary-color, 5%);
+$navbar-color: #fff !default;
+$navbar-background-color: lighten($primary-color, 5%) !default;
 
-$navbar-link-color: #fff;
-$navbar-link-hover-color: #fff;
+$navbar-link-color: #fff !default;
+$navbar-link-hover-color: #fff !default;
 $navbar-link-hover-background-color: lighten($primary-color, 12%) !default;
-$navbar-link-active-color: #fff;
+$navbar-link-active-color: #fff !default;
 $navbar-link-active-background-color: lighten($primary-color, 12%) !default;
 
 $navbar-arrow-height: 4px !default;
@@ -126,3 +138,8 @@ $panel-body-padding: 15px !default;
 $panel-heading-background-color: #e6e6e6 !default;
 $panel-heading-padding: 10px 15px !default;
 $panel-border-radius: $border-radius-base !default;
+
+//== Typography
+
+$hr-border-color: darken($body-background-color, 15%) !default;
+$blockquote-color: lighten($text-color, 35%) !default;

From b9501a3e8cfa7fed81ed0b35918fa1b4703bb2f8 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 17 Apr 2015 18:27:30 -0400
Subject: [PATCH 100/170] Rename button mixins to use default and primary

Further configure table_tools and pagination styles

Conflicts:
	app/assets/stylesheets/active_admin/_forms.scss
---
 .../stylesheets/active_admin/_forms.scss      |  7 ++--
 .../active_admin/components/_buttons.scss     |  2 +-
 .../components/_dropdown_menu.scss            |  2 +-
 .../components/_modal_dialog.scss             |  4 +--
 .../active_admin/components/_pagination.scss  | 12 +++----
 .../active_admin/components/_table_tools.scss | 15 +++-----
 .../active_admin/mixins/_buttons.scss         | 36 +++++++++----------
 .../active_admin/structure/_title_bar.scss    |  2 +-
 8 files changed, 37 insertions(+), 43 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 85f85ba15d0..df6cca60fb3 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -180,7 +180,7 @@ textarea {
   input[type=submit],
   input[type=button],
   button {
-    @include default-button;
+    @include primary-button;
   }
 
   .button,
@@ -191,8 +191,7 @@ textarea {
 
   .cancel {
     a {
-      @include light-button;
-      @include icon(#777, 9px);
+      @include default-button;
     }
   }
 }
@@ -273,6 +272,6 @@ $date-range-filter-input-width: ($sidebar-inner-content-width / 2) - ($filter-fi
   }
 
   a.clear_filters_btn {
-    @include light-button;
+    @include default-button;
   }
 }
diff --git a/app/assets/stylesheets/active_admin/components/_buttons.scss b/app/assets/stylesheets/active_admin/components/_buttons.scss
index ff6a2464a7a..32c057ddf1a 100644
--- a/app/assets/stylesheets/active_admin/components/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/components/_buttons.scss
@@ -3,4 +3,4 @@ a.member_link {
   white-space: nowrap;
 }
 
-a.button, a:link.button, a:visited.button, input[type=submit], input[type=button], button { @include default-button; }
+a.button, a:link.button, a:visited.button, input[type=submit], input[type=button], button { @include primary-button; }
diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index 4ed314045ad..a04fed4731e 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -4,7 +4,7 @@
 }
 
 .dropdown_menu_button {
-  @include light-button;
+  @include default-button;
   padding-right: 22px;
   position: relative;
 
diff --git a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
index 4168f341ccb..c163e71574b 100644
--- a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
+++ b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
@@ -46,10 +46,10 @@
   margin-right: 5px;
 
   & {
-    @include default-button;
+    @include primary-button;
   }
 
   &.cancel {
-    @include light-button;
+    @include default-button;
   }
 }
diff --git a/app/assets/stylesheets/active_admin/components/_pagination.scss b/app/assets/stylesheets/active_admin/components/_pagination.scss
index abb81ea27cf..d2a0f3463dd 100644
--- a/app/assets/stylesheets/active_admin/components/_pagination.scss
+++ b/app/assets/stylesheets/active_admin/components/_pagination.scss
@@ -3,17 +3,17 @@
   margin-left: 10px;
 
   a {
-    @include light-button;
+    @include default-button;
   }
 
   .page.current {
-    background-color: $primary-color;
-    border: 1px solid darken($primary-color, 5%);
-    border-radius: 0.25em;
-    color: #fff;
+    background-color: $button-primary-background-color;
+    border: 1px solid $button-primary-border-color;
+    border-radius: $border-radius-base;
+    color: $button-primary-color;
     cursor: default;
     display: inline-block;
-    font-weight: bold;
+    font-weight: $button-font-weight;
   }
 
   a,
diff --git a/app/assets/stylesheets/active_admin/components/_table_tools.scss b/app/assets/stylesheets/active_admin/components/_table_tools.scss
index abe52526b4e..3b887067ce8 100644
--- a/app/assets/stylesheets/active_admin/components/_table_tools.scss
+++ b/app/assets/stylesheets/active_admin/components/_table_tools.scss
@@ -3,7 +3,7 @@
 }
 
 a.table_tools_button {
-  @include light-button;
+  @include default-button;
   font-weight: normal;
 }
 
@@ -44,22 +44,17 @@ a.table_tools_button {
     }
 
     &:first-child a {
-      border-radius: 0.25em 0 0 0.25em;
+      border-radius: $border-radius-base 0 0 $border-radius-base;
     }
 
     &:last-child a {
-      border-radius: 0 0.25em 0.25em 0;
+      border-radius: 0 $border-radius-base $border-radius-base 0;
     }
 
     &.selected a {
-      background-color: darken(#fff, 10%);
-      border-color: darken(#d9d9d9, 12%);
+      background-color: darken($button-default-background-color, 10%);
+      border-color: darken($button-default-border-color, 12%);
       z-index: 2;
-
-      &:hover {
-        background-color: darken(#fff, 17%);
-        border-color: darken(#d9d9d9, 25%);
-      }
     }
   }
 }
diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index 2e65297d403..879a3f9d762 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -30,41 +30,41 @@
 
 @mixin default-button {
   @include basic-button;
-  background-color: $button-primary-background-color;
-  border: 1px solid $button-primary-border-color;
-  color: $button-primary-color;
+  background-color: $button-default-background-color;
+  border: 1px solid $button-default-border-color;
+  color: $button-default-color;
 
   &:not(.disabled) {
-    &:hover{
-      background-color: darken($button-primary-background-color, 10%);
-      border-color: darken($button-primary-border-color, 15%);
+    &:hover {
+      background-color: darken($button-default-background-color, 10%);
+      border-color: darken($button-default-border-color, 12%);
     }
 
     &:active {
       box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
     }
   }
-
-  &:hover,
-  &:focus {
-    color: $button-primary-color;
-  }
 }
 
-@mixin light-button {
+@mixin primary-button {
   @include basic-button;
-  background-color: $button-default-background-color;
-  border: 1px solid $button-default-border-color;
-  color: $button-default-color;
+  background-color: $button-primary-background-color;
+  border: 1px solid $button-primary-border-color;
+  color: $button-primary-color;
 
   &:not(.disabled) {
-    &:hover {
-      background-color: darken($button-default-background-color, 10%);
-      border-color: darken($button-default-border-color, 12%);
+    &:hover{
+      background-color: darken($button-primary-background-color, 10%);
+      border-color: darken($button-primary-border-color, 15%);
     }
 
     &:active {
       box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
     }
   }
+
+  &:hover,
+  &:focus {
+    color: $button-primary-color;
+  }
 }
diff --git a/app/assets/stylesheets/active_admin/structure/_title_bar.scss b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
index b799adb66c3..0b40f6a4e8e 100644
--- a/app/assets/stylesheets/active_admin/structure/_title_bar.scss
+++ b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
@@ -13,7 +13,7 @@
   .action_item {
     & > a,
     & > .dropdown_menu > a {
-      @include light-button;
+      @include default-button;
     }
   }
 }

From a1d33d1f41bd8ef94480e306b8049413c88257d8 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Sat, 18 Apr 2015 15:37:49 -0400
Subject: [PATCH 101/170] Configure dropdown styles and use inline caret

The inline caret renders much better in browsers than if using a pseudo
element. The latter approach renders sometimes blurry or cut off.
---
 .../stylesheets/active_admin/_header.scss     | 18 ----------
 .../components/_dropdown_menu.scss            | 34 +++++++++----------
 .../active_admin/mixins/_variables.scss       | 14 ++++++--
 .../views/components/dropdown_menu.rb         |  5 ++-
 lib/active_admin/views/tabbed_navigation.rb   | 16 +++++++--
 5 files changed, 44 insertions(+), 43 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index e80dff6f241..7f91840d8f8 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -48,24 +48,6 @@
         color: $navbar-link-active-color;
       }
 
-      &.has_nested > a,
-      &.has_nested.current > a,
-      &.has_nested:hover > a {
-        padding-right: $navbar-arrow-width + $navbar-padding-vertical + 4px;
-
-        &:after {
-          border-left: ($navbar-arrow-width / 2) solid transparent;
-          border-right: ($navbar-arrow-width / 2) solid transparent;
-          border-top: $navbar-arrow-height dashed;
-          content: '';
-          height: 0;
-          position: absolute;
-          right: $navbar-padding-vertical;
-          top: calc(50% - #{$navbar-arrow-height / 2});
-          width: 0;
-        }
-      }
-
       &:hover > a {
         background-color: $navbar-link-hover-background-color;
         color: $navbar-link-hover-color;
diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index a04fed4731e..41273996e48 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -1,3 +1,13 @@
+.caret {
+  border-left: $caret-width-base solid transparent;
+  border-right: $caret-width-base solid transparent;
+  border-top: $caret-width-base dashed;
+  display: inline-block;
+  height: 0;
+  vertical-align: middle;
+  width: 0;
+}
+
 .dropdown_menu {
   display: inline-block;
   position: relative;
@@ -5,20 +15,6 @@
 
 .dropdown_menu_button {
   @include default-button;
-  padding-right: 22px;
-  position: relative;
-
-  &:after {
-    border-left: 4px solid transparent;
-    border-right: 4px solid transparent;
-    border-top: 4px dashed;
-    content: '';
-    height: 0;
-    position: absolute;
-    right: 11px;
-    top: 45%;
-    width: 0;
-  }
 }
 
 .dropdown_menu_list_wrapper {
@@ -30,9 +26,9 @@
 }
 
 .dropdown_menu_list {
-  background-color: #FFF;
-  border: 1px solid #c7c7c7;
-  border-radius: 3px;
+  background-color: $dropdown-background-color;
+  border: 1px solid $dropdown-border-color;
+  border-radius: $border-radius-base;
   box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
   display: block;
   list-style: none;
@@ -42,13 +38,15 @@
 
   > li {
     > a {
+      color: $dropdown-link-color;
       display: block;
       padding: 4px 15px;
       text-decoration: none;
       white-space: nowrap;
 
       &:hover {
-        background-color: #e9e9e9;
+        background-color: $dropdown-link-hover-background-color;
+        color: $dropdown-link-hover-color;
       }
     }
   }
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index d64f0edc255..03d2a0e9554 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -89,6 +89,17 @@ $button-primary-border-color: darken($primary-color, 5%) !default;
 
 $cursor-disabled: not-allowed !default; // for forms and buttons
 
+//== Dropdowns
+
+$caret-width-base: 4px !default;
+
+$dropdown-background-color: #fff !default;
+$dropdown-border-color: rgba(0, 0, 0, .15) !default;
+
+$dropdown-link-color: $text-color !default;
+$dropdown-link-hover-color: darken($text-color, 5%) !default;
+$dropdown-link-hover-background-color: #e9e9e9 !default;
+
 //== Tables
 
 $table-cell-padding: 8px !default;
@@ -128,9 +139,6 @@ $navbar-link-hover-background-color: lighten($primary-color, 12%) !default;
 $navbar-link-active-color: #fff !default;
 $navbar-link-active-background-color: lighten($primary-color, 12%) !default;
 
-$navbar-arrow-height: 4px !default;
-$navbar-arrow-width: 8px !default;
-
 //== Panels
 
 $panel-background-color: #f8f8f8 !default;
diff --git a/lib/active_admin/views/components/dropdown_menu.rb b/lib/active_admin/views/components/dropdown_menu.rb
index e87c9ac2775..396200aa2c3 100644
--- a/lib/active_admin/views/components/dropdown_menu.rb
+++ b/lib/active_admin/views/components/dropdown_menu.rb
@@ -49,7 +49,10 @@ def build_button(name, button_options)
 
         button_options[:href] = '#'
 
-        a name, button_options
+        a button_options do
+          text_node name
+          span class: 'caret'
+        end
       end
 
       def build_menu(options)
diff --git a/lib/active_admin/views/tabbed_navigation.rb b/lib/active_admin/views/tabbed_navigation.rb
index f72c838d623..64c92afc8cd 100644
--- a/lib/active_admin/views/tabbed_navigation.rb
+++ b/lib/active_admin/views/tabbed_navigation.rb
@@ -43,16 +43,26 @@ def build_menu_item(item)
         li id: item.id do |li|
           li.add_class "current" if item.current? assigns[:current_tab]
 
+          children = item.items(self).presence
+
           if url = item.url(self)
-            text_node link_to item.label(self), url, item.html_options
+            link = link_to url, item.html_options do
+              if children.present?
+                (item.label(self) + ' ' + tag(:span, class: 'caret')).html_safe
+              else
+                item.label(self)
+              end
+            end
+
+            text_node link
           else
             span item.label(self), item.html_options
           end
 
-          if children = item.items(self).presence
+          if children.present?
             li.add_class "has_nested"
             ul do
-              children.each{ |child| build_menu_item child }
+              children.each { |child| build_menu_item child }
             end
           end
         end

From bc2b9c83ddf6ef095cc9a8f75a45591f6c449169 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Sat, 18 Apr 2015 15:52:10 -0400
Subject: [PATCH 102/170] Simplify dropdown structure

Removes list wrapper as its unnecessary, we just need the menu list and
thats enough. This brings us more in line with Bootstrap/Foundation to
make a possible future transition easier.
---
 .../active_admin/lib/dropdown-menu.js.coffee     |  2 +-
 .../active_admin/components/_dropdown_menu.scss  | 16 ++++++----------
 features/step_definitions/action_link_steps.rb   |  4 ++--
 .../views/components/dropdown_menu.rb            | 10 ++--------
 .../components/batch_action_selector_spec.rb     |  2 +-
 5 files changed, 12 insertions(+), 22 deletions(-)

diff --git a/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee b/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee
index 062f2c41370..20c0a23fa53 100644
--- a/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee
@@ -13,7 +13,7 @@ class ActiveAdmin.DropdownMenu
     @isOpen  = false
 
     @$menuButton = @$element.find '.dropdown_menu_button'
-    @$menuList   = @$element.find '.dropdown_menu_list_wrapper'
+    @$menuList   = @$element.find '.dropdown-menu'
 
     @_buildMenuList()
     @_bind()
diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index 41273996e48..026cfb5bcf2 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -17,24 +17,20 @@
   @include default-button;
 }
 
-.dropdown_menu_list_wrapper {
-  display: none;
-  left: 0;
-  position: absolute;
-  top: 100%;
-  z-index: 950;
-}
-
-.dropdown_menu_list {
+.dropdown-menu {
   background-color: $dropdown-background-color;
   border: 1px solid $dropdown-border-color;
   border-radius: $border-radius-base;
   box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
-  display: block;
+  display: none;
+  left: 0;
   list-style: none;
   margin: 2px 0 0 0;
   min-width: 160px;
   padding: 5px 0;
+  position: absolute;
+  top: 100%;
+  z-index: 950;
 
   > li {
     > a {
diff --git a/features/step_definitions/action_link_steps.rb b/features/step_definitions/action_link_steps.rb
index bcc030208eb..f7c5524f506 100644
--- a/features/step_definitions/action_link_steps.rb
+++ b/features/step_definitions/action_link_steps.rb
@@ -11,10 +11,10 @@
 end
 
 Then /^I should see a dropdown menu item to "([^"]*)"$/ do |name|
-  expect(page).to have_css('ul.dropdown_menu_list li a', text: name)
+  expect(page).to have_css('ul.dropdown-menu li a', text: name)
 end
 
 Then /^I should not see a dropdown menu item to "([^"]*)"$/ do |name|
-  %{Then I should not see "#{name}" within "ul.dropdown_menu_list li a"}
+  %{Then I should not see "#{name}" within "ul.dropdown-menu li a"}
 end
 
diff --git a/lib/active_admin/views/components/dropdown_menu.rb b/lib/active_admin/views/components/dropdown_menu.rb
index 396200aa2c3..f822ab305b0 100644
--- a/lib/active_admin/views/components/dropdown_menu.rb
+++ b/lib/active_admin/views/components/dropdown_menu.rb
@@ -57,15 +57,9 @@ def build_button(name, button_options)
 
       def build_menu(options)
         options[:class] ||= ''
-        options[:class] << ' dropdown_menu_list'
+        options[:class] << ' dropdown-menu'
 
-        menu_list = nil
-
-        div :class => 'dropdown_menu_list_wrapper' do
-          menu_list = ul(options)
-        end
-
-        menu_list
+        menu_list = ul(options)
       end
 
     end
diff --git a/spec/unit/views/components/batch_action_selector_spec.rb b/spec/unit/views/components/batch_action_selector_spec.rb
index 9694ff72ee3..888e7458913 100644
--- a/spec/unit/views/components/batch_action_selector_spec.rb
+++ b/spec/unit/views/components/batch_action_selector_spec.rb
@@ -15,7 +15,7 @@
 
   describe "the action list" do
     subject do
-      dropdown.find_by_class("dropdown_menu_list").first
+      dropdown.find_by_class("dropdown-menu").first
     end
 
     describe '#tag_name' do

From a8674fa8d2a03e639ad03e323eb9ed059d4c3633 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 20 Apr 2015 12:46:59 -0400
Subject: [PATCH 103/170] Use variable for all font-weights

---
 app/assets/stylesheets/active_admin/_forms.scss               | 4 ++--
 app/assets/stylesheets/active_admin/_header.scss              | 1 -
 .../stylesheets/active_admin/components/_blank_slates.scss    | 4 ++--
 app/assets/stylesheets/active_admin/components/_comments.scss | 2 +-
 .../stylesheets/active_admin/components/_date_picker.scss     | 4 ++--
 .../stylesheets/active_admin/components/_dropdown_menu.scss   | 1 +
 .../stylesheets/active_admin/components/_table_tools.scss     | 2 +-
 .../active_admin/components/_unsupported_browser.scss         | 1 -
 app/assets/stylesheets/active_admin/mixins/_variables.scss    | 2 +-
 9 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index df6cca60fb3..096d7460e2e 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -36,7 +36,7 @@ textarea {
   .label {
     display: block;
     float: left;
-    font-weight: bold;
+    font-weight: $font-weight-bold;
     width: 20%;
 
     abbr {
@@ -164,7 +164,7 @@ textarea {
 
   .inline-errors, .errors {
     color: $error-color;
-    font-weight: bold;
+    font-weight: $font-weight-bold;
   }
 
   .errors {
diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index 7f91840d8f8..f8bcd3af35d 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -23,7 +23,6 @@
   h1 {
     color: $navbar-color;
     font-size: 1.3em;
-    font-weight: normal;
   }
 
   .tabs {
diff --git a/app/assets/stylesheets/active_admin/components/_blank_slates.scss b/app/assets/stylesheets/active_admin/components/_blank_slates.scss
index 4e63ae94bd7..61310facab4 100644
--- a/app/assets/stylesheets/active_admin/components/_blank_slates.scss
+++ b/app/assets/stylesheets/active_admin/components/_blank_slates.scss
@@ -6,12 +6,12 @@
   color: $blank-slate-primary-color;
   display: inline-block;
   font-size: 1.3em;
-  font-weight: bold;
+  font-weight: $font-weight-bold;
 
   small {
     display: block;
     font-size: 0.9em;
-    font-weight: normal;
+    font-weight: $font-weight-normal;
   }
 }
 
diff --git a/app/assets/stylesheets/active_admin/components/_comments.scss b/app/assets/stylesheets/active_admin/components/_comments.scss
index 38dbe8020aa..9f65c966209 100644
--- a/app/assets/stylesheets/active_admin/components/_comments.scss
+++ b/app/assets/stylesheets/active_admin/components/_comments.scss
@@ -10,7 +10,7 @@
 
 .active_admin_comment_author {
   color: $primary-color;
-  font-weight: bold;
+  font-weight: $font-weight-bold;
   margin: 0;
 }
 
diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index 97c254245e9..4d04a04ad3a 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -10,7 +10,7 @@
 }
 
 .ui-datepicker-title {
-  font-weight: bold;
+  font-weight: $font-weight-bold;
   text-align: center;
 }
 
@@ -80,7 +80,7 @@
   thead th {
     border-bottom: none;
     font-size: 0.9em;
-    font-weight: normal;
+    font-weight: $font-weight-normal;
     padding: 2px 0;
   }
 
diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index 026cfb5bcf2..d3798bebf43 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -4,6 +4,7 @@
   border-top: $caret-width-base dashed;
   display: inline-block;
   height: 0;
+  margin-left: 2px;
   vertical-align: middle;
   width: 0;
 }
diff --git a/app/assets/stylesheets/active_admin/components/_table_tools.scss b/app/assets/stylesheets/active_admin/components/_table_tools.scss
index 3b887067ce8..6f01017232f 100644
--- a/app/assets/stylesheets/active_admin/components/_table_tools.scss
+++ b/app/assets/stylesheets/active_admin/components/_table_tools.scss
@@ -4,7 +4,7 @@
 
 a.table_tools_button {
   @include default-button;
-  font-weight: normal;
+  font-weight: $font-weight-normal;
 }
 
 .table_tools_segmented_control {
diff --git a/app/assets/stylesheets/active_admin/components/_unsupported_browser.scss b/app/assets/stylesheets/active_admin/components/_unsupported_browser.scss
index a32fffadf53..095f6434a34 100644
--- a/app/assets/stylesheets/active_admin/components/_unsupported_browser.scss
+++ b/app/assets/stylesheets/active_admin/components/_unsupported_browser.scss
@@ -5,7 +5,6 @@
 
   h1 {
     font-size: 13px;
-    font-weight: bold;
   }
 
   p {
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 03d2a0e9554..64376f0ee15 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -112,7 +112,7 @@ $breadcrumb-separator: "/" !default;
 
 //== Flash Messages
 
-$flash-message-font-weight: bold !default;
+$flash-message-font-weight: $font-weight-bold !default;
 $flash-message-padding: 12px $horizontal-page-margin !default;
 
 $flash-message-default-background-color: #f7f1d3 !default;

From f9588e593d2de3b776a5fb6fe70424aaf3027be7 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 20 Apr 2015 12:47:20 -0400
Subject: [PATCH 104/170] Apply same hover/focus on button default as primary

---
 app/assets/stylesheets/active_admin/mixins/_buttons.scss | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index 879a3f9d762..c105e74265e 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -44,6 +44,11 @@
       box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
     }
   }
+
+  &:hover,
+  &:focus {
+    color: $button-default-color;
+  }
 }
 
 @mixin primary-button {

From fabce7bf15af9126fbdd24d9222865e54906e4ee Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 21 Apr 2015 13:33:57 -0400
Subject: [PATCH 105/170] Configure badge, status tag and title bar styles

Update title bar component with new class names to make it easier to
override if necessary.
---
 .../active_admin/components/_status_tags.scss | 10 +++----
 .../active_admin/components/_table_tools.scss | 21 ++++++++-------
 .../active_admin/mixins/_variables.scss       | 27 ++++++++++++++++++-
 .../active_admin/structure/_title_bar.scss    | 22 +++++++--------
 lib/active_admin/views/title_bar.rb           |  8 +++---
 5 files changed, 57 insertions(+), 31 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_status_tags.scss b/app/assets/stylesheets/active_admin/components/_status_tags.scss
index 80346c8d19b..d4582a41933 100644
--- a/app/assets/stylesheets/active_admin/components/_status_tags.scss
+++ b/app/assets/stylesheets/active_admin/components/_status_tags.scss
@@ -1,15 +1,15 @@
 .status_tag {
-  border-radius: 0.25em;
-  color: #fff;
-  padding: 0.2em 0.5em;
+  border-radius: $status-tag-border-radius;
+  color: $status-tag-color;
+  padding: $status-tag-padding;
   text-align: center;
 
   &,
   &.no {
-    background-color: #777;
+    background-color: $status-tag-no-background-color;
   }
 
   &.yes {
-    background-color: #6090DB;
+    background-color: $status-tag-yes-background-color;
   }
 }
diff --git a/app/assets/stylesheets/active_admin/components/_table_tools.scss b/app/assets/stylesheets/active_admin/components/_table_tools.scss
index 6f01017232f..84028b31aaf 100644
--- a/app/assets/stylesheets/active_admin/components/_table_tools.scss
+++ b/app/assets/stylesheets/active_admin/components/_table_tools.scss
@@ -1,3 +1,14 @@
+.badge {
+  background-color: $badge-background-color;
+  border-radius: $badge-border-radius;
+  color: $badge-color;
+  display: inline-block;
+  font-weight: $badge-font-weight;
+  line-height: $badge-line-height;
+  padding: 3px 7px;
+  vertical-align: baseline;
+}
+
 .table_tools {
   margin-bottom: 15px;
 }
@@ -15,16 +26,6 @@ a.table_tools_button {
   padding: 0;
   vertical-align: bottom; // required so this aligns correctly with .dropdown_menu
 
-  .badge {
-    background-color: rgba(0,0,0,0.35);
-    border-radius: 10px;
-    color: #fff;
-    display: inline-block;
-    line-height: 1;
-    padding: 3px 7px;
-    vertical-align: baseline;
-  }
-
   li {
     float: left;
 
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 64376f0ee15..320ac308cb4 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -8,7 +8,7 @@ $primary-color: #5E6469 !default;
 $secondary-color: #f0f0f0 !default;
 $text-color: #323537 !default;
 $link-color: #38678b !default;
-$section-header-text-color: $primary-color !default; // REMOVED
+$section-header-text-color: $primary-color !default; // renamed: $title-bar-color
 $current-menu-item-background: lighten($primary-color, 12%) !default; // renamed: $navbar-link-active-background-color
 $hover-menu-item-background: lighten($primary-color, 12%) !default; // renamed: $navbar-link-hover-background-color
 $table-stripe-color: #f8f8f8 !default;
@@ -104,6 +104,15 @@ $dropdown-link-hover-background-color: #e9e9e9 !default;
 
 $table-cell-padding: 8px !default;
 
+//== Badges
+
+$badge-color: #fff !default;
+$badge-background-color: rgba(0, 0, 0, 0.35) !default;
+
+$badge-border-radius: 10px !default;
+$badge-font-weight: $font-weight-normal !default;
+$badge-line-height: 1 !default;
+
 //== Breadcrumbs
 
 $breadcrumb-color: #8a949e !default;
@@ -147,6 +156,22 @@ $panel-heading-background-color: #e6e6e6 !default;
 $panel-heading-padding: 10px 15px !default;
 $panel-border-radius: $border-radius-base !default;
 
+//== Status Tags
+
+$status-tag-border-radius: $border-radius-base !default;
+$status-tag-padding: 0.2em 0.5em !default;
+
+$status-tag-color: #fff !default;
+$status-tag-no-background-color: #777 !default;
+$status-tag-yes-background-color: #6090DB !default;
+
+//== Title Bar
+
+$title-bar-background-color: #eaebec !default;
+$title-bar-color: $text-color !default;
+
+$title-bar-heading-font-size: 1.9em !default;
+
 //== Typography
 
 $hr-border-color: darken($body-background-color, 15%) !default;
diff --git a/app/assets/stylesheets/active_admin/structure/_title_bar.scss b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
index 0b40f6a4e8e..07a8bacc3c2 100644
--- a/app/assets/stylesheets/active_admin/structure/_title_bar.scss
+++ b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
@@ -1,15 +1,10 @@
-#title_bar {
-  background-color: #eaebec;
-  color: $section-header-text-color;
+.title-bar {
+  background-color: $title-bar-background-color;
+  color: $title-bar-color;
   display: table;
   padding: 10px $horizontal-page-margin;
   width: 100%;
 
-  h2 {
-    font-size: 2em;
-    margin: 0;
-  }
-
   .action_item {
     & > a,
     & > .dropdown_menu > a {
@@ -18,12 +13,17 @@
   }
 }
 
-#titlebar_left,
-#titlebar_right {
+.title-bar-header,
+.title-bar-actions {
   display: table-cell;
   vertical-align: middle;
 }
 
-#titlebar_right {
+.title-bar-actions {
   text-align: right;
 }
+
+.title-bar-heading {
+  font-size: $title-bar-heading-font-size;
+  margin: 0;
+}
diff --git a/lib/active_admin/views/title_bar.rb b/lib/active_admin/views/title_bar.rb
index d63d5591029..69645e87b98 100644
--- a/lib/active_admin/views/title_bar.rb
+++ b/lib/active_admin/views/title_bar.rb
@@ -3,7 +3,7 @@ module Views
     class TitleBar < Component
 
       def build(title, action_items)
-        super(id: "title_bar")
+        super(id: "title_bar", class: 'title-bar')
         @title = title
         @action_items = action_items
         build_titlebar_left
@@ -13,14 +13,14 @@ def build(title, action_items)
       private
 
       def build_titlebar_left
-        div id: "titlebar_left" do
+        div id: "titlebar_left", class: 'title-bar-header' do
           build_breadcrumb
           build_title_tag
         end
       end
 
       def build_titlebar_right
-        div id: "titlebar_right" do
+        div id: "titlebar_right", class: 'title-bar-actions' do
           build_action_items
         end
       end
@@ -44,7 +44,7 @@ def build_breadcrumb(separator = "/")
       end
 
       def build_title_tag
-        h2(@title, id: 'page_title')
+        h2(@title, id: 'page_title', class: 'title-bar-heading')
       end
 
       def build_action_items

From c8f446561e35b37a73a95024d0a49cca1c3f0f69 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 21 Apr 2015 13:35:14 -0400
Subject: [PATCH 106/170] Add hover/focus state for date picker links

Preserve same text color for now for prev/next links. Adjust some other
styles for better presentation.
---
 .../active_admin/components/_date_picker.scss      | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index 4d04a04ad3a..606976851c2 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -32,6 +32,11 @@
   top: 0;
   width: 20px; // with top/bottom provide larger hit area for button
 
+  &:focus,
+  &:hover {
+    color: #fff;
+  }
+
   // base for arrows
   &:after {
     border-bottom: 4px solid transparent;
@@ -67,9 +72,8 @@
 }
 
 .ui-datepicker-calendar {
-  background-color: #f4f4f4;
-  border: 1px solid lighten($primary-color, 5%);
-  border-width: 0 1px 1px 1px;
+  background-color: #fff;
+  border: none;
   margin-bottom: 0;
 
   td, th {
@@ -80,7 +84,7 @@
   thead th {
     border-bottom: none;
     font-size: 0.9em;
-    font-weight: $font-weight-normal;
+    font-weight: $font-weight-bold;
     padding: 2px 0;
   }
 
@@ -95,7 +99,7 @@
         color: #555;
         display: block;
         font-size: 0.9em;
-        padding: 4px 0;
+        padding: 3px 0;
 
         &:hover {
           background-color: #eceef0;

From 825ce90c47fb6411eaee43bd424d103c8a2dd0a6 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 21 Apr 2015 16:16:50 -0400
Subject: [PATCH 107/170] Major change for global button and button theme
 classes

This makes it much easier to apply button styles across the admin and
allows users to specify their own themes too. For example, user
provided action items now require that you set button class and theme
class rather than just styling them all the same. You could apply
different classes to each. Further this cuts down on our CSS and
promotes better reusability for users by simply using class.
---
 .../active_admin/initializers/filters.js.coffee  |  2 +-
 .../active_admin/lib/dropdown-menu.js.coffee     |  2 +-
 .../active_admin/lib/modal_dialog.js.coffee      |  4 ++--
 app/assets/stylesheets/active_admin/_forms.scss  | 16 ----------------
 .../active_admin/components/_buttons.scss        | 12 +++++++++++-
 .../active_admin/components/_dropdown_menu.scss  |  6 +-----
 .../active_admin/components/_modal_dialog.scss   |  8 --------
 .../active_admin/components/_pagination.scss     |  1 +
 .../active_admin/components/_table_tools.scss    |  7 +------
 .../active_admin/components/_tabs.scss           |  2 +-
 .../active_admin/mixins/_buttons.scss            |  4 +---
 .../active_admin/structure/_title_bar.scss       |  7 -------
 features/step_definitions/batch_action_steps.rb  |  4 ++--
 .../batch_actions/views/batch_action_selector.rb |  2 +-
 lib/active_admin/filters/forms.rb                |  4 ++--
 lib/active_admin/form_builder.rb                 |  2 +-
 .../comments/views/active_admin_comments.rb      |  2 +-
 lib/active_admin/resource/action_items.rb        |  6 +++---
 .../views/components/active_admin_form.rb        |  2 +-
 .../views/components/dropdown_menu.rb            |  4 +++-
 lib/active_admin/views/components/index_list.rb  |  2 +-
 lib/active_admin/views/components/scopes.rb      |  2 +-
 lib/active_admin/views/pages/form.rb             |  5 ++++-
 spec/unit/filters/filter_form_builder_spec.rb    |  2 +-
 24 files changed, 41 insertions(+), 67 deletions(-)

diff --git a/app/assets/javascripts/active_admin/initializers/filters.js.coffee b/app/assets/javascripts/active_admin/initializers/filters.js.coffee
index 83122fc9709..2b784c686a8 100644
--- a/app/assets/javascripts/active_admin/initializers/filters.js.coffee
+++ b/app/assets/javascripts/active_admin/initializers/filters.js.coffee
@@ -1,6 +1,6 @@
 $(document).on 'ready page:load turbolinks:load', ->
   # Clear Filters button
-  $('.clear_filters_btn').click (e) ->
+  $('.js-clear-filters-button').click (e) ->
     params = window.location.search.slice(1).split('&')
     regex = /^(q\[|q%5B|q%5b|page|commit)/
     if typeof Turbolinks != 'undefined'
diff --git a/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee b/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee
index 20c0a23fa53..70e1a4d8352 100644
--- a/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee
@@ -12,7 +12,7 @@ class ActiveAdmin.DropdownMenu
     @options = $.extend defaults, @options
     @isOpen  = false
 
-    @$menuButton = @$element.find '.dropdown_menu_button'
+    @$menuButton = @$element.find '.button'
     @$menuList   = @$element.find '.dropdown-menu'
 
     @_buildMenuList()
diff --git a/app/assets/javascripts/active_admin/lib/modal_dialog.js.coffee b/app/assets/javascripts/active_admin/lib/modal_dialog.js.coffee
index a011c2784ac..1f8f6ac75f0 100644
--- a/app/assets/javascripts/active_admin/lib/modal_dialog.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/modal_dialog.js.coffee
@@ -40,12 +40,12 @@ ActiveAdmin.modal_dialog = (message, inputs, callback)->
     buttons:
       OK:
         text: 'OK'
-        class: 'button'
+        class: 'button button-primary'
         click: ->
           callback $(@).serializeObject()
           $(@).dialog('close')
       Cancel:
         text: 'Cancel'
-        class: 'button cancel'
+        class: 'button button-default'
         click: ->
           $(@).dialog('close').remove()
diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 096d7460e2e..4d879412dde 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -177,23 +177,11 @@ textarea {
 
   // Buttons
 
-  input[type=submit],
-  input[type=button],
-  button {
-    @include primary-button;
-  }
-
   .button,
   .action {
     display: inline-block;
     margin-right: 0.5em;
   }
-
-  .cancel {
-    a {
-      @include default-button;
-    }
-  }
 }
 
 // -------------------------------------- Sidebar Forms
@@ -270,8 +258,4 @@ $date-range-filter-input-width: ($sidebar-inner-content-width / 2) - ($filter-fi
   .buttons > * {
     margin-right: 5px;
   }
-
-  a.clear_filters_btn {
-    @include default-button;
-  }
 }
diff --git a/app/assets/stylesheets/active_admin/components/_buttons.scss b/app/assets/stylesheets/active_admin/components/_buttons.scss
index 32c057ddf1a..8bbbb001a38 100644
--- a/app/assets/stylesheets/active_admin/components/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/components/_buttons.scss
@@ -3,4 +3,14 @@ a.member_link {
   white-space: nowrap;
 }
 
-a.button, a:link.button, a:visited.button, input[type=submit], input[type=button], button { @include primary-button; }
+.button {
+  @include button-base;
+}
+
+.button-default {
+  @include default-button;
+}
+
+.button-primary {
+  @include primary-button;
+}
diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index d3798bebf43..eec3dfc48e1 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -9,15 +9,11 @@
   width: 0;
 }
 
-.dropdown_menu {
+.dropdown {
   display: inline-block;
   position: relative;
 }
 
-.dropdown_menu_button {
-  @include default-button;
-}
-
 .dropdown-menu {
   background-color: $dropdown-background-color;
   border: 1px solid $dropdown-border-color;
diff --git a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
index c163e71574b..4138f9b96e6 100644
--- a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
+++ b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
@@ -44,12 +44,4 @@
 
 .ui-dialog-buttonpane button {
   margin-right: 5px;
-
-  & {
-    @include primary-button;
-  }
-
-  &.cancel {
-    @include default-button;
-  }
 }
diff --git a/app/assets/stylesheets/active_admin/components/_pagination.scss b/app/assets/stylesheets/active_admin/components/_pagination.scss
index d2a0f3463dd..a017283c82e 100644
--- a/app/assets/stylesheets/active_admin/components/_pagination.scss
+++ b/app/assets/stylesheets/active_admin/components/_pagination.scss
@@ -3,6 +3,7 @@
   margin-left: 10px;
 
   a {
+    @include button-base;
     @include default-button;
   }
 
diff --git a/app/assets/stylesheets/active_admin/components/_table_tools.scss b/app/assets/stylesheets/active_admin/components/_table_tools.scss
index 84028b31aaf..0c2452b95d3 100644
--- a/app/assets/stylesheets/active_admin/components/_table_tools.scss
+++ b/app/assets/stylesheets/active_admin/components/_table_tools.scss
@@ -13,18 +13,13 @@
   margin-bottom: 15px;
 }
 
-a.table_tools_button {
-  @include default-button;
-  font-weight: $font-weight-normal;
-}
-
 .table_tools_segmented_control {
   @include clearfix;
   display: inline-block;
   list-style: none;
   margin: 0;
   padding: 0;
-  vertical-align: bottom; // required so this aligns correctly with .dropdown_menu
+  vertical-align: bottom; // required so this aligns correctly with .dropdown
 
   li {
     float: left;
diff --git a/app/assets/stylesheets/active_admin/components/_tabs.scss b/app/assets/stylesheets/active_admin/components/_tabs.scss
index 3113a65cef8..add7f9f024b 100644
--- a/app/assets/stylesheets/active_admin/components/_tabs.scss
+++ b/app/assets/stylesheets/active_admin/components/_tabs.scss
@@ -11,7 +11,7 @@
     position: relative;
 
     a {
-      @include basic-button;
+      @include button-base;
       border-radius: 0.25em 0.25em 0 0;
       outline: none;
 
diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index c105e74265e..584f3a3c13c 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -1,4 +1,4 @@
-@mixin basic-button {
+@mixin button-base {
   border: 1px solid transparent;
   border-radius: $border-radius-base;
   cursor: pointer;
@@ -29,7 +29,6 @@
 }
 
 @mixin default-button {
-  @include basic-button;
   background-color: $button-default-background-color;
   border: 1px solid $button-default-border-color;
   color: $button-default-color;
@@ -52,7 +51,6 @@
 }
 
 @mixin primary-button {
-  @include basic-button;
   background-color: $button-primary-background-color;
   border: 1px solid $button-primary-border-color;
   color: $button-primary-color;
diff --git a/app/assets/stylesheets/active_admin/structure/_title_bar.scss b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
index 07a8bacc3c2..700ad9cc09a 100644
--- a/app/assets/stylesheets/active_admin/structure/_title_bar.scss
+++ b/app/assets/stylesheets/active_admin/structure/_title_bar.scss
@@ -4,13 +4,6 @@
   display: table;
   padding: 10px $horizontal-page-margin;
   width: 100%;
-
-  .action_item {
-    & > a,
-    & > .dropdown_menu > a {
-      @include default-button;
-    }
-  }
 }
 
 .title-bar-header,
diff --git a/features/step_definitions/batch_action_steps.rb b/features/step_definitions/batch_action_steps.rb
index 95a782caf63..261a9ef64fa 100644
--- a/features/step_definitions/batch_action_steps.rb
+++ b/features/step_definitions/batch_action_steps.rb
@@ -28,12 +28,12 @@
 end
 
 Then /^I should see that the batch action button is disabled$/ do
-  expect(page).to have_css ".batch_actions_selector .dropdown_menu_button.disabled"
+  expect(page).to have_css ".batch_actions_selector .button.disabled"
 end
 
 Then /^I (should|should not) see the batch action (button|selector)$/ do |maybe, type|
   selector = "div.table_tools .batch_actions_selector"
-  selector << ' .dropdown_menu_button' if maybe == 'should' && type == 'button'
+  selector << ' .button' if maybe == 'should' && type == 'button'
 
   verb = maybe == 'should' ? :to : :to_not
   expect(page).send verb, have_css(selector)
diff --git a/lib/active_admin/batch_actions/views/batch_action_selector.rb b/lib/active_admin/batch_actions/views/batch_action_selector.rb
index 3722194f75e..8d672ec7ac7 100644
--- a/lib/active_admin/batch_actions/views/batch_action_selector.rb
+++ b/lib/active_admin/batch_actions/views/batch_action_selector.rb
@@ -25,7 +25,7 @@ def to_s
       def build_drop_down
         return if batch_actions_to_display.empty?
         dropdown_menu I18n.t("active_admin.batch_actions.button_label"),
-                      class: "batch_actions_selector dropdown_menu",
+                      class: "batch_actions_selector",
                       button: { class: "disabled" } do
           batch_actions_to_display.each do |batch_action|
             confirmation_text = render_or_call_method_or_proc_on(self, batch_action.confirm)
diff --git a/lib/active_admin/filters/forms.rb b/lib/active_admin/filters/forms.rb
index 530036c745f..7b39a539b12 100644
--- a/lib/active_admin/filters/forms.rb
+++ b/lib/active_admin/filters/forms.rb
@@ -63,8 +63,8 @@ def active_admin_filters_form_for(search, filters, options = {})
           end
 
           buttons = content_tag :div, class: "buttons" do
-            f.submit(I18n.t('active_admin.filters.buttons.filter')) +
-              link_to(I18n.t('active_admin.filters.buttons.clear'), '#', class: 'clear_filters_btn') +
+            f.submit(I18n.t('active_admin.filters.buttons.filter'), class: "button button-primary") +
+              link_to(I18n.t('active_admin.filters.buttons.clear'), '#', class: 'js-clear-filters-button button button-default') +
               hidden_field_tags_for(params, except: except_hidden_fields)
           end
 
diff --git a/lib/active_admin/form_builder.rb b/lib/active_admin/form_builder.rb
index a69b8abe5ea..e926de19592 100644
--- a/lib/active_admin/form_builder.rb
+++ b/lib/active_admin/form_builder.rb
@@ -23,7 +23,7 @@ class FormBuilder < ::Formtastic::FormBuilder
 
     def cancel_link(url = {action: "index"}, html_options = {}, li_attrs = {})
       li_attrs[:class] ||= "action cancel"
-      li_content = template.link_to I18n.t('active_admin.cancel'), url, html_options
+      li_content = template.link_to I18n.t('active_admin.cancel'), url, html_options.merge(class: 'button button-default')
       template.content_tag(:li, li_content, li_attrs)
     end
 
diff --git a/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb b/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
index 196cc70ef78..f65f833cd41 100644
--- a/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
+++ b/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
@@ -74,7 +74,7 @@ def build_comment_form
               f.input :body,          label: false, input_html: { size: '80x8' }
             end
             f.actions do
-              f.action :submit, label: I18n.t('active_admin.comments.add')
+              f.action :submit, label: I18n.t('active_admin.comments.add'), button_html: { class: 'button button-primary' }
             end
           end
         end
diff --git a/lib/active_admin/resource/action_items.rb b/lib/active_admin/resource/action_items.rb
index 1aae736ecee..c108be093a5 100644
--- a/lib/active_admin/resource/action_items.rb
+++ b/lib/active_admin/resource/action_items.rb
@@ -64,7 +64,7 @@ def add_default_action_items
       def add_default_new_action_item
         add_action_item :new, only: :index do
           if controller.action_methods.include?('new') && authorized?(ActiveAdmin::Auth::CREATE, active_admin_config.resource_class)
-            link_to I18n.t('active_admin.new_model', model: active_admin_config.resource_label), new_resource_path
+            link_to I18n.t('active_admin.new_model', model: active_admin_config.resource_label), new_resource_path, class: 'button button-default'
           end
         end
       end
@@ -73,7 +73,7 @@ def add_default_new_action_item
       def add_default_edit_action_item
         add_action_item :edit, only: :show do
           if controller.action_methods.include?('edit') && authorized?(ActiveAdmin::Auth::UPDATE, resource)
-            link_to I18n.t('active_admin.edit_model', model: active_admin_config.resource_label), edit_resource_path(resource)
+            link_to I18n.t('active_admin.edit_model', model: active_admin_config.resource_label), edit_resource_path(resource), class: 'button button-default'
           end
         end
       end
@@ -83,7 +83,7 @@ def add_default_show_action_item
         add_action_item :destroy, only: :show do
           if controller.action_methods.include?('destroy') && authorized?(ActiveAdmin::Auth::DESTROY, resource)
             link_to I18n.t('active_admin.delete_model', model: active_admin_config.resource_label), resource_path(resource),
-              method: :delete, data: {confirm: I18n.t('active_admin.delete_confirmation')}
+              method: :delete, data: {confirm: I18n.t('active_admin.delete_confirmation')}, class: 'button button-default'
           end
         end
       end
diff --git a/lib/active_admin/views/components/active_admin_form.rb b/lib/active_admin/views/components/active_admin_form.rb
index 6441571085b..2437421cbfd 100644
--- a/lib/active_admin/views/components/active_admin_form.rb
+++ b/lib/active_admin/views/components/active_admin_form.rb
@@ -72,7 +72,7 @@ def actions(*args, &block)
       end
 
       def commit_action_with_cancel_link
-        action(:submit)
+        action(:submit, button_html: { class: 'button button-primary' })
         cancel_link
       end
 
diff --git a/lib/active_admin/views/components/dropdown_menu.rb b/lib/active_admin/views/components/dropdown_menu.rb
index f822ab305b0..4d00e49156b 100644
--- a/lib/active_admin/views/components/dropdown_menu.rb
+++ b/lib/active_admin/views/components/dropdown_menu.rb
@@ -33,6 +33,8 @@ def build(name, options = {})
         @menu = build_menu(menu_options)
 
         super(options)
+
+        add_class 'dropdown'
       end
 
       def item(*args)
@@ -45,7 +47,7 @@ def item(*args)
 
       def build_button(name, button_options)
         button_options[:class] ||= ''
-        button_options[:class] << ' dropdown_menu_button'
+        button_options[:class] << ' button button-default'
 
         button_options[:href] = '#'
 
diff --git a/lib/active_admin/views/components/index_list.rb b/lib/active_admin/views/components/index_list.rb
index 90a39042465..80009ebefd4 100644
--- a/lib/active_admin/views/components/index_list.rb
+++ b/lib/active_admin/views/components/index_list.rb
@@ -36,7 +36,7 @@ def build(index_classes)
       # @param [Class] index_class The class on which to build the link and html classes
       def build_index_list(index_class)
         li class: classes_for_index(index_class) do
-          a href: url_for(as: index_class.index_name.to_sym), class: "table_tools_button" do
+          a href: url_for(as: index_class.index_name.to_sym), class: "button button-default" do
             name = index_class.index_name
             I18n.t("active_admin.index_list.#{name}", default: name.to_s.titleize)
           end
diff --git a/lib/active_admin/views/components/scopes.rb b/lib/active_admin/views/components/scopes.rb
index 1c86119065b..2fa83369983 100644
--- a/lib/active_admin/views/components/scopes.rb
+++ b/lib/active_admin/views/components/scopes.rb
@@ -34,7 +34,7 @@ def build_scope(scope, options)
           scope_name = I18n.t "active_admin.scopes.#{scope.id}", default: scope.name
           params     = request.query_parameters.except :page, :scope, :commit, :format
 
-          a href: url_for(scope: scope.id, params: params), class: 'table_tools_button' do
+          a href: url_for(scope: scope.id, params: params), class: 'button button-default' do
             text_node scope_name
             span class: 'badge' do
               "#{get_scope_count(scope)}"
diff --git a/lib/active_admin/views/pages/form.rb b/lib/active_admin/views/pages/form.rb
index 801e0f45fd9..7c96c7ffea7 100644
--- a/lib/active_admin/views/pages/form.rb
+++ b/lib/active_admin/views/pages/form.rb
@@ -44,7 +44,10 @@ def default_form_config
           ActiveAdmin::PagePresenter.new do |f|
             f.semantic_errors # show errors on :base by default
             f.inputs
-            f.actions
+            f.actions do
+              f.action :submit, button_html: { class: "button button-primary" }
+              f.action :cancel, button_html: { class: "button button-default" }
+            end
           end
         end
 
diff --git a/spec/unit/filters/filter_form_builder_spec.rb b/spec/unit/filters/filter_form_builder_spec.rb
index 3feca27193c..40e13271f55 100644
--- a/spec/unit/filters/filter_form_builder_spec.rb
+++ b/spec/unit/filters/filter_form_builder_spec.rb
@@ -55,7 +55,7 @@ def filter(name, options = {})
     end
 
     it "should generate a clear filters link" do
-      expect(body).to have_selector("a.clear_filters_btn", text: "Clear Filters")
+      expect(body).to have_selector("a.button-default", text: "Clear Filters")
     end
 
     describe "label as proc" do

From 62c9d89951ea73f053a9f75ce9ef2d288db2c6ef Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 21 Apr 2015 16:52:47 -0400
Subject: [PATCH 108/170] Configure modal, tabs and text muted styles

---
 .../active_admin/components/_comments.scss    |  2 +-
 .../components/_modal_dialog.scss             | 14 +++++------
 .../active_admin/components/_pagination.scss  |  2 +-
 .../active_admin/components/_tabs.scss        | 18 +++++++--------
 .../active_admin/mixins/_variables.scss       | 23 ++++++++++++++++++-
 5 files changed, 39 insertions(+), 20 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_comments.scss b/app/assets/stylesheets/active_admin/components/_comments.scss
index 9f65c966209..919ce4eed68 100644
--- a/app/assets/stylesheets/active_admin/components/_comments.scss
+++ b/app/assets/stylesheets/active_admin/components/_comments.scss
@@ -4,7 +4,7 @@
 }
 
 .active_admin_comment_meta {
-  color: #999;
+  color: $text-muted-color;
   margin-bottom: 5px;
 }
 
diff --git a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
index 4138f9b96e6..33598173135 100644
--- a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
+++ b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
@@ -1,20 +1,20 @@
 .ui-widget-overlay {
-  background-color: rgba(0, 0, 0, 0.5);
+  background-color: $modal-backdrop-background-color;
   bottom: 0;
   left: 0;
   position: fixed;
   right: 0;
   top: 0;
-  z-index: 1001;
+  z-index: $z-index-modal-backdrop;
 }
 
 .ui-dialog {
-  background-color: #fff;
+  background-color: $modal-background-color;
   border-radius: 0.25em;
   box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
   outline: none;
   position: fixed;
-  z-index: 1002;
+  z-index: $z-index-modal;
 
   ul {
     list-style-type: none;
@@ -28,14 +28,14 @@
 
   form,
   .ui-dialog-buttonpane {
-    padding: 15px;
+    padding: $modal-content-padding;
   }
 }
 
 .ui-dialog-titlebar {
-  border-bottom: 1px solid #eee;
+  border-bottom: 1px solid $modal-heading-border-color;
   font-weight: $font-weight-bold;
-  padding: 10px 15px;
+  padding: $modal-heading-padding;
 }
 
 .ui-dialog-titlebar-close {
diff --git a/app/assets/stylesheets/active_admin/components/_pagination.scss b/app/assets/stylesheets/active_admin/components/_pagination.scss
index a017283c82e..e7eeb526d6f 100644
--- a/app/assets/stylesheets/active_admin/components/_pagination.scss
+++ b/app/assets/stylesheets/active_admin/components/_pagination.scss
@@ -24,7 +24,7 @@
 }
 
 .pagination_information {
-  color: #aab2ba;
+  color: $text-muted-color;
   float: right;
   margin-top: 2px; // match pagination link top padding so both appear vertically aligned
 
diff --git a/app/assets/stylesheets/active_admin/components/_tabs.scss b/app/assets/stylesheets/active_admin/components/_tabs.scss
index add7f9f024b..335954712b6 100644
--- a/app/assets/stylesheets/active_admin/components/_tabs.scss
+++ b/app/assets/stylesheets/active_admin/components/_tabs.scss
@@ -1,8 +1,9 @@
 .nav-tabs {
   @include clearfix;
+  border-bottom: 1px solid $tabs-border-color;
   display: block;
   list-style: none;
-  margin: 0 0 0 5px;
+  margin: 0;
   padding-left: 0;
 
   li {
@@ -12,30 +13,27 @@
 
     a {
       @include button-base;
-      border-radius: 0.25em 0.25em 0 0;
+      border-radius: $border-radius-base $border-radius-base 0 0;
       outline: none;
 
       &:hover {
-        background-color: darken(#fff, 10%);
-        border-bottom-color: #d3d3d3;
+        background-color: $tabs-link-hover-background-color;
+        border-bottom-color: $tabs-border-color;
       }
     }
 
     &.ui-tabs-active {
       a,
       a:hover {
-        background-color: #fff;
-        border: 1px solid #d3d3d3;
+        background-color: $tabs-active-link-hover-background-color;
+        border: 1px solid $tabs-active-link-hover-border-color;
         border-bottom-color: transparent;
-        color: $text-color;
+        color: $tabs-active-link-hover-color;
       }
     }
   }
 }
 
 .tab-content {
-  background-color: #fff;
-  border: 1px solid #D3D3D3;
-  border-radius: 0.25em;
   padding: 15px;
 }
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 320ac308cb4..9a2c366ccd8 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -71,7 +71,8 @@ $padding-base-horizontal: 10px !default;
 
 //== z-indexes
 
-
+$z-index-modal-backdrop: 1001 !default;
+$z-index-modal: 1002 !default;
 
 //== Buttons
 
@@ -133,6 +134,15 @@ $flash-message-notice-text-color: #416347 !default;
 $flash-message-error-background-color: #f1dcdc !default;
 $flash-message-error-text-color: #b33c33 !default;
 
+//== Modals
+
+$modal-content-padding: 15px !default;
+$modal-heading-padding: 10px 15px !default;
+
+$modal-background-color: #fff !default;
+$modal-backdrop-background-color: rgba(0, 0, 0, 0.5) !default;
+$modal-heading-border-color: #eee !default;
+
 //== Navbar
 
 $navbar-border-radius: $border-radius-base !default;
@@ -165,6 +175,16 @@ $status-tag-color: #fff !default;
 $status-tag-no-background-color: #777 !default;
 $status-tag-yes-background-color: #6090DB !default;
 
+//== Tabs
+
+$tabs-border-color: #d3d3d3 !default;
+
+$tabs-link-hover-background-color: darken(#fff, 10%) !default;
+
+$tabs-active-link-hover-background-color: #fff !default;
+$tabs-active-link-hover-border-color: $tabs-border-color !default;
+$tabs-active-link-hover-color: $text-color !default;
+
 //== Title Bar
 
 $title-bar-background-color: #eaebec !default;
@@ -174,5 +194,6 @@ $title-bar-heading-font-size: 1.9em !default;
 
 //== Typography
 
+$text-muted-color: #9aa2aa !default;
 $hr-border-color: darken($body-background-color, 15%) !default;
 $blockquote-color: lighten($text-color, 35%) !default;

From 58f2077a1bfa97a47e21ad34a98e256f38989e9d Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 21 Apr 2015 17:38:52 -0400
Subject: [PATCH 109/170] Configure more table styles

---
 .../active_admin/components/_tables.scss         | 16 ++++++----------
 .../active_admin/mixins/_variables.scss          |  2 ++
 2 files changed, 8 insertions(+), 10 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 6cfac62bca0..5226e589668 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -8,14 +8,14 @@ th {
 }
 
 th, td {
-  border-bottom: 1px solid #e8e8e8;
+  border-bottom: 1px solid $table-border-color;
   padding: $table-cell-padding;
   vertical-align: top;
 }
 
 thead {
   th {
-    border-bottom: 2px solid #ccc;
+    border-bottom: 2px solid darken($table-border-color, 10%);
     vertical-align: bottom;
   }
 }
@@ -74,12 +74,8 @@ table.index_table {
 
 // -------------------------------------- Tables inside Panels
 .panel_contents table {
-  thead {
-    background-color: transparent;
-  }
-
   th, td {
-    padding: 5px;
+    padding: $table-condensed-cell-padding;
   }
 }
 
@@ -90,10 +86,10 @@ table.index_table {
 
 .attributes_table table {
   col {
-    border-right: 1px solid #e8e8e8;
+    border-right: 1px solid $table-border-color;
 
     &:first-child {
-      border-right: 2px solid #ccc;
+      border-right: 2px solid darken($table-border-color, 10%);
     }
   }
 
@@ -102,7 +98,7 @@ table.index_table {
   }
 
   td .empty {
-    color: #bbb;
+    color: $text-muted-color;
     font-size: 0.8em;
     letter-spacing: 0.2em;
     text-transform: uppercase;
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 9a2c366ccd8..fe5316ef3a3 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -103,7 +103,9 @@ $dropdown-link-hover-background-color: #e9e9e9 !default;
 
 //== Tables
 
+$table-border-color: #e8e8e8 !default;
 $table-cell-padding: 8px !default;
+$table-condensed-cell-padding: 5px !default;
 
 //== Badges
 

From f0320c81f459129554e5b4ff1539b3df86efab7d Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 21 Apr 2015 18:35:26 -0400
Subject: [PATCH 110/170] Configure form styles and missing values

---
 .../stylesheets/active_admin/_forms.scss      | 19 +++++++++++--------
 .../active_admin/components/_date_picker.scss | 14 +++++++-------
 .../components/_modal_dialog.scss             |  2 +-
 .../active_admin/mixins/_buttons.scss         |  2 +-
 .../active_admin/mixins/_variables.scss       | 14 ++++++++++----
 .../active_admin/pages/_logged_out.scss       |  2 +-
 6 files changed, 31 insertions(+), 22 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 4d879412dde..8ab0e011d8b 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -5,16 +5,19 @@ input[type=number],
 input[type=url],
 input[type=tel],
 textarea {
-  border: $border-width solid #c9d0d6;
-  border-radius: 3px;
+  background-color: $input-background-color;
+  border: 1px solid $input-border-color;
+  border-radius: $input-border-radius;
+  color: $input-color;
   display: inline-block;
   outline: none;
-  padding: 6px 8px;
-  width: calc(80% - #{$text-input-total-padding});
+  padding: $padding-base-vertical $padding-base-horizontal;
+  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+  width: calc(80% - #{($padding-base-horizontal * 2) + 2px});
 
   &:focus {
-    border: $border-width solid #99a2aa;
-    box-shadow: 0 0 4px #99a2aa;
+    border: 1px solid $input-border-focus-color;
+    box-shadow: 0 0 4px $input-border-focus-color;
   }
 }
 
@@ -159,7 +162,7 @@ textarea {
   }
 
   .inline-hints {
-    color: #999;
+    color: $text-muted-color;
   }
 
   .inline-errors, .errors {
@@ -169,7 +172,7 @@ textarea {
 
   .errors {
     background-color: lighten($error-color, 60%);
-    border-radius: 3px;
+    border-radius: $border-radius-base;
     list-style-type: square;
     padding: 10px 10px 10px 25px;
     width: calc(80% - 22px);
diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index 606976851c2..39cb4ad9fad 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -1,7 +1,7 @@
 .ui-datepicker {
   box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
   display: none;
-  width: 160px;
+  width: 12em;
 
   a,
   a:hover {
@@ -15,8 +15,8 @@
 }
 
 .ui-datepicker-header {
-  background-color: lighten($primary-color, 5%);
-  border-radius: 0.25em 0.25em 0 0;
+  background-color: $primary-color;
+  border-radius: $border-radius-base $border-radius-base 0 0;
   color: #fff;
   padding: 5px;
   position: relative; // for datepicker prev/next buttons
@@ -95,11 +95,12 @@
       width: 22px;
 
       a {
-        border-radius: 0.25em;
-        color: #555;
+        border-radius: $border-radius-base;
+        color: $text-color;
         display: block;
         font-size: 0.9em;
-        padding: 3px 0;
+        line-height: 1;
+        padding: 6px 0;
 
         &:hover {
           background-color: #eceef0;
@@ -114,7 +115,6 @@
         &.ui-state-highlight,
         &.ui-state-highlight:hover { // today's date
           background-color: #dbdddf;
-          color: #666;
         }
       }
     }
diff --git a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
index 33598173135..df0a0d5db79 100644
--- a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
+++ b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
@@ -10,7 +10,7 @@
 
 .ui-dialog {
   background-color: $modal-background-color;
-  border-radius: 0.25em;
+  border-radius: $border-radius-base;
   box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
   outline: none;
   position: fixed;
diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index 584f3a3c13c..7495f8a3f0a 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -8,7 +8,7 @@
   line-height: $line-height-base; // needed for input/button elements to match a.button size
   padding: $padding-base-vertical $padding-base-horizontal;
   text-decoration: none;
-  transition: background-color .2s, border-color .2s, color .2s;
+  transition: background-color .15s, border-color .15s, color .15s;
   white-space: nowrap;
 
   &:hover,
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index fe5316ef3a3..b123eed75ca 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -19,17 +19,17 @@ $breadcrumbs-color: #8a949e !default;           // renamed: $breadcrumb-color
 $breadcrumbs-separator-color: #aab2ba !default; // renamed: $breadcrumb-separator-color
 $required-field-marker-color: #aaa !default;
 $form-label-color: $section-header-text-color !default; // REMOVED
-$page-header-text-color: #cdcdcd !default;
+$page-header-text-color: #cdcdcd !default;              // REMOVED
 
 // Sizes
-$border-width: 1px !default;
+$border-width: 1px !default;                // REMOVED
 $horizontal-page-margin: 20px !default;
 $sidebar-width: 270px !default;
 $cell-padding: 5px 10px 3px 10px !default;    // renamed: $table-cell-padding
 $cell-horizontal-padding: 12px !default;      // REMOVED
 $section-padding: 15px !default;              // renamed: $panel-body-padding
-$text-input-horizontal-padding: 8px !default;
-$text-input-total-padding: $text-input-horizontal-padding * 2 + $border-width * 2 !default;
+$text-input-horizontal-padding: 8px !default; // REMOVED
+$text-input-total-padding: $text-input-horizontal-padding * 2 + $border-width * 2 !default; // REMOVED
 $blank-slate-border: 1px dashed #DADADA !default;
 
 
@@ -88,6 +88,12 @@ $button-primary-border-color: darken($primary-color, 5%) !default;
 
 //== Forms
 
+$input-background-color: #fff !default;
+$input-border-color: #c9d0d6 !default;
+$input-border-focus-color: #99a2aa !default;
+$input-border-radius: $border-radius-base !default;
+$input-color: $text-color !default;
+
 $cursor-disabled: not-allowed !default; // for forms and buttons
 
 //== Dropdowns
diff --git a/app/assets/stylesheets/active_admin/pages/_logged_out.scss b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
index 8cdc1565154..32225f2ba8b 100644
--- a/app/assets/stylesheets/active_admin/pages/_logged_out.scss
+++ b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
@@ -4,7 +4,7 @@ body.logged_out {
 
 #login {
   background-color: #fff;
-  border-radius: 4px;
+  border-radius: $border-radius-base;
   margin: 70px auto;
   padding: 15px;
   width: 500px;

From e41ec2224bbdfebc5d9a6e2dc84da5e4b49717d1 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 21 Apr 2015 19:39:19 -0400
Subject: [PATCH 111/170] Update blank_slate component to accept child elements

Now works pretty much the same as a Panel component. This way we can
use `blank_slate` with a block and specify whatever elements we like
rather than passing a content string (although that is still
supported). Now our dashboard template is much cleaner as we use the
built in component rather than hard code CSS and styles.
---
 lib/active_admin/views/components/blank_slate.rb | 16 ++++++++++++++--
 .../active_admin/install/templates/dashboard.rb  |  9 ++++-----
 spec/unit/views/components/blank_slate_spec.rb   |  4 ++--
 3 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/lib/active_admin/views/components/blank_slate.rb b/lib/active_admin/views/components/blank_slate.rb
index cf91fe972fc..1ffd11da3e9 100644
--- a/lib/active_admin/views/components/blank_slate.rb
+++ b/lib/active_admin/views/components/blank_slate.rb
@@ -8,8 +8,20 @@ def default_class_name
         'blank_slate_container'
       end
 
-      def build(content)
-        super(span(content.html_safe, class: "blank_slate"))
+      def build(content="")
+        @contents = div(content.html_safe, class: "blank_slate")
+      end
+
+      def add_child(child)
+        if @contents
+          @contents << child
+        else
+          super
+        end
+      end
+
+      def children?
+        @contents.children?
       end
 
     end
diff --git a/lib/generators/active_admin/install/templates/dashboard.rb b/lib/generators/active_admin/install/templates/dashboard.rb
index eae7baf0d70..f8e1cf3d435 100644
--- a/lib/generators/active_admin/install/templates/dashboard.rb
+++ b/lib/generators/active_admin/install/templates/dashboard.rb
@@ -3,11 +3,10 @@
   menu priority: 1, label: proc{ I18n.t("active_admin.dashboard") }
 
   content title: proc{ I18n.t("active_admin.dashboard") } do
-    div class: "blank_slate_container", id: "dashboard_default_message" do
-      span class: "blank_slate" do
-        span I18n.t("active_admin.dashboard_welcome.welcome")
-        small I18n.t("active_admin.dashboard_welcome.call_to_action")
-      end
+
+    blank_slate do
+      para I18n.t("active_admin.dashboard_welcome.welcome")
+      para small(I18n.t("active_admin.dashboard_welcome.call_to_action"))
     end
 
     # Here is an example of a simple dashboard with columns and panels.
diff --git a/spec/unit/views/components/blank_slate_spec.rb b/spec/unit/views/components/blank_slate_spec.rb
index 6bacd0b95ac..edd26f53798 100644
--- a/spec/unit/views/components/blank_slate_spec.rb
+++ b/spec/unit/views/components/blank_slate_spec.rb
@@ -5,7 +5,7 @@
   describe "#blank_slate" do
     subject do
       render_arbre_component do
-        blank_slate("There are no Posts yet. <a href=\"/posts/new\">Create one</a></span>")
+        blank_slate("There are no Posts yet. <a href=\"/posts/new\">Create one</a>")
       end
     end
 
@@ -21,7 +21,7 @@
 
     describe '#content' do
       subject { super().content }
-      it      { is_expected.to include '<span class="blank_slate">There are no Posts yet. <a href="/posts/new">Create one</a></span>' }
+      it      { is_expected.to include '<div class="blank_slate">There are no Posts yet. <a href="/posts/new">Create one</a></div>' }
     end
   end
 end

From 32846874721fae825d6d508e960397d0b937961d Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 21 Apr 2015 19:40:26 -0400
Subject: [PATCH 112/170] Apply button style to blank slate action on index

This is a much cleaner presentation. Display text in a paragraph so
button is below it but spaced out using our primary button style.
---
 features/index/index_blank_slate.feature | 12 ++++++++----
 lib/active_admin/views/pages/index.rb    |  4 ++--
 2 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/features/index/index_blank_slate.feature b/features/index/index_blank_slate.feature
index 2a8acfe901f..15eb70fd97e 100644
--- a/features/index/index_blank_slate.feature
+++ b/features/index/index_blank_slate.feature
@@ -13,7 +13,8 @@ Feature: Index Blank Slate
         end
       """
     Then I should not see a sortable table header
-    And I should see "There are no Posts yet. Create one"
+    And I should see "There are no Posts yet."
+    And I should see "Create one"
     And I should not see ".index_table"
     And I should not see pagination
     When I follow "Create one"
@@ -38,7 +39,8 @@ Feature: Index Blank Slate
         end
       end
       """
-    And I should see "There are no Posts yet. Create one"
+    And I should see "There are no Posts yet."
+    And I should see "Create one"
 
   Scenario: Viewing a index using blocks with no resources
     Given an index configuration of:
@@ -49,7 +51,8 @@ Feature: Index Blank Slate
         end
       end
       """
-    And I should see "There are no Posts yet. Create one"
+    And I should see "There are no Posts yet."
+    And I should see "Create one"
 
   Scenario: Viewing a blog with no resources
     Given an index configuration of:
@@ -58,7 +61,8 @@ Feature: Index Blank Slate
         index :as => :blog
       end
       """
-    And I should see "There are no Posts yet. Create one"
+    And I should see "There are no Posts yet."
+    And I should see "Create one"
 
   Scenario: Customizing the default table with no resources
     Given an index configuration of:
diff --git a/lib/active_admin/views/pages/index.rb b/lib/active_admin/views/pages/index.rb
index 3415de39638..b65722d8dd2 100644
--- a/lib/active_admin/views/pages/index.rb
+++ b/lib/active_admin/views/pages/index.rb
@@ -112,7 +112,7 @@ def find_index_renderer_class(klass)
         def render_blank_slate
           blank_slate_content = I18n.t("active_admin.blank_slate.content", resource_name: active_admin_config.plural_resource_label)
           if controller.action_methods.include?('new') && authorized?(ActiveAdmin::Auth::CREATE, active_admin_config.resource_class)
-            blank_slate_content = [blank_slate_content, blank_slate_link].compact.join(" ")
+            blank_slate_content = content_tag(:p, blank_slate_content) + blank_slate_link
           end
           insert_tag(view_factory.blank_slate, blank_slate_content)
         end
@@ -155,7 +155,7 @@ def blank_slate_link
         end
 
         def default_blank_slate_link
-          link_to(I18n.t("active_admin.blank_slate.link"), new_resource_path)
+          link_to(I18n.t("active_admin.blank_slate.link"), new_resource_path, class: 'button button-primary')
         end
       end
     end

From 682119de423155aa75fe6fd50e6acee6d41fd028 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 21 Apr 2015 19:43:46 -0400
Subject: [PATCH 113/170] Configure and clean up blank slate styles

---
 .../active_admin/components/_blank_slates.scss         | 10 +---------
 .../stylesheets/active_admin/mixins/_variables.scss    |  9 +++++++--
 .../active_admin/install/templates/dashboard.rb        |  4 ++--
 3 files changed, 10 insertions(+), 13 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_blank_slates.scss b/app/assets/stylesheets/active_admin/components/_blank_slates.scss
index 61310facab4..a6a85d38da6 100644
--- a/app/assets/stylesheets/active_admin/components/_blank_slates.scss
+++ b/app/assets/stylesheets/active_admin/components/_blank_slates.scss
@@ -3,16 +3,8 @@
 }
 
 .blank_slate {
-  color: $blank-slate-primary-color;
-  display: inline-block;
+  color: $blank-slate-color;
   font-size: 1.3em;
-  font-weight: $font-weight-bold;
-
-  small {
-    display: block;
-    font-size: 0.9em;
-    font-weight: $font-weight-normal;
-  }
 }
 
 .admin_dashboard .blank_slate,
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index b123eed75ca..7cd62ced265 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -14,7 +14,7 @@ $hover-menu-item-background: lighten($primary-color, 12%) !default; // renamed:
 $table-stripe-color: #f8f8f8 !default;
 $table-selected-color: #fcf8e3 !default;
 $error-color: #932419 !default;
-$blank-slate-primary-color: #AAA !default;
+$blank-slate-primary-color: #AAA !default;      // renamed: $blank-slate-color
 $breadcrumbs-color: #8a949e !default;           // renamed: $breadcrumb-color
 $breadcrumbs-separator-color: #aab2ba !default; // renamed: $breadcrumb-separator-color
 $required-field-marker-color: #aaa !default;
@@ -51,6 +51,8 @@ $line-height-base: 1.5 !default;
 
 $text-color: #323537 !default;
 
+$text-muted-color: #9aa2aa !default;
+
 $body-background-color: #fff !default;
 $body-font-size: $font-size-base !default;
 $body-font-weight: $font-weight-normal !default;
@@ -74,6 +76,10 @@ $padding-base-horizontal: 10px !default;
 $z-index-modal-backdrop: 1001 !default;
 $z-index-modal: 1002 !default;
 
+//== Blank Slate
+
+$blank-slate-color: $text-muted-color !default;
+
 //== Buttons
 
 $button-font-weight: $font-weight-bold !default;
@@ -202,6 +208,5 @@ $title-bar-heading-font-size: 1.9em !default;
 
 //== Typography
 
-$text-muted-color: #9aa2aa !default;
 $hr-border-color: darken($body-background-color, 15%) !default;
 $blockquote-color: lighten($text-color, 35%) !default;
diff --git a/lib/generators/active_admin/install/templates/dashboard.rb b/lib/generators/active_admin/install/templates/dashboard.rb
index f8e1cf3d435..7f6e517a16c 100644
--- a/lib/generators/active_admin/install/templates/dashboard.rb
+++ b/lib/generators/active_admin/install/templates/dashboard.rb
@@ -5,8 +5,8 @@
   content title: proc{ I18n.t("active_admin.dashboard") } do
 
     blank_slate do
-      para I18n.t("active_admin.dashboard_welcome.welcome")
-      para small(I18n.t("active_admin.dashboard_welcome.call_to_action"))
+      h4 I18n.t("active_admin.dashboard_welcome.welcome")
+      h5 I18n.t("active_admin.dashboard_welcome.call_to_action")
     end
 
     # Here is an example of a simple dashboard with columns and panels.

From 87af3f817e592d0f7a43c3adf4aa7c086a5bba5f Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 22 Apr 2015 01:50:52 -0400
Subject: [PATCH 114/170] Add button and button-primary class to Devise views

---
 app/assets/stylesheets/active_admin/pages/_logged_out.scss | 2 ++
 app/views/active_admin/devise/confirmations/new.html.erb   | 4 +++-
 app/views/active_admin/devise/passwords/edit.html.erb      | 4 +++-
 app/views/active_admin/devise/passwords/new.html.erb       | 4 +++-
 app/views/active_admin/devise/registrations/new.html.erb   | 4 +++-
 app/views/active_admin/devise/sessions/new.html.erb        | 4 +++-
 app/views/active_admin/devise/unlocks/new.html.erb         | 4 +++-
 7 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/pages/_logged_out.scss b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
index 32225f2ba8b..938a08e97ed 100644
--- a/app/assets/stylesheets/active_admin/pages/_logged_out.scss
+++ b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
@@ -28,5 +28,7 @@ body.logged_out {
   a {
     float: right;
     margin-top: -45px;
+    position: relative;
+    z-index: 2; // to make sure link is always above full width fieldset (e.g. forgot password page)
   }
 }
diff --git a/app/views/active_admin/devise/confirmations/new.html.erb b/app/views/active_admin/devise/confirmations/new.html.erb
index 0deba76f0eb..83cb1cb1b6a 100644
--- a/app/views/active_admin/devise/confirmations/new.html.erb
+++ b/app/views/active_admin/devise/confirmations/new.html.erb
@@ -7,7 +7,9 @@
       f.input :email
     end
     f.actions do
-      f.action :submit, label: t('active_admin.devise.resend_confirmation_instructions.submit'), button_html: { value: t('active_admin.devise.resend_confirmation_instructions.submit') }
+      f.action :submit,
+        label: t('active_admin.devise.resend_confirmation_instructions.submit'),
+        button_html: { class: 'button button-primary', value: t('active_admin.devise.resend_confirmation_instructions.submit') }
     end
   end %>
 
diff --git a/app/views/active_admin/devise/passwords/edit.html.erb b/app/views/active_admin/devise/passwords/edit.html.erb
index 31e185e41d1..339c4b55334 100644
--- a/app/views/active_admin/devise/passwords/edit.html.erb
+++ b/app/views/active_admin/devise/passwords/edit.html.erb
@@ -9,7 +9,9 @@
       f.input :reset_password_token, as: :hidden, input_html: { value: resource.reset_password_token }
     end
     f.actions do
-      f.action :submit, label: t('active_admin.devise.change_password.submit'), button_html: { value: t('active_admin.devise.change_password.submit') }
+      f.action :submit,
+        label: t('active_admin.devise.change_password.submit'),
+        button_html: { class: 'button button-primary', value: t('active_admin.devise.change_password.submit') }
     end
   end
   %>
diff --git a/app/views/active_admin/devise/passwords/new.html.erb b/app/views/active_admin/devise/passwords/new.html.erb
index df5c8b2b99c..110d9c99ca7 100644
--- a/app/views/active_admin/devise/passwords/new.html.erb
+++ b/app/views/active_admin/devise/passwords/new.html.erb
@@ -7,7 +7,9 @@
       f.input :email
     end
     f.actions do
-      f.action :submit, label: t('active_admin.devise.reset_password.submit'), button_html: { value: t('active_admin.devise.reset_password.submit') }
+      f.action :submit,
+        label: t('active_admin.devise.reset_password.submit'),
+        button_html: { class: 'button button-primary', value: t('active_admin.devise.reset_password.submit') }
     end
   end %>
 
diff --git a/app/views/active_admin/devise/registrations/new.html.erb b/app/views/active_admin/devise/registrations/new.html.erb
index 899c1f4881f..e05f607d77a 100644
--- a/app/views/active_admin/devise/registrations/new.html.erb
+++ b/app/views/active_admin/devise/registrations/new.html.erb
@@ -12,7 +12,9 @@
       f.input :password_confirmation, lable: t('active_admin.devise.password_confirmation.title')
     end
     f.actions do
-      f.action :submit, label: t('active_admin.devise.login.submit'), button_html: { value: t('active_admin.devise.sign_up.submit') }
+      f.action :submit,
+        label: t('active_admin.devise.login.submit'),
+        button_html: { class: 'button button-primary', value: t('active_admin.devise.sign_up.submit') }
     end
   end
   %>
diff --git a/app/views/active_admin/devise/sessions/new.html.erb b/app/views/active_admin/devise/sessions/new.html.erb
index 87ab60d50ea..923a15b9616 100644
--- a/app/views/active_admin/devise/sessions/new.html.erb
+++ b/app/views/active_admin/devise/sessions/new.html.erb
@@ -11,7 +11,9 @@
       f.input :remember_me, label: t('active_admin.devise.login.remember_me'), as: :boolean if devise_mapping.rememberable?
     end
     f.actions do
-      f.action :submit, label: t('active_admin.devise.login.submit'), button_html: { value: t('active_admin.devise.login.submit') }
+      f.action :submit,
+        label: t('active_admin.devise.login.submit'),
+        button_html: { class: 'button button-primary', value: t('active_admin.devise.login.submit') }
     end
   end
   %>
diff --git a/app/views/active_admin/devise/unlocks/new.html.erb b/app/views/active_admin/devise/unlocks/new.html.erb
index 84ed9518ed1..8ecf3805323 100644
--- a/app/views/active_admin/devise/unlocks/new.html.erb
+++ b/app/views/active_admin/devise/unlocks/new.html.erb
@@ -7,7 +7,9 @@
       f.input :email
     end
     f.actions do
-      f.action :submit, label: t('active_admin.devise.unlock.submit'), button_html: { value: t('active_admin.devise.unlock.submit') }
+      f.action :submit,
+        label: t('active_admin.devise.unlock.submit'),
+        button_html: { class: 'button button-primary', value: t('active_admin.devise.unlock.submit') }
     end
   end %>
 

From ff1c577abbbeed1e906888e2f5126aa0fc9594dd Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 22 Apr 2015 14:54:12 -0400
Subject: [PATCH 115/170] Update default theme with Flat UI and cleanup
 variables
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The previous color scheme didn’t feel very in sync so I’ve used the
Flat UI color theme here across the board. I’ve cleaned up variables so
we only have now the new scheme going forward. Variables that were
removed or renamed are now in a commented section at the top.
---
 .../stylesheets/active_admin/_base.scss       |   5 +-
 .../stylesheets/active_admin/_forms.scss      |   6 +-
 .../stylesheets/active_admin/_typography.scss |   6 +-
 .../active_admin/components/_date_picker.scss |   6 +-
 .../active_admin/components/_links.scss       |   4 +-
 .../active_admin/components/_tables.scss      |   2 +-
 .../active_admin/mixins/_variables.scss       | 128 ++++++++++--------
 .../active_admin/pages/_logged_out.scss       |   2 +-
 8 files changed, 85 insertions(+), 74 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_base.scss b/app/assets/stylesheets/active_admin/_base.scss
index f0617caa9e2..121dfb3cec1 100644
--- a/app/assets/stylesheets/active_admin/_base.scss
+++ b/app/assets/stylesheets/active_admin/_base.scss
@@ -38,7 +38,8 @@
 body {
   background: $body-background-color;
   color: $text-color;
-  font-family: $font-family-base;
-  font-size: $font-size-base;
+  font-family: $body-font-family;
+  font-size: $body-font-size;
+  font-weight: $body-font-weight;
   line-height: $line-height-base;
 }
diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 8ab0e011d8b..6e834275dbc 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -171,7 +171,7 @@ textarea {
   }
 
   .errors {
-    background-color: lighten($error-color, 60%);
+    background-color: lighten($error-color, 35%);
     border-radius: $border-radius-base;
     list-style-type: square;
     padding: 10px 10px 10px 25px;
@@ -189,7 +189,7 @@ textarea {
 
 // -------------------------------------- Sidebar Forms
 
-$sidebar-inner-content-width: $sidebar-width - ($section-padding * 2);
+$sidebar-inner-content-width: $sidebar-width - ($panel-body-padding * 2);
 
 .sidebar_section {
   select {
@@ -202,7 +202,7 @@ $sidebar-inner-content-width: $sidebar-width - ($section-padding * 2);
   input[type=url],
   input[type=tel],
   textarea {
-    width: $sidebar-inner-content-width - ($text-input-horizontal-padding * 2);
+    width: $sidebar-inner-content-width - ($padding-base-horizontal * 2);
   }
 }
 
diff --git a/app/assets/stylesheets/active_admin/_typography.scss b/app/assets/stylesheets/active_admin/_typography.scss
index e4665561345..86a3586a230 100644
--- a/app/assets/stylesheets/active_admin/_typography.scss
+++ b/app/assets/stylesheets/active_admin/_typography.scss
@@ -1,7 +1,7 @@
 h1, h2, h3, h4, h5, h6 {
-  color: $header-color;
-  font-family: $header-font-family;
-  font-weight: $header-font-weight;
+  color: $headings-color;
+  font-family: $headings-font-family;
+  font-weight: $headings-font-weight;
 }
 
 h1 {
diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index 39cb4ad9fad..9e62dcdb9e4 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -103,18 +103,18 @@
         padding: 6px 0;
 
         &:hover {
-          background-color: #eceef0;
+          background-color: darken(#ECF0F1, 5%);
         }
 
         &.ui-state-active,
         &.ui-state-active:hover {
-          background-color: #5a5f64;
+          background-color: lighten($primary-color, 10%);
           color: #fff;
         }
 
         &.ui-state-highlight,
         &.ui-state-highlight:hover { // today's date
-          background-color: #dbdddf;
+          background-color: darken(#ECF0F1, 5%);
         }
       }
     }
diff --git a/app/assets/stylesheets/active_admin/components/_links.scss b/app/assets/stylesheets/active_admin/components/_links.scss
index ffab04f40c5..b6e04e98499 100644
--- a/app/assets/stylesheets/active_admin/components/_links.scss
+++ b/app/assets/stylesheets/active_admin/components/_links.scss
@@ -4,7 +4,7 @@ a {
 
   &:hover,
   &:focus {
-    color: $link-color;
-    text-decoration: underline;
+    color: $link-hover-color;
+    text-decoration: $link-hover-decoration;
   }
 }
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 5226e589668..19c81d1d8cd 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -15,7 +15,7 @@ th, td {
 
 thead {
   th {
-    border-bottom: 2px solid darken($table-border-color, 10%);
+    border-bottom: 2px solid darken($table-border-color, 7%);
     vertical-align: bottom;
   }
 }
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 7cd62ced265..eccf2db3494 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -2,39 +2,47 @@
 // They can be overridden by prepending your own
 // to 'app/assets/stylesheets/active_admin.scss'.
 
-// Colors
-$body-background-color: #FFF !default;
-$primary-color: #5E6469 !default;
-$secondary-color: #f0f0f0 !default;
-$text-color: #323537 !default;
-$link-color: #38678b !default;
-$section-header-text-color: $primary-color !default; // renamed: $title-bar-color
-$current-menu-item-background: lighten($primary-color, 12%) !default; // renamed: $navbar-link-active-background-color
-$hover-menu-item-background: lighten($primary-color, 12%) !default; // renamed: $navbar-link-hover-background-color
-$table-stripe-color: #f8f8f8 !default;
-$table-selected-color: #fcf8e3 !default;
-$error-color: #932419 !default;
-$blank-slate-primary-color: #AAA !default;      // renamed: $blank-slate-color
-$breadcrumbs-color: #8a949e !default;           // renamed: $breadcrumb-color
-$breadcrumbs-separator-color: #aab2ba !default; // renamed: $breadcrumb-separator-color
-$required-field-marker-color: #aaa !default;
-$form-label-color: $section-header-text-color !default; // REMOVED
-$page-header-text-color: #cdcdcd !default;              // REMOVED
 
-// Sizes
-$border-width: 1px !default;                // REMOVED
-$horizontal-page-margin: 20px !default;
-$sidebar-width: 270px !default;
-$cell-padding: 5px 10px 3px 10px !default;    // renamed: $table-cell-padding
-$cell-horizontal-padding: 12px !default;      // REMOVED
-$section-padding: 15px !default;              // renamed: $panel-body-padding
-$text-input-horizontal-padding: 8px !default; // REMOVED
-$text-input-total-padding: $text-input-horizontal-padding * 2 + $border-width * 2 !default; // REMOVED
-$blank-slate-border: 1px dashed #DADADA !default;
+// Old variables have been either removed or renamed
+//
+// $secondary-color               -> REMOVED
+// $section-header-text-color     -> $title-bar-color
+// $current-menu-item-background  -> $navbar-link-active-background-color
+// $hover-menu-item-background    -> $navbar-link-hover-background-color
+// $blank-slate-primary-color     -> $blank-slate-color
+// $breadcrumbs-color             -> $breadcrumb-color
+// $breadcrumbs-separator-color   -> $breadcrumb-separator-color
+// $form-label-color              -> REMOVED
+// $page-header-text-color        -> REMOVED
+// $border-width                  -> REMOVED
+// $cell-padding                  -> $table-cell-padding
+// $cell-horizontal-padding       -> REMOVED
+// $section-padding               -> $panel-body-padding
+// $text-input-horizontal-padding -> REMOVED
+// $text-input-total-padding      -> REMOVED
+// $blank-slate-border            -> REMOVED
+
+
+// Color theme from Flat UI (color swatch section at http://designmodo.github.io/Flat-UI/)
+
 
+//== Scaffolding
 
+$primary-color: #34495E !default;
+$success-color: #2ECC71 !default;
+$warning-color: #F1C40F !default;
+$error-color: #E74C3C !default;
 
-// NEW VARIABLES
+$body-background-color: #fff !default;
+
+$text-color: #3F4C4D !default;
+$text-muted-color: #7F8C8D !default;
+
+$link-color: #2980B9 !default;
+$link-hover-color: darken(#2980B9, 5%) !default;
+$link-hover-decoration: underline !default;
+
+//== Typography
 
 $font-family-sans-serif: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif !default;
 $font-family-serif: Georgia, Cambria, "Times New Roman", Times, serif !default;
@@ -49,28 +57,25 @@ $font-size-base: 13px !default;
 
 $line-height-base: 1.5 !default;
 
-$text-color: #323537 !default;
-
-$text-muted-color: #9aa2aa !default;
-
-$body-background-color: #fff !default;
+$body-font-family: $font-family-base !default;
 $body-font-size: $font-size-base !default;
 $body-font-weight: $font-weight-normal !default;
 
-$header-font-family: inherit !default;
-$header-font-weight: inherit !default;
-$header-color: inherit !default;
+$headings-font-family: inherit !default;
+$headings-font-weight: inherit !default;
+$headings-color: inherit !default;
 
 //== Components
 
-$primary-color: #5E6469 !default;
-$secondary-color: #f0f0f0 !default;
-
 $border-radius-base: 0.25em !default;
 
 $padding-base-vertical: 6px !default;
 $padding-base-horizontal: 10px !default;
 
+$horizontal-page-margin: 20px !default;
+
+$sidebar-width: 270px !default;
+
 //== z-indexes
 
 $z-index-modal-backdrop: 1001 !default;
@@ -95,11 +100,13 @@ $button-primary-border-color: darken($primary-color, 5%) !default;
 //== Forms
 
 $input-background-color: #fff !default;
-$input-border-color: #c9d0d6 !default;
-$input-border-focus-color: #99a2aa !default;
+$input-border-color: lighten(#BDC3C7, 5%) !default;
+$input-border-focus-color: darken(#BDC3C7, 5%) !default;
 $input-border-radius: $border-radius-base !default;
 $input-color: $text-color !default;
 
+$required-field-marker-color: #aaa !default;
+
 $cursor-disabled: not-allowed !default; // for forms and buttons
 
 //== Dropdowns
@@ -119,6 +126,9 @@ $table-border-color: #e8e8e8 !default;
 $table-cell-padding: 8px !default;
 $table-condensed-cell-padding: 5px !default;
 
+$table-stripe-color: lighten(#ECF0F1, 4%) !default;
+$table-selected-color: #fcf9c1 !default;
+
 //== Badges
 
 $badge-color: #fff !default;
@@ -130,8 +140,8 @@ $badge-line-height: 1 !default;
 
 //== Breadcrumbs
 
-$breadcrumb-color: #8a949e !default;
-$breadcrumb-separator-color: #aab2ba !default;
+$breadcrumb-color: #7F8C8D !default;
+$breadcrumb-separator-color: #7F8C8D !default;
 $breadcrumb-separator: "/" !default;
 
 //== Flash Messages
@@ -139,14 +149,14 @@ $breadcrumb-separator: "/" !default;
 $flash-message-font-weight: $font-weight-bold !default;
 $flash-message-padding: 12px $horizontal-page-margin !default;
 
-$flash-message-default-background-color: #f7f1d3 !default;
-$flash-message-default-text-color: #cb9810 !default;
+$flash-message-default-background-color: $warning-color !default;
+$flash-message-default-text-color: #fff !default;
 
-$flash-message-notice-background-color: #ccdfcd !default;
-$flash-message-notice-text-color: #416347 !default;
+$flash-message-notice-background-color: $success-color !default;
+$flash-message-notice-text-color: #fff !default;
 
-$flash-message-error-background-color: #f1dcdc !default;
-$flash-message-error-text-color: #b33c33 !default;
+$flash-message-error-background-color: $error-color !default;
+$flash-message-error-text-color: #fff !default;
 
 //== Modals
 
@@ -164,19 +174,19 @@ $navbar-padding-horizontal: 10px !default;
 $navbar-padding-vertical: 10px !default;
 
 $navbar-color: #fff !default;
-$navbar-background-color: lighten($primary-color, 5%) !default;
+$navbar-background-color: $primary-color !default;
 
 $navbar-link-color: #fff !default;
 $navbar-link-hover-color: #fff !default;
-$navbar-link-hover-background-color: lighten($primary-color, 12%) !default;
+$navbar-link-hover-background-color: lighten($primary-color, 8%) !default;
 $navbar-link-active-color: #fff !default;
-$navbar-link-active-background-color: lighten($primary-color, 12%) !default;
+$navbar-link-active-background-color: lighten($primary-color, 8%) !default;
 
 //== Panels
 
-$panel-background-color: #f8f8f8 !default;
+$panel-background-color: lighten(#ECF0F1, 4%) !default;
 $panel-body-padding: 15px !default;
-$panel-heading-background-color: #e6e6e6 !default;
+$panel-heading-background-color: #ECF0F1 !default;
 $panel-heading-padding: 10px 15px !default;
 $panel-border-radius: $border-radius-base !default;
 
@@ -186,8 +196,8 @@ $status-tag-border-radius: $border-radius-base !default;
 $status-tag-padding: 0.2em 0.5em !default;
 
 $status-tag-color: #fff !default;
-$status-tag-no-background-color: #777 !default;
-$status-tag-yes-background-color: #6090DB !default;
+$status-tag-no-background-color: #7F8C8D !default;
+$status-tag-yes-background-color: #27AE60 !default;
 
 //== Tabs
 
@@ -201,7 +211,7 @@ $tabs-active-link-hover-color: $text-color !default;
 
 //== Title Bar
 
-$title-bar-background-color: #eaebec !default;
+$title-bar-background-color: lighten(#ECF0F1, 2%) !default;
 $title-bar-color: $text-color !default;
 
 $title-bar-heading-font-size: 1.9em !default;
@@ -209,4 +219,4 @@ $title-bar-heading-font-size: 1.9em !default;
 //== Typography
 
 $hr-border-color: darken($body-background-color, 15%) !default;
-$blockquote-color: lighten($text-color, 35%) !default;
+$blockquote-color: $text-muted-color !default;
diff --git a/app/assets/stylesheets/active_admin/pages/_logged_out.scss b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
index 938a08e97ed..7660abc75f5 100644
--- a/app/assets/stylesheets/active_admin/pages/_logged_out.scss
+++ b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
@@ -1,5 +1,5 @@
 body.logged_out {
-  background-color: #e8e9ea;
+  background-color: #ECF0F1;
 }
 
 #login {

From 6a15cdb6a2eb70177102180a0e394838284ad1c8 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 23 Apr 2015 15:44:52 -0400
Subject: [PATCH 116/170] Update unsupported_browser to use flash_warning class
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

We already have existing components to make it stand out so lets reuse
them. Also updated the “recommendation” localized message to just link
to browsehappy.com instead as that does the job.
---
 app/assets/stylesheets/active_admin/_base.scss      |  1 -
 .../stylesheets/active_admin/_typography.scss       |  4 ++--
 .../components/_unsupported_browser.scss            | 13 -------------
 config/locales/en.yml                               |  2 +-
 .../views/components/unsupported_browser.rb         |  4 +++-
 5 files changed, 6 insertions(+), 18 deletions(-)
 delete mode 100644 app/assets/stylesheets/active_admin/components/_unsupported_browser.scss

diff --git a/app/assets/stylesheets/active_admin/_base.scss b/app/assets/stylesheets/active_admin/_base.scss
index 121dfb3cec1..314b460dd7b 100644
--- a/app/assets/stylesheets/active_admin/_base.scss
+++ b/app/assets/stylesheets/active_admin/_base.scss
@@ -22,7 +22,6 @@
 @import "active_admin/components/panels";
 @import "active_admin/components/status_tags";
 @import "active_admin/components/table_tools";
-@import "active_admin/components/unsupported_browser";
 @import "active_admin/components/tabs";
 @import "active_admin/pages/logged_out";
 @import "active_admin/structure/footer";
diff --git a/app/assets/stylesheets/active_admin/_typography.scss b/app/assets/stylesheets/active_admin/_typography.scss
index 86a3586a230..d42dfb73f5f 100644
--- a/app/assets/stylesheets/active_admin/_typography.scss
+++ b/app/assets/stylesheets/active_admin/_typography.scss
@@ -29,12 +29,12 @@ h5, h6 {
 }
 
 p {
-  margin: 0 0 1.5em;
+  margin: 0 0 1em;
 }
 
 blockquote  {
   color: $blockquote-color;
-  margin: 1.5em;
+  margin: 1em;
 }
 
 pre {
diff --git a/app/assets/stylesheets/active_admin/components/_unsupported_browser.scss b/app/assets/stylesheets/active_admin/components/_unsupported_browser.scss
deleted file mode 100644
index 095f6434a34..00000000000
--- a/app/assets/stylesheets/active_admin/components/_unsupported_browser.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-.unsupported_browser {
-  background-color: #fae692;
-  color: #211e14;
-  padding: 10px 30px;
-
-  h1 {
-    font-size: 13px;
-  }
-
-  p {
-    margin-bottom: 0.5em;
-  }
-}
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 1ff4c976ea2..45386fe0c44 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -126,7 +126,7 @@ en:
         resend_confirmation_instructions: "Resend confirmation instructions"
     unsupported_browser:
       headline: "Please note that ActiveAdmin no longer supports Internet Explorer versions 8 or less."
-      recommendation: "We recommend upgrading to the latest <a href=\"http://windows.microsoft.com/ie\">Internet Explorer</a>, <a href=\"https://chrome.google.com/\">Google Chrome</a>, or <a href=\"https://mozilla.org/firefox/\">Firefox</a>."
+      recommendation: "We recommend that you <a href=\"http://browsehappy.com/\">upgrade your browser</a> to improve your experience."
       turn_off_compatibility_view: "If you are using IE 9 or later, make sure you <a href=\"http://windows.microsoft.com/en-US/windows7/webpages-look-incorrect-in-Internet-Explorer\">turn off \"Compatibility View\"</a>."
     access_denied:
       message: "You are not authorized to perform this action."
diff --git a/lib/active_admin/views/components/unsupported_browser.rb b/lib/active_admin/views/components/unsupported_browser.rb
index 3ee660fc317..87bf41e8498 100644
--- a/lib/active_admin/views/components/unsupported_browser.rb
+++ b/lib/active_admin/views/components/unsupported_browser.rb
@@ -2,7 +2,9 @@ module ActiveAdmin
   module Views
     class UnsupportedBrowser < Component
       def build
-        h1 I18n.t("active_admin.unsupported_browser.headline").html_safe
+        add_class 'flash flash_warning'
+
+        para I18n.t("active_admin.unsupported_browser.headline").html_safe
         para I18n.t("active_admin.unsupported_browser.recommendation").html_safe
         para I18n.t("active_admin.unsupported_browser.turn_off_compatibility_view").html_safe
       end

From 3555520c56cfae15288cbee5121929c227973057 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 23 Apr 2015 15:47:33 -0400
Subject: [PATCH 117/170] Don't specify hex colors anywhere but variables file

---
 app/assets/stylesheets/active_admin/_forms.scss      | 12 ++++++------
 app/assets/stylesheets/active_admin/_header.scss     |  2 +-
 .../stylesheets/active_admin/components/_tables.scss |  4 ++--
 .../stylesheets/active_admin/mixins/_buttons.scss    |  2 +-
 .../stylesheets/active_admin/mixins/_variables.scss  |  2 +-
 5 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 6e834275dbc..68f89a568bd 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -12,7 +12,7 @@ textarea {
   display: inline-block;
   outline: none;
   padding: $padding-base-vertical $padding-base-horizontal;
-  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
   width: calc(80% - #{($padding-base-horizontal * 2) + 2px});
 
   &:focus {
@@ -78,7 +78,7 @@ textarea {
 
     .has_many_container {
       h3 {
-        border-bottom: 1px solid #e8e8e8;
+        border-bottom: 1px solid darken($panel-background-color, 12%);
         margin-bottom: 20px;
       }
     }
@@ -86,7 +86,7 @@ textarea {
 
   // relative so the absolutely-positioned handle will fit
   .has_many_fields {
-    border-bottom: 1px solid #e8e8e8;
+    border-bottom: 1px solid darken($panel-background-color, 12%);
     margin-bottom: 15px;
 
     ol {
@@ -237,10 +237,10 @@ $date-range-filter-input-width: ($sidebar-inner-content-width / 2) - ($filter-fi
   &.filter_date_range {
     input {
       width: $date-range-filter-input-width;
-    }
 
-    input + input {
-      margin-left: 6px;
+      & + input {
+        margin-left: 6px;
+      }
     }
   }
 }
diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index f8bcd3af35d..bacb86a4702 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -39,7 +39,7 @@
         display: inline-block;
         padding: $navbar-padding-vertical $navbar-padding-horizontal;
         position: relative;
-        transition: background-color .15s, color .15s;
+        transition: background-color 0.15s, color 0.15s;
       }
 
       &.current > a {
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 19c81d1d8cd..bdec029d1e6 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -15,7 +15,7 @@ th, td {
 
 thead {
   th {
-    border-bottom: 2px solid darken($table-border-color, 7%);
+    border-bottom: 2px solid $table-border-color;
     vertical-align: bottom;
   }
 }
@@ -89,7 +89,7 @@ table.index_table {
     border-right: 1px solid $table-border-color;
 
     &:first-child {
-      border-right: 2px solid darken($table-border-color, 10%);
+      border-right: 2px solid $table-border-color;
     }
   }
 
diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index 7495f8a3f0a..040a0c112ac 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -8,7 +8,7 @@
   line-height: $line-height-base; // needed for input/button elements to match a.button size
   padding: $padding-base-vertical $padding-base-horizontal;
   text-decoration: none;
-  transition: background-color .15s, border-color .15s, color .15s;
+  transition: background-color 0.15s, border-color 0.15s, color 0.15s;
   white-space: nowrap;
 
   &:hover,
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index eccf2db3494..47dddbcdbae 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -122,7 +122,7 @@ $dropdown-link-hover-background-color: #e9e9e9 !default;
 
 //== Tables
 
-$table-border-color: #e8e8e8 !default;
+$table-border-color: darken($body-background-color, 12%) !default;
 $table-cell-padding: 8px !default;
 $table-condensed-cell-padding: 5px !default;
 

From 1d2d8ae07cba393c8497e41d9890e24152977ee0 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 23 Apr 2015 16:03:37 -0400
Subject: [PATCH 118/170] Update logged_out styles

Remove colors and use panel background instead. Will fit the default
theme better this way as we prefer a white background but content on a
colored background (panel).
---
 app/assets/stylesheets/active_admin/pages/_logged_out.scss | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/pages/_logged_out.scss b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
index 7660abc75f5..eeb19ad5c56 100644
--- a/app/assets/stylesheets/active_admin/pages/_logged_out.scss
+++ b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
@@ -1,9 +1,5 @@
-body.logged_out {
-  background-color: #ECF0F1;
-}
-
 #login {
-  background-color: #fff;
+  background-color: $panel-background-color;
   border-radius: $border-radius-base;
   margin: 70px auto;
   padding: 15px;

From 9ef595dcfc418ca58bcaa9177b07fab03a7999b5 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 23 Apr 2015 17:27:53 -0400
Subject: [PATCH 119/170] Fix failing unsupported_browser_spec

---
 app/assets/stylesheets/active_admin/components/_comments.scss | 2 +-
 spec/unit/views/components/unsupported_browser_spec.rb        | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_comments.scss b/app/assets/stylesheets/active_admin/components/_comments.scss
index 919ce4eed68..594ba4699da 100644
--- a/app/assets/stylesheets/active_admin/components/_comments.scss
+++ b/app/assets/stylesheets/active_admin/components/_comments.scss
@@ -1,6 +1,6 @@
 .active_admin_comment {
   margin-bottom: 25px;
-  max-width: 700px;
+  max-width: 45em;
 }
 
 .active_admin_comment_meta {
diff --git a/spec/unit/views/components/unsupported_browser_spec.rb b/spec/unit/views/components/unsupported_browser_spec.rb
index 1af3c129d2d..87519f4b6cc 100644
--- a/spec/unit/views/components/unsupported_browser_spec.rb
+++ b/spec/unit/views/components/unsupported_browser_spec.rb
@@ -15,7 +15,7 @@ def build_panel
 
   it "should render the panel" do
     expect(I18n).to receive(:t).and_return("headline", "recommendation" ,"turn_off_compatibility_view")
-    expect(build_panel.content.gsub(/\s+/, "")).to eq "<h1>headline</h1><p>recommendation</p><p>turn_off_compatibility_view</p>"
+    expect(build_panel.content.gsub(/\s+/, "")).to eq "<p>headline</p><p>recommendation</p><p>turn_off_compatibility_view</p>"
   end
 
   describe "ActiveAdmin::Views::Pages::Base behavior" do

From 39082c6cf71a42bb8faf2949124c92505e249602 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 23 Apr 2015 17:39:04 -0400
Subject: [PATCH 120/170] Configure date picker color styles

---
 .../active_admin/components/_date_picker.scss   | 17 ++++++++---------
 .../active_admin/mixins/_variables.scss         | 10 ++++++++++
 2 files changed, 18 insertions(+), 9 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index 9e62dcdb9e4..d6c6a1eeaad 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -15,9 +15,9 @@
 }
 
 .ui-datepicker-header {
-  background-color: $primary-color;
+  background-color: $date-picker-header-background-color;
   border-radius: $border-radius-base $border-radius-base 0 0;
-  color: #fff;
+  color: $date-picker-header-link-color;
   padding: 5px;
   position: relative; // for datepicker prev/next buttons
 }
@@ -25,7 +25,7 @@
 .ui-datepicker-prev,
 .ui-datepicker-next {
   bottom: 0;
-  color: #fff;
+  color: $date-picker-header-link-color;
   cursor: pointer;
   display: block;
   position: absolute;
@@ -34,7 +34,7 @@
 
   &:focus,
   &:hover {
-    color: #fff;
+    color: $date-picker-header-link-hover-color;
   }
 
   // base for arrows
@@ -72,7 +72,7 @@
 }
 
 .ui-datepicker-calendar {
-  background-color: #fff;
+  background-color: $date-picker-calendar-background-color;
   border: none;
   margin-bottom: 0;
 
@@ -103,18 +103,17 @@
         padding: 6px 0;
 
         &:hover {
-          background-color: darken(#ECF0F1, 5%);
+          background-color: $date-picker-calendar-link-hover-background-color;
         }
 
         &.ui-state-active,
         &.ui-state-active:hover {
-          background-color: lighten($primary-color, 10%);
-          color: #fff;
+          background-color: $date-picker-calendar-link-active-background-color;
         }
 
         &.ui-state-highlight,
         &.ui-state-highlight:hover { // today's date
-          background-color: darken(#ECF0F1, 5%);
+          background-color: $date-picker-calendar-link-hover-background-color;;
         }
       }
     }
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 47dddbcdbae..e4c1229a170 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -216,6 +216,16 @@ $title-bar-color: $text-color !default;
 
 $title-bar-heading-font-size: 1.9em !default;
 
+//== Date Picker
+
+$date-picker-header-background-color: $primary-color;
+$date-picker-header-link-color: #fff !default;
+$date-picker-header-link-hover-color: #fff !default;
+
+$date-picker-calendar-background-color: #fff !default;
+$date-picker-calendar-link-hover-background-color: #ECF0F1 !default;
+$date-picker-calendar-link-active-background-color: darken(#ECF0F1, 10%) !default;
+
 //== Typography
 
 $hr-border-color: darken($body-background-color, 15%) !default;

From 2a43cf3c53137060606061e55d0fbbdeb8f0fc3a Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 23 Apr 2015 17:44:04 -0400
Subject: [PATCH 121/170] Configure remaining z-indexes

No need to configure others as they are just relative to the same
component whereas these appear above others.
---
 app/assets/stylesheets/active_admin/_header.scss              | 4 ++--
 .../stylesheets/active_admin/components/_dropdown_menu.scss   | 2 +-
 app/assets/stylesheets/active_admin/mixins/_variables.scss    | 2 ++
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index bacb86a4702..47bfd4e0c06 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -53,7 +53,7 @@
       }
 
       &.has_nested:hover > a {
-        z-index: 960; // so top part of sub menu box-shadow doesn't appear over this link
+        z-index: $z-index-navbar; // so top part of sub menu box-shadow doesn't appear over this link
       }
 
       &:hover ul {
@@ -68,7 +68,7 @@
         min-width: 175px;
         padding: 5px 0;
         position: absolute;
-        z-index: 950;
+        z-index: $z-index-navbar;
 
         li {
           a {
diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index eec3dfc48e1..e7f714c10c0 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -27,7 +27,7 @@
   padding: 5px 0;
   position: absolute;
   top: 100%;
-  z-index: 950;
+  z-index: $z-index-dropdown;
 
   > li {
     > a {
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index e4c1229a170..14b12ab1c83 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -78,6 +78,8 @@ $sidebar-width: 270px !default;
 
 //== z-indexes
 
+$z-index-dropdown: 1000 !default;
+$z-index-navbar: 1000 !default;
 $z-index-modal-backdrop: 1001 !default;
 $z-index-modal: 1002 !default;
 

From 28b6b9854acbc2e8c7bb401864d6c64d4e4a88e9 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 29 Apr 2015 15:16:44 -0400
Subject: [PATCH 122/170] Remove splat and use explicit build arguments

No need to use splat now as the build method signature is much simpler
now. Just a status and options. Removed type from overload docs comment
too as that was removed in an earlier commit. All tests green with this
change.
---
 lib/active_admin/views/components/status_tag.rb | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/lib/active_admin/views/components/status_tag.rb b/lib/active_admin/views/components/status_tag.rb
index 00cc18376c8..e6ae56d0168 100644
--- a/lib/active_admin/views/components/status_tag.rb
+++ b/lib/active_admin/views/components/status_tag.rb
@@ -14,7 +14,7 @@ def default_class_name
         'status_tag'
       end
 
-      # @overload status_tag(status, type = nil, options = {})
+      # @overload status_tag(status, options = {})
       #   @param [String] status the status to display. One of the span classes will be an underscored version of the status.
       #   @param [Hash] options
       #   @option options [String] :class to override the default class
@@ -30,9 +30,7 @@ def default_class_name
       #   status_tag('active', class: 'important', id: 'status_123', label: 'on')
       #   # => <span class='status_tag active important' id='status_123'>on</span>
       #
-      def build(*args)
-        options = args.extract_options!
-        status = args[0]
+      def build(status, options = {})
         label = options.delete(:label)
         classes = options.delete(:class)
         status = convert_to_boolean_status(status)

From af0bf349b34d8291427877b83f6dffdcdd14674f Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 30 Apr 2015 14:54:12 -0400
Subject: [PATCH 123/170] Clean up print styles

---
 .../stylesheets/active_admin/print.scss       | 289 ++++++------------
 1 file changed, 98 insertions(+), 191 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/print.scss b/app/assets/stylesheets/active_admin/print.scss
index fa549e7a555..6d68b12ee6b 100644
--- a/app/assets/stylesheets/active_admin/print.scss
+++ b/app/assets/stylesheets/active_admin/print.scss
@@ -2,7 +2,12 @@
 
 @import "active_admin/mixins/variables";
 
-// Set colors used elsewhere
+$body-background-color: #fff;
+
+$font-family-sans-serif: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif !default;
+$font-size-base: 13px;
+$line-height-base: 1.5;
+
 $primary-color: black;
 $text-color: black;
 
@@ -13,14 +18,12 @@ $text-color: black;
 @import "active_admin/typography";
 
 body {
-  font-family: Helvetica, Arial, sans-serif;
-  line-height: 150%;
-  font-size: 72%;
-  background: #fff;
-  width: 99%;
-  margin: 0;
-  padding: .5%;
+  background-color: #fff;
   color: $text-color;
+  font-family: $font-family-sans-serif;
+  font-size: $font-size-base;
+  line-height: $line-height-base;
+  margin: 0;
 }
 
 a {
@@ -28,85 +31,71 @@ a {
   text-decoration: none;
 }
 
-h3 {
-  font-weight: bold;
-  margin-bottom: .5em;
-}
-
-// Header
-#header {
-  float: left;
-
-  #tabs, .tabs, #utility_nav {
-    display: none;
-  }
-
-  h1{
-    font-weight: bold;
-  }
-}
-
-.flashes {
+// Hidden
+.unsupported_browser,
+.main-navbar,
+.flash,
+.breadcrumb,
+.title-bar-actions,
+.panel-heading-actions,
+td .empty,
+.member_link,
+#index_footer,
+.pagination_information,
+.comments form,
+input[type=file],
+form .password,
+form .hidden,
+form .actions,
+#filters_sidebar_section,
+#footer {
   display: none;
 }
 
-#title_bar {
-  float: right;
-
-  h2 {
-    line-height: 2em;
-    margin: 0;
-  }
-
-  .breadcrumb, #titlebar_right {
-    display: none;
-  }
-}
-
 // Content
 #active_admin_content {
-  border-top: thick solid black;
-  clear: both;
   margin-top: 2em;
-  padding-top: 3em;
-}
-
-// Footer
-#footer {
-  display: none;
 }
 
 // Tables
 .table_tools {
-  ul {
-    padding: 0;
-    margin: 0;
+  ul, li {
     list-style-type: none;
+    margin: 0;
+    padding: 0;
+  }
 
-    li {
-      display: none;
-      padding: 0;
-      margin-bottom: 1em;
-
-      &.scope.selected, &.index.selected {
-        display: block;
+  li {
+    display: none;
+  }
 
-        &:before {
-          content: "Showing ";
-        }
+  .scope.selected,
+  .index.selected {
+    display: block;
+    margin-bottom: 1em;
 
-        a {
-          font-weight: bold;
-        }
+    &:before {
+      content: "Showing ";
+    }
 
-        span {
-          display: inline-block;
-          font-weight: normal;
-          font-size: .9em;
-        }
-      }
+    a {
+      font-weight: bold;
     }
+  }
+}
 
+.badge {
+  display: inline-block;
+  font-weight: bold;
+  line-height: 1;
+  vertical-align: baseline;
+
+  &:before {
+    content: '(';
+  }
+
+  &:after {
+    content: ')';
   }
 }
 
@@ -115,48 +104,23 @@ table {
   text-align: left;
   width: 100%;
 
-  thead {
-    display: table-header-group;
-
-    th {
-      background: none;
-      border-bottom: medium solid black;
-      font-weight: bold;
-
-      a{
-        text-decoration: none;
-      }
-    }
-  }
-
-  th, td {
-    padding: .5em 1em;
-
-    .member_link {
-      display: none;
-    }
+  tr {
+    page-break-inside: avoid;
   }
 
-  td {
-    border-bottom: thin solid black;
+  th {
+    font-weight: bold;
   }
 
-  tr{
-    page-break-inside: avoid;
+  th, td {
+    border-bottom: 1px solid black;
+    padding: 8px;
+    vertical-align: top;
   }
 }
 
-// Index
-#index_footer, .pagination_information {
-  display: none;
-}
-
 .index_grid {
   td {
-    border: none;
-    text-align: center;
-    vertical-align: middle;
-
     img {
       max-width: 1in;
     }
@@ -165,62 +129,22 @@ table {
 
 // Show
 .panel {
-  border-bottom: thick solid #ccc;
   margin-bottom: 3em;
   padding-bottom: 2em;
   page-break-inside: avoid;
-
-  &:last-child {
-    border-bottom: none;
-  }
 }
 
-.comments {
-  form {
-    display: none;
-  }
-
-  .active_admin_comment {
-    border-top: thin solid black;
-    padding-top: 1em;
-
-    .active_admin_comment_meta {
-      h4 {
-        font-size: 1em;
-        font-weight: bold;
-        float: left;
-        margin-right: .5em;
-        margin-bottom: 0;
-      }
+.active_admin_comment {
+  border-bottom: 1px solid black;
+  padding: 1em 0;
 
-      span {
-        font-size: .9em;
-        font-style: italic;
-        vertical-align: top;
-      }
-    }
-
-    .active_admin_comment_body {
-      clear: both;
-      margin-bottom: 1em;
-    }
+  .active_admin_comment_meta {
+    margin-bottom: 0.7em;
   }
 }
 
-
 // Attribute Tables
 .attributes_table {
-  border-top: medium solid black;
-
-  th {
-    border-bottom: thin solid black;
-    vertical-align: top;
-
-    &:after {
-      content: ':';
-    }
-  }
-
   td {
     img {
       max-height: 4in;
@@ -229,61 +153,44 @@ table {
   }
 }
 
-// Sidebars
-#filters_sidebar_section {
-  display: none;
-}
-
 // Forms
-form {
-  fieldset {
-    border-top: thick solid #ccc;
-    padding-top: 2em;
-    margin-bottom: 2em;
+fieldset {
+  border: none;
+  margin: 0 0 2em 0;
+  padding: 2em 0 0 0;
 
-    &:last-child {
-      border-bottom: none;
-    }
+  fieldset {
+    border: 1px solid black;
+    padding: 1em;
   }
+}
 
-  .buttons, abbr {
-    display: none;
-  }
-  ol {
+form {
+  ol, li {
     list-style-type: none;
-    padding: 0;
     margin: 0;
+    padding: 0;
+  }
 
-    li{
-      border-top: thin solid black;
-      margin: 0;
-      padding: 1em 0;
-      overflow: hidden;
-
-      &.password, &.hidden {
-        display: none;
-      }
+  li {
+    padding: 1em 0;
 
-      label {
-        font-weight: bold;
-        float: left;
-        width: 20%;
-      }
+    > label,
+    legend label {
+      font-weight: bold;
+    }
 
-      input, textarea, select {
-        background: none;
-        border: 0;
-        font: Arial, Helvetica, sans-serif;
-      }
+    abbr[title] {
+      border-bottom: none;
+      font-weight: normal;
 
-      input[type=file] {
-        display: none;
+      &:before {
+        content: ' (required)';
       }
+    }
 
+    input, textarea, select {
+      width: calc(100% - #{($padding-base-horizontal * 2) + 2px});
     }
   }
 }
-
-.unsupported_browser {
-  display: none;
-}

From 57c9f06268c5d7d4d0453210092b4295d7e0837a Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 15 Jul 2015 18:24:59 -0400
Subject: [PATCH 124/170] Lowercase hex colors to fix Hound warnings

---
 .../active_admin/mixins/_variables.scss       | 42 +++++++++----------
 1 file changed, 21 insertions(+), 21 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 14b12ab1c83..3eb1ced3c36 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -28,18 +28,18 @@
 
 //== Scaffolding
 
-$primary-color: #34495E !default;
-$success-color: #2ECC71 !default;
-$warning-color: #F1C40F !default;
-$error-color: #E74C3C !default;
+$primary-color: #34495e !default;
+$success-color: #2ecc71 !default;
+$warning-color: #f1c40f !default;
+$error-color: #e74c3c !default;
 
 $body-background-color: #fff !default;
 
-$text-color: #3F4C4D !default;
-$text-muted-color: #7F8C8D !default;
+$text-color: #3f4c4d !default;
+$text-muted-color: #7f8c8d !default;
 
-$link-color: #2980B9 !default;
-$link-hover-color: darken(#2980B9, 5%) !default;
+$link-color: #2980b9 !default;
+$link-hover-color: darken(#2980b9, 5%) !default;
 $link-hover-decoration: underline !default;
 
 //== Typography
@@ -102,8 +102,8 @@ $button-primary-border-color: darken($primary-color, 5%) !default;
 //== Forms
 
 $input-background-color: #fff !default;
-$input-border-color: lighten(#BDC3C7, 5%) !default;
-$input-border-focus-color: darken(#BDC3C7, 5%) !default;
+$input-border-color: lighten(#bdc3c7, 5%) !default;
+$input-border-focus-color: darken(#bdc3c7, 5%) !default;
 $input-border-radius: $border-radius-base !default;
 $input-color: $text-color !default;
 
@@ -116,7 +116,7 @@ $cursor-disabled: not-allowed !default; // for forms and buttons
 $caret-width-base: 4px !default;
 
 $dropdown-background-color: #fff !default;
-$dropdown-border-color: rgba(0, 0, 0, .15) !default;
+$dropdown-border-color: rgba(0, 0, 0, 0.15) !default;
 
 $dropdown-link-color: $text-color !default;
 $dropdown-link-hover-color: darken($text-color, 5%) !default;
@@ -128,7 +128,7 @@ $table-border-color: darken($body-background-color, 12%) !default;
 $table-cell-padding: 8px !default;
 $table-condensed-cell-padding: 5px !default;
 
-$table-stripe-color: lighten(#ECF0F1, 4%) !default;
+$table-stripe-color: lighten(#ecf0f1, 4%) !default;
 $table-selected-color: #fcf9c1 !default;
 
 //== Badges
@@ -142,8 +142,8 @@ $badge-line-height: 1 !default;
 
 //== Breadcrumbs
 
-$breadcrumb-color: #7F8C8D !default;
-$breadcrumb-separator-color: #7F8C8D !default;
+$breadcrumb-color: #7f8c8d !default;
+$breadcrumb-separator-color: #7f8c8d !default;
 $breadcrumb-separator: "/" !default;
 
 //== Flash Messages
@@ -186,9 +186,9 @@ $navbar-link-active-background-color: lighten($primary-color, 8%) !default;
 
 //== Panels
 
-$panel-background-color: lighten(#ECF0F1, 4%) !default;
+$panel-background-color: lighten(#ecf0f1, 4%) !default;
 $panel-body-padding: 15px !default;
-$panel-heading-background-color: #ECF0F1 !default;
+$panel-heading-background-color: #ecf0f1 !default;
 $panel-heading-padding: 10px 15px !default;
 $panel-border-radius: $border-radius-base !default;
 
@@ -198,8 +198,8 @@ $status-tag-border-radius: $border-radius-base !default;
 $status-tag-padding: 0.2em 0.5em !default;
 
 $status-tag-color: #fff !default;
-$status-tag-no-background-color: #7F8C8D !default;
-$status-tag-yes-background-color: #27AE60 !default;
+$status-tag-no-background-color: #7f8c8d !default;
+$status-tag-yes-background-color: #27ae60 !default;
 
 //== Tabs
 
@@ -213,7 +213,7 @@ $tabs-active-link-hover-color: $text-color !default;
 
 //== Title Bar
 
-$title-bar-background-color: lighten(#ECF0F1, 2%) !default;
+$title-bar-background-color: lighten(#ecf0f1, 2%) !default;
 $title-bar-color: $text-color !default;
 
 $title-bar-heading-font-size: 1.9em !default;
@@ -225,8 +225,8 @@ $date-picker-header-link-color: #fff !default;
 $date-picker-header-link-hover-color: #fff !default;
 
 $date-picker-calendar-background-color: #fff !default;
-$date-picker-calendar-link-hover-background-color: #ECF0F1 !default;
-$date-picker-calendar-link-active-background-color: darken(#ECF0F1, 10%) !default;
+$date-picker-calendar-link-hover-background-color: #ecf0f1 !default;
+$date-picker-calendar-link-active-background-color: darken(#ecf0f1, 10%) !default;
 
 //== Typography
 

From 7b7ff9196c27939b04f8152cb589ee02216b5af8 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Wed, 15 Jul 2015 18:32:27 -0400
Subject: [PATCH 125/170] Remove popovers CSS (no longer used)

Not sure how this made its way back but must have happened after
rebasing. I had deleted it on my feature branch.
---
 .../active_admin/components/_popovers.scss    | 119 ------------------
 1 file changed, 119 deletions(-)
 delete mode 100644 app/assets/stylesheets/active_admin/components/_popovers.scss

diff --git a/app/assets/stylesheets/active_admin/components/_popovers.scss b/app/assets/stylesheets/active_admin/components/_popovers.scss
deleted file mode 100644
index 46af6b01a67..00000000000
--- a/app/assets/stylesheets/active_admin/components/_popovers.scss
+++ /dev/null
@@ -1,119 +0,0 @@
-.popover {
-  display: inline-block;
-  position: absolute;
-  background-color: white;
-  padding: 2px;
-  box-shadow: rgba(0,0,0,0.4) 0 1px 3px, lighten($primary-color, 15%) 0px 1px 0px 0px inset;
-  background-color: $primary-color;
-  border: solid 1px darken($primary-color, 10%);
-  border-top-color: darken($primary-color, 4%);
-  border-bottom-color: darken($primary-color, 17%);
-
-  border-radius: 4px;
-
-  .popover_nipple{
-
-    // The nipple's border
-    content: "";
-    position: absolute;
-    top: -6px;
-    display: block;
-    width: 0;
-    height: 0;
-    border-width: 0 6px 6px;
-    border-style: solid;
-    border-color: darken($primary-color, 4%) transparent;
-    z-index: 100;
-
-    // The nipple's inner shadow
-
-    &:before {
-      content: ' ';
-      position: absolute;
-      width: 0;
-      height: 0;
-      border-width: 0 5px 5px;
-      border-style: solid;
-      border-color: lighten($primary-color, 15%) transparent;
-      left: -5px;
-      top: 1px;
-    }
-
-    // The nipple's background color
-
-    &:after {
-      content: ' ';
-      position: absolute;
-      width: 0;
-      height: 0;
-      border-width: 0 5px 5px;
-      border-style: solid;
-      border-color: lighten($primary-color, 4%) transparent;
-      left: -5px;
-      top: 2px;
-    }
-  }
-
-  .popover_contents {
-    display: block;
-    background-color: #FFF;
-    border: solid 1px darken($primary-color, 10%);
-    box-shadow: lighten($primary-color, 5%) 0px 1px 0px 0px;
-    border-radius: 3px;
-    margin: 0;
-    overflow: hidden;
-    padding: 8px;
-  }
-
-}
-
-//-------------------------------------- Popover with action list
-
-.popover {
-  ul.popover_contents {
-    list-style-type: none;
-    padding: 0;
-
-    li {
-      display: block;
-      border-bottom: solid 1px #ebebeb;
-
-      a {
-        display: block;
-        box-sizing: padding-box;
-        font-size: 0.95em;
-        font-weight: bold;
-        padding: 7px 16px 5px;
-        text-decoration: none;
-        text-align: center;
-
-        &:hover {
-          background-color: #75a1c2;
-          color: #FFF;
-        }
-
-        &:active {
-          background-color: #608cb4;
-          color: #FFF;
-        }
-
-      }
-
-      &:first-child {
-        a {
-          border-top-left-radius: 2px;
-          border-top-right-radius: 2px;
-        }
-
-      }
-
-      &:last-child {
-        a {
-          border-bottom-left-radius: 2px;
-          border-bottom-right-radius: 2px;
-        }
-        border: none;
-      }
-    }
-  }
-}

From cc629140ee0778a22083a83685d450c5ba8d7c51 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 16 Jul 2015 09:26:22 -0400
Subject: [PATCH 126/170] Fix what hound warnings we can for print stylesheet

---
 .../stylesheets/active_admin/print.scss       | 23 +++++++++++--------
 1 file changed, 14 insertions(+), 9 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/print.scss b/app/assets/stylesheets/active_admin/print.scss
index 6d68b12ee6b..9d65db74d75 100644
--- a/app/assets/stylesheets/active_admin/print.scss
+++ b/app/assets/stylesheets/active_admin/print.scss
@@ -59,7 +59,8 @@ form .actions,
 
 // Tables
 .table_tools {
-  ul, li {
+  ul,
+  li {
     list-style-type: none;
     margin: 0;
     padding: 0;
@@ -91,11 +92,11 @@ form .actions,
   vertical-align: baseline;
 
   &:before {
-    content: '(';
+    content: "(";
   }
 
   &:after {
-    content: ')';
+    content: ")";
   }
 }
 
@@ -112,7 +113,8 @@ table {
     font-weight: bold;
   }
 
-  th, td {
+  th,
+  td {
     border-bottom: 1px solid black;
     padding: 8px;
     vertical-align: top;
@@ -166,7 +168,8 @@ fieldset {
 }
 
 form {
-  ol, li {
+  ol,
+  li {
     list-style-type: none;
     margin: 0;
     padding: 0;
@@ -185,12 +188,14 @@ form {
       font-weight: normal;
 
       &:before {
-        content: ' (required)';
+        content: " (required)";
       }
     }
+  }
 
-    input, textarea, select {
-      width: calc(100% - #{($padding-base-horizontal * 2) + 2px});
-    }
+  input,
+  textarea,
+  select {
+    width: calc(100% - #{($padding-base-horizontal * 2) + 2px});
   }
 }

From af2ddec941a4dbeb2d1a7591ab8595c890a0bade Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 16 Jul 2015 09:26:36 -0400
Subject: [PATCH 127/170] Apply basic alignment to modal dialog form labels

---
 .../stylesheets/active_admin/components/_modal_dialog.scss     | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
index df0a0d5db79..479eef3e14d 100644
--- a/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
+++ b/app/assets/stylesheets/active_admin/components/_modal_dialog.scss
@@ -23,7 +23,10 @@
   }
 
   label {
+    display: block;
+    float: left;
     margin-right: 10px;
+    width: 20%;
   }
 
   form,

From a998251c0ab7d6f0032155fe66edd9607b97826e Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 16 Jul 2015 09:39:34 -0400
Subject: [PATCH 128/170] Configure keyword colors in print stylesheet

---
 app/assets/stylesheets/active_admin/print.scss | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/print.scss b/app/assets/stylesheets/active_admin/print.scss
index 9d65db74d75..90d3c2a2d77 100644
--- a/app/assets/stylesheets/active_admin/print.scss
+++ b/app/assets/stylesheets/active_admin/print.scss
@@ -11,6 +11,9 @@ $line-height-base: 1.5;
 $primary-color: black;
 $text-color: black;
 
+$table-border-color: black;
+$fieldset-border-color: black;
+
 // Normalize
 @import "active_admin/normalize";
 
@@ -18,7 +21,7 @@ $text-color: black;
 @import "active_admin/typography";
 
 body {
-  background-color: #fff;
+  background-color: $body-background-color;
   color: $text-color;
   font-family: $font-family-sans-serif;
   font-size: $font-size-base;
@@ -115,7 +118,7 @@ table {
 
   th,
   td {
-    border-bottom: 1px solid black;
+    border-bottom: 1px solid $table-border-color;
     padding: 8px;
     vertical-align: top;
   }
@@ -137,12 +140,11 @@ table {
 }
 
 .active_admin_comment {
-  border-bottom: 1px solid black;
   padding: 1em 0;
+}
 
-  .active_admin_comment_meta {
-    margin-bottom: 0.7em;
-  }
+.active_admin_comment_meta {
+  margin-bottom: 0.7em;
 }
 
 // Attribute Tables
@@ -162,7 +164,7 @@ fieldset {
   padding: 2em 0 0 0;
 
   fieldset {
-    border: 1px solid black;
+    border: 1px solid $fieldset-border-color;
     padding: 1em;
   }
 }

From ef7d13b21200e9a635ac218335ff8a0adaa87c9a Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 7 Aug 2015 14:19:40 -0400
Subject: [PATCH 129/170] Fix issue where index table extended underneath
 sidebar

---
 .../stylesheets/active_admin/structure/_main_structure.scss | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/app/assets/stylesheets/active_admin/structure/_main_structure.scss b/app/assets/stylesheets/active_admin/structure/_main_structure.scss
index 25d2c03f1e0..0e4e0fc152a 100644
--- a/app/assets/stylesheets/active_admin/structure/_main_structure.scss
+++ b/app/assets/stylesheets/active_admin/structure/_main_structure.scss
@@ -1,6 +1,12 @@
 #active_admin_content {
   @include clearfix;
   padding: $horizontal-page-margin;
+
+  // so index table and filters scroll horizontally
+  &.with_sidebar {
+    display: table;
+    width: 100%;
+  }
 }
 
 #main_content_wrapper {

From 45a1bfb61287cbb13c8dcfb7d2f1d84963f4572d Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Fri, 7 Aug 2015 14:26:12 -0400
Subject: [PATCH 130/170] Simplify form row styles and variables for widths
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Now setting a max-width on form rows so they don’t extend the full
width. Provide variables for setting form label and input width while
DRYing up styles around that. Fixed styles on base errors (these are
shown above the form, not inline).
---
 .../stylesheets/active_admin/_forms.scss      | 30 +++++++++++--------
 .../active_admin/components/_tables.scss      |  4 +--
 .../active_admin/mixins/_variables.scss       |  5 +++-
 .../active_admin/pages/_logged_out.scss       |  7 ++---
 4 files changed, 26 insertions(+), 20 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 68f89a568bd..67edf62313c 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -13,7 +13,7 @@ textarea {
   outline: none;
   padding: $padding-base-vertical $padding-base-horizontal;
   transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
-  width: calc(80% - #{($padding-base-horizontal * 2) + 2px});
+  width: calc(#{$form-input-width} - #{($padding-base-horizontal * 2) + 2px});
 
   &:focus {
     border: 1px solid $input-border-focus-color;
@@ -34,13 +34,14 @@ textarea {
 
   .input {
     margin-bottom: 15px;
+    max-width: 600px;
   }
 
   .label {
     display: block;
     float: left;
     font-weight: $font-weight-bold;
-    width: 20%;
+    width: $form-label-width;
 
     abbr {
       border: none;
@@ -60,7 +61,7 @@ textarea {
 
   fieldset {
     border: 0;
-    margin: 0 0 20px 0;
+    margin: 0;
     padding: 0;
     position: relative; // for abosolute positioning sub fieldset legends for choices/fragments
 
@@ -84,6 +85,10 @@ textarea {
     }
   }
 
+  > fieldset {
+    margin: 0 0 20px 0;
+  }
+
   // relative so the absolutely-positioned handle will fit
   .has_many_fields {
     border-bottom: 1px solid darken($panel-background-color, 12%);
@@ -121,8 +126,12 @@ textarea {
   .choices-group,
   .fragments-group {
     float: left;
-    padding: 0 0 0 20%;
-    width: 74%;
+  }
+
+  .choices-group,
+  .fragments-group,
+  .boolean label {
+    padding-left: $form-label-width;
   }
 
   .choice,
@@ -148,17 +157,14 @@ textarea {
   }
 
   .boolean label {
-    padding-left: 20%;
     padding-right: 10px;
-    width: 80%;
   }
 
   // HINTS and ERRORS
 
   .inline-hints,
-  .inline-errors,
-  .errors {
-    margin: 0.3em 0 0 20%;
+  .inline-errors {
+    margin: 0.3em 0 0 $form-label-width;
   }
 
   .inline-hints {
@@ -174,8 +180,8 @@ textarea {
     background-color: lighten($error-color, 35%);
     border-radius: $border-radius-base;
     list-style-type: square;
-    padding: 10px 10px 10px 25px;
-    width: calc(80% - 22px);
+    margin-bottom: 10px;
+    padding: 10px 10px 10px 28px;
   }
 
   // Buttons
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index bdec029d1e6..8ab27e4c110 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -94,7 +94,7 @@ table.index_table {
   }
 
   th {
-    width: 150px;
+    width: 180px;
   }
 
   td .empty {
@@ -106,5 +106,5 @@ table.index_table {
 }
 
 .sidebar_section .attributes_table th {
-  width: 50px;
+  width: 80px;
 }
diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index 3eb1ced3c36..d9e91674ec5 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -70,7 +70,7 @@ $headings-color: inherit !default;
 $border-radius-base: 0.25em !default;
 
 $padding-base-vertical: 6px !default;
-$padding-base-horizontal: 10px !default;
+$padding-base-horizontal: 12px !default;
 
 $horizontal-page-margin: 20px !default;
 
@@ -111,6 +111,9 @@ $required-field-marker-color: #aaa !default;
 
 $cursor-disabled: not-allowed !default; // for forms and buttons
 
+$form-label-width: 30%;
+$form-input-width: 70%;
+
 //== Dropdowns
 
 $caret-width-base: 4px !default;
diff --git a/app/assets/stylesheets/active_admin/pages/_logged_out.scss b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
index eeb19ad5c56..de04bf95304 100644
--- a/app/assets/stylesheets/active_admin/pages/_logged_out.scss
+++ b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
@@ -12,12 +12,9 @@
   fieldset.inputs {
     background-color: transparent;
     margin-bottom: 0;
-    padding: 0;
 
-    input[type=text],
-    input[type=email],
-    input[type=password] {
-      width: 79%;
+    ol {
+      padding: 15px 0;
     }
   }
 

From 3ff17f22425faded891d0b3024f8810cf50c3120 Mon Sep 17 00:00:00 2001
From: Joel Clay <ra3don92@gmail.com>
Date: Mon, 10 Aug 2015 19:45:39 -0400
Subject: [PATCH 131/170] moving normalize lib into vendor

---
 {app => vendor}/assets/stylesheets/active_admin/_normalize.css | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename {app => vendor}/assets/stylesheets/active_admin/_normalize.css (100%)

diff --git a/app/assets/stylesheets/active_admin/_normalize.css b/vendor/assets/stylesheets/active_admin/_normalize.css
similarity index 100%
rename from app/assets/stylesheets/active_admin/_normalize.css
rename to vendor/assets/stylesheets/active_admin/_normalize.css

From ba3a90d230fa1bd10434e92f13a4442f2a062d5d Mon Sep 17 00:00:00 2001
From: Joel Clay <ra3don92@gmail.com>
Date: Mon, 10 Aug 2015 20:03:12 -0400
Subject: [PATCH 132/170] updating hound style guide

---
 .scss-style.yml | 145 ++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 145 insertions(+)
 create mode 100644 .scss-style.yml

diff --git a/.scss-style.yml b/.scss-style.yml
new file mode 100644
index 00000000000..334b0da0526
--- /dev/null
+++ b/.scss-style.yml
@@ -0,0 +1,145 @@
+scss_files: "app/assets/styleshheets/*.scss"
+linters:
+  BangFormat:
+    enabled: true
+    space_before_bang: true
+    space_after_bang: false
+  BorderZero:
+    enabled: false
+    convention: zero
+  ColorKeyword:
+    enabled: true
+    severity: warning
+  ColorVariable:
+    enabled: true
+  Comment:
+    enabled: true
+  DebugStatement:
+    enabled: true
+  DeclarationOrder:
+    enabled: true
+  DuplicateProperty:
+    enabled: true
+  ElsePlacement:
+    enabled: true
+    style: same_line
+  EmptyLineBetweenBlocks:
+    enabled: true
+    ignore_single_line_blocks: true
+  EmptyRule:
+    enabled: true
+  FinalNewline:
+    enabled: true
+    present: true
+  HexLength:
+    enabled: false
+    style: short
+  HexNotation:
+    enabled: true
+    style: lowercase
+  HexValidation:
+    enabled: true
+  IdSelector:
+    enabled: true
+  ImportantRule:
+    enabled: true
+  ImportPath:
+    enabled: true
+    leading_underscore: false
+    filename_extension: false
+  Indentation:
+    enabled: true
+    allow_non_nested_indentation: false
+    character: space
+    width: 2
+  LeadingZero:
+    enabled: true
+    style: include_zero
+  MergeableSelector:
+    enabled: true
+    force_nesting: true
+  NameFormat:
+    enabled: true
+    allow_leading_underscore: true
+    convention: hyphenated_lowercase
+  NestingDepth:
+    enabled: true
+    max_depth: 4
+    severity: warning
+  PlaceholderInExtend:
+    enabled: false
+  PropertyCount:
+    enabled: true
+    include_nested: false
+    max_properties: 10
+  PropertySortOrder:
+    enabled: true
+    ignore_unspecified: false
+    severity: warning
+    separate_groups: false
+  PropertySpelling:
+    enabled: true
+    extra_properties: []
+  QualifyingElement:
+    enabled: true
+    allow_element_with_attribute: false
+    allow_element_with_class: false
+    allow_element_with_id: false
+    severity: warning
+  SelectorDepth:
+    enabled: true
+    max_depth: 2
+    severity: warning
+  SelectorFormat:
+    enabled: true
+    convention: hyphenated_lowercase
+  Shorthand:
+    enabled: true
+    severity: warning
+  SingleLinePerProperty:
+    enabled: true
+    allow_single_line_rule_sets: true
+  SingleLinePerSelector:
+    enabled: true
+  SpaceAfterComma:
+    enabled: true
+  SpaceAfterPropertyColon:
+    enabled: true
+    style: one_space
+  SpaceAfterPropertyName:
+    enabled: true
+  SpaceBeforeBrace:
+    enabled: true
+    style: space
+    allow_single_line_padding: false
+  SpaceBetweenParens:
+    enabled: true
+    spaces: 0
+  StringQuotes:
+    enabled: true
+    style: double_quotes
+  TrailingSemicolon:
+    enabled: true
+  TrailingZero:
+    enabled: false
+  UnnecessaryMantissa:
+    enabled: true
+  UnnecessaryParentReference:
+    enabled: true
+  UrlFormat:
+    enabled: true
+  UrlQuotes:
+    enabled: true
+  VariableForProperty:
+    enabled: false
+    properties: []
+  VendorPrefixes:
+    enabled: true
+    identifier_list: bourbon
+    include: []
+    exclude: []
+  ZeroUnit:
+    enabled: true
+    severity: warning
+  Compass::PropertyWithMixin:
+    enabled: false

From 17ed4b9ff51f431d4b23f0a04449c343a376fc6e Mon Sep 17 00:00:00 2001
From: Joel Clay <ra3don92@gmail.com>
Date: Mon, 10 Aug 2015 21:54:07 -0400
Subject: [PATCH 133/170] [hound fixes] underscore -> dashes

---
 .../stylesheets/active_admin/_forms.scss      |  5 ++--
 .../active_admin/components/_buttons.scss     |  2 +-
 .../active_admin/components/_pagination.scss  |  2 +-
 .../active_admin/components/_tables.scss      |  2 +-
 .../stylesheets/active_admin/print.scss       | 22 +++++++-------
 .../active_admin/structure/_footer.scss       |  2 +-
 docs/3-index-pages/index-as-table.md          |  2 +-
 features/index/index_as_block.feature         |  2 +-
 features/index/index_as_table.feature         |  4 +--
 features/index/switch_index_view.feature      | 13 ++++----
 .../step_definitions/action_link_steps.rb     |  5 ++--
 features/step_definitions/attribute_steps.rb  |  4 +--
 features/step_definitions/format_steps.rb     |  2 +-
 .../step_definitions/member_link_steps.rb     |  4 +--
 features/step_definitions/sidebar_steps.rb    |  6 ++--
 features/support/selectors.rb                 |  2 +-
 lib/active_admin/component.rb                 |  5 ++++
 lib/active_admin/sidebar_section.rb           |  2 +-
 .../views/components/paginated_collection.rb  |  4 +--
 lib/active_admin/views/index_as_table.rb      |  4 +--
 spec/unit/page_spec.rb                        |  2 +-
 .../views/components/attributes_table_spec.rb |  4 +--
 .../components/paginated_collection_spec.rb   | 30 +++++++++----------
 .../views/components/sidebar_section_spec.rb  |  6 ++--
 24 files changed, 69 insertions(+), 67 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 67edf62313c..64ed9aabfa2 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -22,7 +22,8 @@ textarea {
 }
 
 .formtastic {
-  ol, ul {
+  ol,
+  ul {
     list-style: none;
     margin: 0;
     padding: 0;
@@ -197,7 +198,7 @@ textarea {
 
 $sidebar-inner-content-width: $sidebar-width - ($panel-body-padding * 2);
 
-.sidebar_section {
+.sidebar-section {
   select {
     width: $sidebar-inner-content-width;
   }
diff --git a/app/assets/stylesheets/active_admin/components/_buttons.scss b/app/assets/stylesheets/active_admin/components/_buttons.scss
index 8bbbb001a38..a06110cbac2 100644
--- a/app/assets/stylesheets/active_admin/components/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/components/_buttons.scss
@@ -1,4 +1,4 @@
-a.member_link {
+a.member-link {
   margin-right: 7px;
   white-space: nowrap;
 }
diff --git a/app/assets/stylesheets/active_admin/components/_pagination.scss b/app/assets/stylesheets/active_admin/components/_pagination.scss
index e7eeb526d6f..24bccc6707a 100644
--- a/app/assets/stylesheets/active_admin/components/_pagination.scss
+++ b/app/assets/stylesheets/active_admin/components/_pagination.scss
@@ -23,7 +23,7 @@
   }
 }
 
-.pagination_information {
+.pagination-information {
   color: $text-muted-color;
   float: right;
   margin-top: 2px; // match pagination link top padding so both appear vertically aligned
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 8ab27e4c110..1b27a1f364e 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -105,6 +105,6 @@ table.index_table {
   }
 }
 
-.sidebar_section .attributes_table th {
+.sidebar-section .attributes_table th {
   width: 80px;
 }
diff --git a/app/assets/stylesheets/active_admin/print.scss b/app/assets/stylesheets/active_admin/print.scss
index 90d3c2a2d77..f164fa1a9c5 100644
--- a/app/assets/stylesheets/active_admin/print.scss
+++ b/app/assets/stylesheets/active_admin/print.scss
@@ -1,4 +1,4 @@
-/* Active Admin Print Stylesheet */
+// Active Admin Print Stylesheet
 
 @import "active_admin/mixins/variables";
 
@@ -8,11 +8,11 @@ $font-family-sans-serif: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif
 $font-size-base: 13px;
 $line-height-base: 1.5;
 
-$primary-color: black;
-$text-color: black;
+$primary-color: #000000;
+$text-color: #000000;
 
-$table-border-color: black;
-$fieldset-border-color: black;
+$table-border-color: #000000;
+$fieldset-border-color: #000000;
 
 // Normalize
 @import "active_admin/normalize";
@@ -35,22 +35,22 @@ a {
 }
 
 // Hidden
-.unsupported_browser,
+.unsupported-browser,
 .main-navbar,
 .flash,
 .breadcrumb,
 .title-bar-actions,
 .panel-heading-actions,
 td .empty,
-.member_link,
-#index_footer,
-.pagination_information,
+.member-link,
+.index-footer,
+.pagination-information,
 .comments form,
 input[type=file],
 form .password,
 form .hidden,
 form .actions,
-#filters_sidebar_section,
+#filters-sidebar-section,
 #footer {
   display: none;
 }
@@ -148,7 +148,7 @@ table {
 }
 
 // Attribute Tables
-.attributes_table {
+.attributes-table {
   td {
     img {
       max-height: 4in;
diff --git a/app/assets/stylesheets/active_admin/structure/_footer.scss b/app/assets/stylesheets/active_admin/structure/_footer.scss
index 46d6e3b3103..5cbb15f7ebc 100644
--- a/app/assets/stylesheets/active_admin/structure/_footer.scss
+++ b/app/assets/stylesheets/active_admin/structure/_footer.scss
@@ -4,6 +4,6 @@
 }
 
 // -------------------------------------- Index Footer (Under Table)
-#index_footer {
+.index-footer {
   @include clearfix;
 }
diff --git a/docs/3-index-pages/index-as-table.md b/docs/3-index-pages/index-as-table.md
index 676cee8535f..75b51ed2068 100644
--- a/docs/3-index-pages/index-as-table.md
+++ b/docs/3-index-pages/index-as-table.md
@@ -74,7 +74,7 @@ index do
   selectable_column
   column :title
   actions do |post|
-    item "Preview", admin_preview_post_path(post), class: "member_link"
+    item "Preview", admin_preview_post_path(post), class: "member-link"
   end
 end
 ```
diff --git a/features/index/index_as_block.feature b/features/index/index_as_block.feature
index ce06ac46e88..efdd9fc6469 100644
--- a/features/index/index_as_block.feature
+++ b/features/index/index_as_block.feature
@@ -12,4 +12,4 @@ Feature: Index as Block
         end
       end
       """
-    Then I should see "Hello World from Block" within ".index_as_block"
+    Then I should see "Hello World from Block" within ".index-as-block"
diff --git a/features/index/index_as_table.feature b/features/index/index_as_table.feature
index 8aeab738590..3d64a2213c9 100644
--- a/features/index/index_as_table.feature
+++ b/features/index/index_as_table.feature
@@ -116,7 +116,7 @@ Feature: Index as Table
         index do
           column :category
           actions do |resource|
-            link_to 'Custom Action', edit_admin_post_path(resource), :class => 'member_link'
+            link_to 'Custom Action', edit_admin_post_path(resource), :class => 'member-link'
           end
         end
       end
@@ -136,7 +136,7 @@ Feature: Index as Table
         index do
           column :category
           actions :defaults => false do |resource|
-            link_to 'Custom Action', edit_admin_post_path(resource), :class => 'member_link'
+            link_to 'Custom Action', edit_admin_post_path(resource), :class => 'member-link'
           end
         end
       end
diff --git a/features/index/switch_index_view.feature b/features/index/switch_index_view.feature
index f06494a14fb..4374acd7899 100644
--- a/features/index/switch_index_view.feature
+++ b/features/index/switch_index_view.feature
@@ -17,7 +17,7 @@ Feature: Switch Index View
       end
     end
     """
-  Then I should see "Hello World from Table" within ".index_as_table"
+  Then I should see "Hello World from Table" within ".index-as-table"
 
   Scenario: Show default Page Presenter when default is specified
     Given a post with the title "Hello World from Table" exists
@@ -32,7 +32,7 @@ Feature: Switch Index View
         end
       end
       """
-    Then I should see "Hello World from Table" within ".index_as_table"
+    Then I should see "Hello World from Table" within ".index-as-table"
 
   Scenario: Show links to different page views
     Given a post with the title "Hello World from Table" exists
@@ -47,7 +47,7 @@ Feature: Switch Index View
         end
       end
       """
-    Then I should see "Hello World from Table" within ".index_as_table"
+    Then I should see "Hello World from Table" within ".index-as-table"
     And I should see a link to "Table"
     And I should see a link to "List"
 
@@ -65,9 +65,6 @@ Feature: Switch Index View
         end
       end
       """
-    Then I should see "My body is awesome" within ".index_as_table"
+    Then I should see "My body is awesome" within ".index-as-table"
     When I click "List"
-    Then I should not see "My body is awesome" within ".index_as_block"
-
-
-
+    Then I should not see "My body is awesome" within ".index-as-block"
diff --git a/features/step_definitions/action_link_steps.rb b/features/step_definitions/action_link_steps.rb
index f7c5524f506..e02e2c29cd3 100644
--- a/features/step_definitions/action_link_steps.rb
+++ b/features/step_definitions/action_link_steps.rb
@@ -1,9 +1,9 @@
 Then /^I should see a member link to "([^"]*)"$/ do |name|
-  expect(page).to have_css('a.member_link', text: name)
+  expect(page).to have_css('a.member-link', text: name)
 end
 
 Then /^I should not see a member link to "([^"]*)"$/ do |name|
-  %{Then I should not see "#{name}" within "a.member_link"}
+  %{Then I should not see "#{name}" within "a.member-link"}
 end
 
 Then /^I should see the actions column with the class "([^"]*)" and the title "([^"]*)"$/ do |klass, title|
@@ -17,4 +17,3 @@
 Then /^I should not see a dropdown menu item to "([^"]*)"$/ do |name|
   %{Then I should not see "#{name}" within "ul.dropdown-menu li a"}
 end
-
diff --git a/features/step_definitions/attribute_steps.rb b/features/step_definitions/attribute_steps.rb
index a865b08f51c..0d2868ded9a 100644
--- a/features/step_definitions/attribute_steps.rb
+++ b/features/step_definitions/attribute_steps.rb
@@ -4,7 +4,7 @@
 end
 
 Then /^I should see the attribute "([^"]*)" with a nicely formatted datetime$/ do |title|
-  text = all(".attributes_table th:contains('#{title}') ~ td").first.text
+  text = all(".attributes-table th:contains('#{title}') ~ td").first.text
   expect(text).to match /\w+ \d{1,2}, \d{4} \d{2}:\d{2}/
 end
 
@@ -14,5 +14,5 @@
 end
 
 Then /^I should not see the attribute "([^"]*)"$/ do |title|
-  expect(page).to_not have_css '.attributes_table th', text: title
+  expect(page).to_not have_css '.attributes-table th', text: title
 end
diff --git a/features/step_definitions/format_steps.rb b/features/step_definitions/format_steps.rb
index 65327d6b177..791523e8fc8 100644
--- a/features/step_definitions/format_steps.rb
+++ b/features/step_definitions/format_steps.rb
@@ -6,7 +6,7 @@
 
 Then /^I should( not)? see a link to download "([^"]*)"$/ do |negate, format|
   method = negate ? :to_not : :to
-  expect(page).send method, have_css("#index_footer a", text: format)
+  expect(page).send method, have_css(".index-footer a", text: format)
 end
 
 # Check first rows of the displayed CSV.
diff --git a/features/step_definitions/member_link_steps.rb b/features/step_definitions/member_link_steps.rb
index 70bcc85b322..48188b842c0 100644
--- a/features/step_definitions/member_link_steps.rb
+++ b/features/step_definitions/member_link_steps.rb
@@ -1,7 +1,7 @@
 Then /^I should see an action item button "([^"]*)"$/ do |content|
-  expect(page).to have_css '.action_items a', text: content
+  expect(page).to have_css '.action-items a', text: content
 end
 
 Then /^I should not see an action item button "([^"]*)"$/ do |content|
-  expect(page).to_not have_css '.action_items', text: content
+  expect(page).to_not have_css '.action-items', text: content
 end
diff --git a/features/step_definitions/sidebar_steps.rb b/features/step_definitions/sidebar_steps.rb
index 2f345a80cae..c872ad5f93e 100644
--- a/features/step_definitions/sidebar_steps.rb
+++ b/features/step_definitions/sidebar_steps.rb
@@ -1,13 +1,13 @@
 Then /^I should see a sidebar titled "([^"]*)"$/ do |title|
-  expect(page).to have_css '.sidebar_section h3', text: title
+  expect(page).to have_css '.sidebar-section h3', text: title
 end
 
 Then /^I should not see a sidebar titled "([^"]*)"$/ do |title|
   title = title.tr(' ', '').underscore
-  sidebars = page.all :css, "##{title}_sidebar_section"
+  sidebars = page.all :css, "##{title}-sidebar-section"
   expect(sidebars.count).to eq 0
 end
 
 Then(/^I should see a sidebar titled "(.*?)" above sidebar titled "(.*?)"$/) do |top_title, bottom_title|
-  expect(page).to have_css %Q(.sidebar_section:contains('#{top_title}') + .sidebar_section:contains('#{bottom_title}'))
+  expect(page).to have_css %Q(.sidebar-section:contains('#{top_title}') + .sidebar-section:contains('#{bottom_title}'))
 end
diff --git a/features/support/selectors.rb b/features/support/selectors.rb
index 26526291079..e973712185c 100644
--- a/features/support/selectors.rb
+++ b/features/support/selectors.rb
@@ -27,7 +27,7 @@ def selector_for(locator)
       [:css, "table.index_grid"]
 
     when /^the "([^"]*)" sidebar$/
-      [:css, "##{$1.tr(" ", '').underscore}_sidebar_section"]
+      [:css, "##{$1.tr(" ", '').parameterize}-sidebar-section"]
 
     # This allows you to provide a quoted selector as the scope
     # for "within" steps as was previously the default for the
diff --git a/lib/active_admin/component.rb b/lib/active_admin/component.rb
index 8343552f612..691b063ff69 100644
--- a/lib/active_admin/component.rb
+++ b/lib/active_admin/component.rb
@@ -1,5 +1,10 @@
 module ActiveAdmin
   class Component < Arbre::Component
 
+    # Override default Arbre behavior and use - instead of _
+    # By default, add a css class named after the ruby class
+    def default_class_name
+      self.class.name.demodulize.underscore.dasherize
+    end
   end
 end
diff --git a/lib/active_admin/sidebar_section.rb b/lib/active_admin/sidebar_section.rb
index 67fde3d91e0..accaf0539bd 100644
--- a/lib/active_admin/sidebar_section.rb
+++ b/lib/active_admin/sidebar_section.rb
@@ -12,7 +12,7 @@ def initialize(name, options = {}, &block)
 
     # The id gets used for the div in the view
     def id
-      "#{name.downcase.underscore}_sidebar_section".parameterize
+      "#{name.downcase.parameterize}-sidebar-section".parameterize
     end
 
     # The title gets displayed within the section in the view
diff --git a/lib/active_admin/views/components/paginated_collection.rb b/lib/active_admin/views/components/paginated_collection.rb
index b7f66d7ff3a..ed54b278834 100644
--- a/lib/active_admin/views/components/paginated_collection.rb
+++ b/lib/active_admin/views/components/paginated_collection.rb
@@ -65,10 +65,10 @@ def add_child(*args, &block)
       protected
 
       def build_pagination_with_formats(options)
-        div id: "index_footer" do
+        div class: "index-footer" do
           build_per_page_select if @per_page.is_a?(Array)
           build_pagination
-          div(page_entries_info(options).html_safe, class: "pagination_information")
+          div(page_entries_info(options).html_safe, class: "pagination-information")
 
           download_links = @download_links.is_a?(Proc) ? instance_exec(&@download_links) : @download_links
 
diff --git a/lib/active_admin/views/index_as_table.rb b/lib/active_admin/views/index_as_table.rb
index 0e32338b3b0..f9364e083a0 100644
--- a/lib/active_admin/views/index_as_table.rb
+++ b/lib/active_admin/views/index_as_table.rb
@@ -71,7 +71,7 @@ module Views
     #   selectable_column
     #   column :title
     #   actions do |post|
-    #     item "Preview", admin_preview_post_path(post), class: "member_link"
+    #     item "Preview", admin_preview_post_path(post), class: "member-link"
     #   end
     # end
     # ```
@@ -334,7 +334,7 @@ def actions(options = {}, &block)
               end
             else
               table_actions do
-                defaults(resource, css_class: :member_link) if defaults
+                defaults(resource, css_class: 'member-link') if defaults
                 if block_given?
                   block_result = instance_exec(resource, &block)
                   text_node block_result unless block_result.is_a? Arbre::Element
diff --git a/spec/unit/page_spec.rb b/spec/unit/page_spec.rb
index 3c487b2753c..fe32b1fe130 100644
--- a/spec/unit/page_spec.rb
+++ b/spec/unit/page_spec.rb
@@ -70,7 +70,7 @@ def config(options = {})
       expect(config.action_items?).to eq false
     end
 
-    it "should not have any sidebar_sections" do
+    it "should not have any sidebar-sections" do
       expect(config.sidebar_sections?).to eq false
     end
 
diff --git a/spec/unit/views/components/attributes_table_spec.rb b/spec/unit/views/components/attributes_table_spec.rb
index 0d393b994c0..29535615f11 100644
--- a/spec/unit/views/components/attributes_table_spec.rb
+++ b/spec/unit/views/components/attributes_table_spec.rb
@@ -60,9 +60,9 @@
       context context_title do
         let(:table) { instance_eval &table_decleration }
 
-        it "should render a div wrapper with the class '.attributes_table'" do
+        it "should render a div wrapper with the class '.attributes-table'" do
           expect(table.tag_name).to eq 'div'
-          expect(table.attr(:class)).to include('attributes_table')
+          expect(table.attr(:class)).to include('attributes-table')
         end
 
         it "should add id and type class" do
diff --git a/spec/unit/views/components/paginated_collection_spec.rb b/spec/unit/views/components/paginated_collection_spec.rb
index 7c54f82e0cb..b88bf709944 100644
--- a/spec/unit/views/components/paginated_collection_spec.rb
+++ b/spec/unit/views/components/paginated_collection_spec.rb
@@ -35,7 +35,7 @@ def paginated_collection(*args)
     let(:pagination){ paginated_collection collection }
 
     it "should set :collection as the passed in collection" do
-      expect(pagination.find_by_class('pagination_information').first.content).to eq "Displaying <b>all 3</b> posts"
+      expect(pagination.find_by_class('pagination-information').first.content).to eq "Displaying <b>all 3</b> posts"
     end
 
     it "should raise error if collection has no pagination scope" do
@@ -100,7 +100,7 @@ def paginated_collection(*args)
       let(:pagination) { paginated_collection(collection, entry_name: "message") }
 
       it "should use :entry_name as the collection name" do
-        expect(pagination.find_by_class('pagination_information').first.content).to eq "Displaying <b>1</b> message"
+        expect(pagination.find_by_class('pagination-information').first.content).to eq "Displaying <b>1</b> message"
       end
     end
 
@@ -108,7 +108,7 @@ def paginated_collection(*args)
       let(:pagination) { paginated_collection(collection, entry_name: "message") }
 
       it "should use :entry_name as the collection name" do
-        expect(pagination.find_by_class('pagination_information').first.content).to eq "Displaying <b>all 3</b> messages"
+        expect(pagination.find_by_class('pagination-information').first.content).to eq "Displaying <b>all 3</b> messages"
       end
     end
 
@@ -121,7 +121,7 @@ def paginated_collection(*args)
       let(:pagination) { paginated_collection(collection, entry_name: "singular", entries_name: "plural") }
 
       it "should use :entry_name as the collection name" do
-        expect(pagination.find_by_class('pagination_information').first.content).to eq "Displaying <b>1</b> singular"
+        expect(pagination.find_by_class('pagination-information').first.content).to eq "Displaying <b>1</b> singular"
       end
     end
 
@@ -129,7 +129,7 @@ def paginated_collection(*args)
       let(:pagination) { paginated_collection(collection, entry_name: "singular", entries_name: "plural") }
 
       it "should use :entries_name as the collection name" do
-        expect(pagination.find_by_class('pagination_information').first.content).to eq "Displaying <b>all 3</b> plural"
+        expect(pagination.find_by_class('pagination-information').first.content).to eq "Displaying <b>all 3</b> plural"
       end
     end
 
@@ -140,23 +140,23 @@ def paginated_collection(*args)
       end
 
       it "should use 'post' as the collection name when there is no I18n translation" do
-        expect(pagination.find_by_class('pagination_information').first.content).to eq "Displaying <b>1</b> post"
+        expect(pagination.find_by_class('pagination-information').first.content).to eq "Displaying <b>1</b> post"
       end
 
       it "should use 'Singular' as the collection name when there is an I18n translation" do
         allow(I18n).to receive(:translate) { "Singular" }
-        expect(pagination.find_by_class('pagination_information').first.content).to eq "Displaying <b>1</b> Singular"
+        expect(pagination.find_by_class('pagination-information').first.content).to eq "Displaying <b>1</b> Singular"
       end
     end
 
     context "when omitting :entry_name with multiple items" do
       it "should use 'posts' as the collection name when there is no I18n translation" do
-        expect(pagination.find_by_class('pagination_information').first.content).to eq "Displaying <b>all 3</b> posts"
+        expect(pagination.find_by_class('pagination-information').first.content).to eq "Displaying <b>all 3</b> posts"
       end
 
       it "should use 'Plural' as the collection name when there is an I18n translation" do
         allow(I18n).to receive(:translate) { "Plural" }
-        expect(pagination.find_by_class('pagination_information').first.content).to eq "Displaying <b>all 3</b> Plural"
+        expect(pagination.find_by_class('pagination-information').first.content).to eq "Displaying <b>all 3</b> Plural"
       end
     end
 
@@ -167,7 +167,7 @@ def paginated_collection(*args)
       end
 
       it "should display 'No entries found'" do
-        expect(pagination.find_by_class('pagination_information').first.content).to eq "No entries found"
+        expect(pagination.find_by_class('pagination-information').first.content).to eq "No entries found"
       end
     end
 
@@ -178,7 +178,7 @@ def paginated_collection(*args)
       end
 
       it "should display proper message (including number and not hash)" do
-        expect(pagination.find_by_class('pagination_information').first.content).to eq "Displaying <b>all 2</b> posts"
+        expect(pagination.find_by_class('pagination-information').first.content).to eq "Displaying <b>all 2</b> posts"
       end
     end
 
@@ -189,7 +189,7 @@ def paginated_collection(*args)
       end
 
       it "should display proper message (including number and not hash)" do
-        expect(pagination.find_by_class('pagination_information').first.content.gsub('&nbsp;',' ')).
+        expect(pagination.find_by_class('pagination-information').first.content.gsub('&nbsp;',' ')).
           to eq "Displaying posts <b>1 - 2</b> of <b>3</b> in total"
       end
     end
@@ -200,7 +200,7 @@ def paginated_collection(*args)
       end
 
       it "should show the proper item counts" do
-        expect(pagination.find_by_class('pagination_information').first.content.gsub('&nbsp;',' ')).
+        expect(pagination.find_by_class('pagination-information').first.content.gsub('&nbsp;',' ')).
           to eq "Displaying posts <b>61 - 81</b> of <b>81</b> in total"
       end
     end
@@ -214,7 +214,7 @@ def paginated_collection(*args)
         it "should not show the total item counts" do
           expect(collection).not_to receive(:total_pages)
           pagination = paginated_collection(collection, pagination_total: false)
-          info = pagination.find_by_class('pagination_information').first.content.gsub('&nbsp;',' ')
+          info = pagination.find_by_class('pagination-information').first.content.gsub('&nbsp;',' ')
           expect(info).to eq "Displaying posts <b>1 - 30</b>"
         end
       end
@@ -223,7 +223,7 @@ def paginated_collection(*args)
         let(:pagination) { paginated_collection(collection, pagination_total: true) }
 
         it "should show the total item counts" do
-          info = pagination.find_by_class('pagination_information').first.content.gsub('&nbsp;',' ')
+          info = pagination.find_by_class('pagination-information').first.content.gsub('&nbsp;',' ')
           expect(info).to eq "Displaying posts <b>1 - 30</b> of <b>256</b> in total"
         end
       end
diff --git a/spec/unit/views/components/sidebar_section_spec.rb b/spec/unit/views/components/sidebar_section_spec.rb
index 655e7b44f86..38240c69c52 100644
--- a/spec/unit/views/components/sidebar_section_spec.rb
+++ b/spec/unit/views/components/sidebar_section_spec.rb
@@ -21,12 +21,12 @@
     expect(html).to have_css '.panel-title', text: 'Help Section'
   end
 
-  it "should have the class of 'sidebar_section'" do
-    expect(html).to have_css ".sidebar_section"
+  it "should have the class of 'sidebar-section'" do
+    expect(html).to have_css ".sidebar-section"
   end
 
   it "should have an id based on the title" do
-    expect(html).to have_css "#help-section_sidebar_section"
+    expect(html).to have_css "#help-section-sidebar-section"
   end
 
   it "should have a panel body" do

From 6984ce8547d7ea436f7690f2a1c90b283a5623e1 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 10 Aug 2015 20:18:36 -0400
Subject: [PATCH 134/170] Simplify form styles so no padding on <ol> element
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Lots of padding on various components make its difficult when used in
other areas since then you start doing a lot of overrides (e.g. login
form). Instead we’ll add the padding consistently on the fieldset
(container) since formtastic always outputs one.
---
 .../stylesheets/active_admin/_forms.scss      | 29 +++++++------------
 .../active_admin/components/_comments.scss    |  6 +---
 .../active_admin/components/_date_picker.scss |  2 +-
 3 files changed, 12 insertions(+), 25 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 64ed9aabfa2..c649e0360ad 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -27,6 +27,7 @@ textarea {
     list-style: none;
     margin: 0;
     padding: 0;
+    position: relative;
   }
 
   .hidden {
@@ -54,10 +55,6 @@ textarea {
   .inputs {
     background-color: $panel-background-color;
     border-radius: $panel-border-radius;
-
-    > ol {
-      padding: 15px;
-    }
   }
 
   fieldset {
@@ -67,15 +64,12 @@ textarea {
     position: relative; // for abosolute positioning sub fieldset legends for choices/fragments
 
     legend {
+      float: left;
+      font-size: 1rem;
+      font-weight: $font-weight-normal;
+      margin: -15px 0 0 -15px;
+      padding: 15px;
       width: 100%;
-
-      span {
-        background-color: $panel-heading-background-color;
-        border-radius: $panel-border-radius $panel-border-radius 0 0;
-        display: block;
-        font-weight: $font-weight-bold;
-        padding: $panel-heading-padding;
-      }
     }
 
     .has_many_container {
@@ -87,18 +81,14 @@ textarea {
   }
 
   > fieldset {
-    margin: 0 0 20px 0;
+    padding: 15px;
   }
 
   // relative so the absolutely-positioned handle will fit
   .has_many_fields {
     border-bottom: 1px solid darken($panel-background-color, 12%);
     margin-bottom: 15px;
-
-    ol {
-      padding: 0 15px;
-      position: relative;
-    }
+    padding: 0 15px;
 
     .handle {
       bottom: 0;
@@ -172,7 +162,8 @@ textarea {
     color: $text-muted-color;
   }
 
-  .inline-errors, .errors {
+  .inline-errors,
+  .errors {
     color: $error-color;
     font-weight: $font-weight-bold;
   }
diff --git a/app/assets/stylesheets/active_admin/components/_comments.scss b/app/assets/stylesheets/active_admin/components/_comments.scss
index 594ba4699da..97d2611f6a2 100644
--- a/app/assets/stylesheets/active_admin/components/_comments.scss
+++ b/app/assets/stylesheets/active_admin/components/_comments.scss
@@ -14,12 +14,8 @@
   margin: 0;
 }
 
-.active_admin_comment fieldset.inputs {
+.active_admin_comment > fieldset {
   background-color: transparent;
   margin: 0;
   padding: 0;
-
-  & > ol {
-    padding: 0;
-  }
 }
diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index d6c6a1eeaad..ed81d158525 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -113,7 +113,7 @@
 
         &.ui-state-highlight,
         &.ui-state-highlight:hover { // today's date
-          background-color: $date-picker-calendar-link-hover-background-color;;
+          background-color: $date-picker-calendar-link-hover-background-color;
         }
       }
     }

From 56f7ffd76b24e289c1063c0b8b55b95f55e121b7 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 10 Aug 2015 20:54:11 -0400
Subject: [PATCH 135/170] Replace #login with better named class and simplify
 styles
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

No need to override <ol> element as we now have consistent padding on
fieldset. No need for link style since we include the secondary
authentication link as a secondary action in the form (sticks with
formtastic’s style by default). This should be good enough for a
default and then others can customize as they see fit.

Replace #login with a .devise-login-container class.
---
 .../active_admin/pages/_logged_out.scss       | 18 ++-------
 .../devise/confirmations/new.html.erb         | 28 +++++++------
 .../devise/passwords/edit.html.erb            | 32 +++++++--------
 .../devise/passwords/new.html.erb             | 32 ++++++++-------
 .../devise/registrations/new.html.erb         | 39 +++++++++----------
 .../active_admin/devise/sessions/new.html.erb | 39 ++++++++++---------
 .../active_admin/devise/unlocks/new.html.erb  | 26 ++++++-------
 .../layouts/active_admin_logged_out.html.erb  |  4 +-
 8 files changed, 102 insertions(+), 116 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/pages/_logged_out.scss b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
index de04bf95304..4677d0d279d 100644
--- a/app/assets/stylesheets/active_admin/pages/_logged_out.scss
+++ b/app/assets/stylesheets/active_admin/pages/_logged_out.scss
@@ -1,27 +1,17 @@
-#login {
+.devise-form-container {
   background-color: $panel-background-color;
   border-radius: $border-radius-base;
   margin: 70px auto;
-  padding: 15px;
+  padding: 5px 0;
   width: 500px;
 
   h2 {
     font-size: 1.8em;
+    padding: 0 15px;
   }
 
-  fieldset.inputs {
+  .inputs {
     background-color: transparent;
     margin-bottom: 0;
-
-    ol {
-      padding: 15px 0;
-    }
-  }
-
-  a {
-    float: right;
-    margin-top: -45px;
-    position: relative;
-    z-index: 2; // to make sure link is always above full width fieldset (e.g. forgot password page)
   }
 }
diff --git a/app/views/active_admin/devise/confirmations/new.html.erb b/app/views/active_admin/devise/confirmations/new.html.erb
index 83cb1cb1b6a..04c9fbb4c00 100644
--- a/app/views/active_admin/devise/confirmations/new.html.erb
+++ b/app/views/active_admin/devise/confirmations/new.html.erb
@@ -1,17 +1,15 @@
-<div id="login">
-  <h2><%= render_or_call_method_or_proc_on(self, active_admin_application.site_title) %> <%= title t('active_admin.devise.resend_confirmation_instructions.title') %></h2>
+<h2><%= render_or_call_method_or_proc_on(self, active_admin_application.site_title) %> <%= title t('active_admin.devise.resend_confirmation_instructions.title') %></h2>
 
-  <%= devise_error_messages! %>
-  <%= active_admin_form_for(resource, as: resource_name, url: confirmation_path(resource_name), html: { method: :post }) do |f|
-    f.inputs do
-      f.input :email
-    end
-    f.actions do
-      f.action :submit,
-        label: t('active_admin.devise.resend_confirmation_instructions.submit'),
-        button_html: { class: 'button button-primary', value: t('active_admin.devise.resend_confirmation_instructions.submit') }
-    end
-  end %>
+<%= devise_error_messages! %>
+<%= active_admin_form_for(resource, as: resource_name, url: confirmation_path(resource_name), html: { method: :post }) do |f|
+  f.inputs do
+    f.input :email
+  end
+  f.actions do
+    f.action :submit,
+      label: t('active_admin.devise.resend_confirmation_instructions.submit'),
+      button_html: { class: 'button button-primary', value: t('active_admin.devise.resend_confirmation_instructions.submit') }
+  end
+end %>
 
-  <%= render partial: "active_admin/devise/shared/links" %>
-</div>
+<%= render partial: "active_admin/devise/shared/links" %>
diff --git a/app/views/active_admin/devise/passwords/edit.html.erb b/app/views/active_admin/devise/passwords/edit.html.erb
index 339c4b55334..37d6f8a5233 100644
--- a/app/views/active_admin/devise/passwords/edit.html.erb
+++ b/app/views/active_admin/devise/passwords/edit.html.erb
@@ -1,20 +1,18 @@
-<div id="login">
-  <h2><%= render_or_call_method_or_proc_on(self, active_admin_application.site_title) %> <%= title t('active_admin.devise.change_password.title') %></h2>
+<h2><%= render_or_call_method_or_proc_on(self, active_admin_application.site_title) %> <%= title t('active_admin.devise.change_password.title') %></h2>
 
-  <%= devise_error_messages! %>
-  <%= active_admin_form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :put }) do |f|
-    f.inputs do
-      f.input :password
-      f.input :password_confirmation
-      f.input :reset_password_token, as: :hidden, input_html: { value: resource.reset_password_token }
-    end
-    f.actions do
-      f.action :submit,
-        label: t('active_admin.devise.change_password.submit'),
-        button_html: { class: 'button button-primary', value: t('active_admin.devise.change_password.submit') }
-    end
+<%= devise_error_messages! %>
+<%= active_admin_form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :put }) do |f|
+  f.inputs do
+    f.input :password
+    f.input :password_confirmation
+    f.input :reset_password_token, as: :hidden, input_html: { value: resource.reset_password_token }
   end
-  %>
+  f.actions do
+    f.action :submit,
+      label: t('active_admin.devise.change_password.submit'),
+      button_html: { class: 'button button-primary', value: t('active_admin.devise.change_password.submit') }
+  end
+end
+%>
 
-  <%= render 'active_admin/devise/shared/links' %>
-</div>
+<%= render 'active_admin/devise/shared/links' %>
diff --git a/app/views/active_admin/devise/passwords/new.html.erb b/app/views/active_admin/devise/passwords/new.html.erb
index 110d9c99ca7..fa48d8d6234 100644
--- a/app/views/active_admin/devise/passwords/new.html.erb
+++ b/app/views/active_admin/devise/passwords/new.html.erb
@@ -1,17 +1,19 @@
-<div id="login">
-  <h2><%= render_or_call_method_or_proc_on(self, active_admin_application.site_title) %> <%= title t('active_admin.devise.reset_password.title') %></h2>
+<h2><%= render_or_call_method_or_proc_on(self, active_admin_application.site_title) %> <%= title t('active_admin.devise.reset_password.title') %></h2>
+<% scope = Devise::Mapping.find_scope!(resource_name) %>
+<%= devise_error_messages! %>
+<%= active_admin_form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :post }) do |f|
+  f.inputs do
+    f.input :email
+  end
+  f.actions do
+    f.action :submit,
+      label: t('active_admin.devise.reset_password.submit'),
+      button_html: { class: 'button button-primary', value: t('active_admin.devise.reset_password.submit') }
 
-  <%= devise_error_messages! %>
-  <%= active_admin_form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :post }) do |f|
-    f.inputs do
-      f.input :email
+    if controller_name != 'sessions'
+      f.action :cancel,
+        label: t('active_admin.devise.links.sign_in'),
+        button_html: { href: send(:"new_#{scope}_session_path") }
     end
-    f.actions do
-      f.action :submit,
-        label: t('active_admin.devise.reset_password.submit'),
-        button_html: { class: 'button button-primary', value: t('active_admin.devise.reset_password.submit') }
-    end
-  end %>
-
-  <%= render partial: "active_admin/devise/shared/links" %>
-</div>
+  end
+end %>
diff --git a/app/views/active_admin/devise/registrations/new.html.erb b/app/views/active_admin/devise/registrations/new.html.erb
index e05f607d77a..f12ca489d1a 100644
--- a/app/views/active_admin/devise/registrations/new.html.erb
+++ b/app/views/active_admin/devise/registrations/new.html.erb
@@ -1,24 +1,21 @@
-<div id="login">
-  <h2><%= render_or_call_method_or_proc_on(self, active_admin_application.site_title) %> <%= title t('active_admin.devise.sign_up.title') %></h2>
+<h2><%= render_or_call_method_or_proc_on(self, active_admin_application.site_title) %> <%= title t('active_admin.devise.sign_up.title') %></h2>
 
-  <% scope = Devise::Mapping.find_scope!(resource_name) %>
-  <%= devise_error_messages! %>
-  <%= active_admin_form_for(resource, as: resource_name, url: send(:"#{scope}_registration_path"), html: { id: "registration_new" }) do |f|
-    f.inputs do
-      resource.class.authentication_keys.each_with_index { |key, index|
-        f.input key, label: t('active_admin.devise.'+key.to_s+'.title'), input_html: { autofocus: index.zero? }
-      }
-      f.input :password, label: t('active_admin.devise.password.title')
-      f.input :password_confirmation, lable: t('active_admin.devise.password_confirmation.title')
-    end
-    f.actions do
-      f.action :submit,
-        label: t('active_admin.devise.login.submit'),
-        button_html: { class: 'button button-primary', value: t('active_admin.devise.sign_up.submit') }
-    end
+<% scope = Devise::Mapping.find_scope!(resource_name) %>
+<%= devise_error_messages! %>
+<%= active_admin_form_for(resource, as: resource_name, url: send(:"#{scope}_registration_path"), html: { id: "registration_new" }) do |f|
+  f.inputs do
+    resource.class.authentication_keys.each_with_index { |key, index|
+      f.input key, label: t('active_admin.devise.'+key.to_s+'.title'), input_html: { autofocus: index.zero? }
+    }
+    f.input :password, label: t('active_admin.devise.password.title')
+    f.input :password_confirmation, lable: t('active_admin.devise.password_confirmation.title')
   end
-  %>
-
-  <%= render partial: "active_admin/devise/shared/links" %>
-</div>
+  f.actions do
+    f.action :submit,
+      label: t('active_admin.devise.login.submit'),
+      button_html: { class: 'button button-primary', value: t('active_admin.devise.sign_up.submit') }
+  end
+end
+%>
 
+<%= render partial: "active_admin/devise/shared/links" %>
diff --git a/app/views/active_admin/devise/sessions/new.html.erb b/app/views/active_admin/devise/sessions/new.html.erb
index 923a15b9616..07d701bd26f 100644
--- a/app/views/active_admin/devise/sessions/new.html.erb
+++ b/app/views/active_admin/devise/sessions/new.html.erb
@@ -1,22 +1,23 @@
-<div id="login">
-  <h2><%= render_or_call_method_or_proc_on(self, active_admin_application.site_title) %> <%= title t('active_admin.devise.login.title') %></h2>
+<h2><%= render_or_call_method_or_proc_on(self, active_admin_application.site_title) %> <%= title t('active_admin.devise.login.title') %></h2>
+<% scope = Devise::Mapping.find_scope!(resource_name) %>
+<%= active_admin_form_for(resource, as: resource_name, url: send(:"#{scope}_session_path"), html: { id: "session_new" }) do |f|
+  f.inputs do
+    resource.class.authentication_keys.each_with_index { |key, index|
+      f.input key, label: t('active_admin.devise.'+key.to_s+'.title'), input_html: { autofocus: index.zero? }
+    }
+    f.input :password, label: t('active_admin.devise.password.title')
+    f.input :remember_me, label: t('active_admin.devise.login.remember_me'), as: :boolean if devise_mapping.rememberable?
+  end
+  f.actions do
+    f.action :submit,
+      label: t('active_admin.devise.login.submit'),
+      button_html: { class: 'button button-primary', value: t('active_admin.devise.login.submit') }
 
-  <% scope = Devise::Mapping.find_scope!(resource_name) %>
-  <%= active_admin_form_for(resource, as: resource_name, url: send(:"#{scope}_session_path"), html: { id: "session_new" }) do |f|
-    f.inputs do
-      resource.class.authentication_keys.each_with_index { |key, index|
-        f.input key, label: t('active_admin.devise.'+key.to_s+'.title'), input_html: { autofocus: index.zero? }
-      }
-      f.input :password, label: t('active_admin.devise.password.title')
-      f.input :remember_me, label: t('active_admin.devise.login.remember_me'), as: :boolean if devise_mapping.rememberable?
-    end
-    f.actions do
-      f.action :submit,
-        label: t('active_admin.devise.login.submit'),
-        button_html: { class: 'button button-primary', value: t('active_admin.devise.login.submit') }
+    if devise_mapping.recoverable? && controller_name != 'passwords'
+      f.action :cancel,
+        label: t('active_admin.devise.links.forgot_your_password'),
+        button_html: { href: new_password_path(resource_name) }
     end
   end
-  %>
-
-  <%= render partial: "active_admin/devise/shared/links" %>
-</div>
+end
+%>
diff --git a/app/views/active_admin/devise/unlocks/new.html.erb b/app/views/active_admin/devise/unlocks/new.html.erb
index 8ecf3805323..68d1f87f14f 100644
--- a/app/views/active_admin/devise/unlocks/new.html.erb
+++ b/app/views/active_admin/devise/unlocks/new.html.erb
@@ -1,17 +1,15 @@
-<div id="login">
-  <h2><%= render_or_call_method_or_proc_on(self, active_admin_application.site_title) %> <%= title t('active_admin.devise.unlock.title') %></h2>
+<h2><%= render_or_call_method_or_proc_on(self, active_admin_application.site_title) %> <%= title t('active_admin.devise.unlock.title') %></h2>
 
-  <%= devise_error_messages! %>
-  <%= active_admin_form_for(resource, as: resource_name, url: unlock_path(resource_name), html: { method: :post }) do |f|
-    f.inputs do
-      f.input :email
-    end
-    f.actions do
-      f.action :submit,
-        label: t('active_admin.devise.unlock.submit'),
-        button_html: { class: 'button button-primary', value: t('active_admin.devise.unlock.submit') }
-    end
-  end %>
+<%= devise_error_messages! %>
+<%= active_admin_form_for(resource, as: resource_name, url: unlock_path(resource_name), html: { method: :post }) do |f|
+  f.inputs do
+    f.input :email
+  end
+  f.actions do
+    f.action :submit,
+      label: t('active_admin.devise.unlock.submit'),
+      button_html: { class: 'button button-primary', value: t('active_admin.devise.unlock.submit') }
+  end
+end %>
 
 <%= render partial: "active_admin/devise/shared/links" %>
-</div>
diff --git a/app/views/layouts/active_admin_logged_out.html.erb b/app/views/layouts/active_admin_logged_out.html.erb
index 36b8a4c88be..b8a9442c3eb 100644
--- a/app/views/layouts/active_admin_logged_out.html.erb
+++ b/app/views/layouts/active_admin_logged_out.html.erb
@@ -28,7 +28,9 @@
       <%= content_tag :div, message, class: "flash flash_#{type}" %>
     <% end %>
     <div id="active_admin_content">
-      <%= yield %>
+      <div class="devise-form-container">
+        <%= yield %>
+      </div>
     </div>
   </div>
   <div id="footer">

From 9a36b82a4eb4b5199f4fe9beef7e71b3d95b48fb Mon Sep 17 00:00:00 2001
From: Joel Clay <ra3don92@gmail.com>
Date: Mon, 10 Aug 2015 22:15:41 -0400
Subject: [PATCH 136/170] fixing hound issues on _form.scss and
 _typography.scss

---
 .../initializers/filters.js.coffee            |  4 +--
 .../active_admin/lib/has_many.js.coffee       | 20 ++++++-------
 .../stylesheets/active_admin/_forms.scss      | 22 +++++++-------
 .../stylesheets/active_admin/_typography.scss | 15 +++++++---
 features/step_definitions/filter_steps.rb     |  2 +-
 lib/active_admin/filters/forms.rb             |  2 +-
 lib/active_admin/form_builder.rb              |  4 +--
 lib/active_admin/inputs/filters/base.rb       |  2 +-
 .../filters/base/search_method_select.rb      |  2 +-
 spec/unit/filters/filter_form_builder_spec.rb |  2 +-
 spec/unit/form_builder_spec.rb                | 30 +++++++++----------
 11 files changed, 56 insertions(+), 49 deletions(-)

diff --git a/app/assets/javascripts/active_admin/initializers/filters.js.coffee b/app/assets/javascripts/active_admin/initializers/filters.js.coffee
index 2b784c686a8..f9e259da720 100644
--- a/app/assets/javascripts/active_admin/initializers/filters.js.coffee
+++ b/app/assets/javascripts/active_admin/initializers/filters.js.coffee
@@ -10,7 +10,7 @@ $(document).on 'ready page:load turbolinks:load', ->
       window.location.search = (param for param in params when not param.match(regex)).join('&')
 
   # Filter form: don't send any inputs that are empty
-  $('.filter_form').submit (e) ->
+  $('.filter-form').submit (e) ->
     $(@).find(':input').filter(-> @value is '').prop 'disabled', true
     if typeof Turbolinks != 'undefined'
       Turbolinks.visit(window.location.href.split('?')[0] + '?' + $( this ).serialize())
@@ -18,5 +18,5 @@ $(document).on 'ready page:load turbolinks:load', ->
 
   # Filter form: for filters that let you choose the query method from
   # a dropdown, apply that choice to the filter input field.
-  $('.filter_form_field.select_and_search select').change ->
+  $('.filter-form-field.select-and-search select').change ->
     $(@).siblings('input').prop name: "q[#{@value}]"
diff --git a/app/assets/javascripts/active_admin/lib/has_many.js.coffee b/app/assets/javascripts/active_admin/lib/has_many.js.coffee
index bfd5fc82c39..bc7dbbfea1d 100644
--- a/app/assets/javascripts/active_admin/lib/has_many.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/has_many.js.coffee
@@ -2,18 +2,18 @@ $ ->
   # Provides a before-removal hook:
   # $ ->
   #   # This is a good place to tear down JS plugins to prevent memory leaks.
-  #   $(document).on 'has_many_remove:before', '.has_many_container', (e, fieldset, container)->
+  #   $(document).on 'has_many_remove:before', '.has-many-container', (e, fieldset, container)->
   #     fieldset.find('.select2').select2 'destroy'
   #
   #   # If you need to do anything after removing the items you can use the
   #   has_many_remove:after hook
-  #   $(document).on 'has_many_remove:after', '.has_many_container', (e, fieldset, container)->
-  #     list_item_count = container.find('.has_many_fields').length
+  #   $(document).on 'has_many_remove:after', '.has-many-container', (e, fieldset, container)->
+  #     list_item_count = container.find('.has-many-fields').length
   #     alert("There are now #{list_item_count} items in the list")
   #
   $(document).on 'click', 'a.button.has_many_remove', (e)->
     e.preventDefault()
-    parent    = $(@).closest '.has_many_container'
+    parent    = $(@).closest '.has-many-container'
     to_remove = $(@).closest 'fieldset'
     recompute_positions parent
 
@@ -24,18 +24,18 @@ $ ->
   # Provides before and after creation hooks:
   # $ ->
   #   # The before hook allows you to prevent the creation of new records.
-  #   $(document).on 'has_many_add:before', '.has_many_container', (e, container)->
+  #   $(document).on 'has_many_add:before', '.has-many-container', (e, container)->
   #     if $(@).children('fieldset').length >= 3
   #       alert "you've reached the maximum number of items"
   #       e.preventDefault()
   #
   #   # The after hook is a good place to initialize JS plugins and the like.
-  #   $(document).on 'has_many_add:after', '.has_many_container', (e, fieldset, container)->
+  #   $(document).on 'has_many_add:after', '.has-many-container', (e, fieldset, container)->
   #     fieldset.find('select').chosen()
   #
   $(document).on 'click', 'a.button.has_many_add', (e)->
     e.preventDefault()
-    parent = $(@).closest '.has_many_container'
+    parent = $(@).closest '.has-many-container'
     parent.trigger before_add = $.Event('has_many_add:before'), [parent]
 
     unless before_add.isDefaultPrevented()
@@ -49,15 +49,15 @@ $ ->
       recompute_positions parent
       parent.trigger 'has_many_add:after', [fieldset, parent]
 
-  $(document).on 'change','.has_many_container[data-sortable] :input[name$="[_destroy]"]', ->
+  $(document).on 'change','.has-many-container[data-sortable] :input[name$="[_destroy]"]', ->
     recompute_positions $(@).closest '.has_many'
 
   init_sortable()
-  $(document).on 'has_many_add:after', '.has_many_container', init_sortable
+  $(document).on 'has_many_add:after', '.has-many-container', init_sortable
 
 
 init_sortable = ->
-  elems = $('.has_many_container[data-sortable]:not(.ui-sortable)')
+  elems = $('.has-many-container[data-sortable]:not(.ui-sortable)')
   elems.sortable \
     items: '> fieldset',
     handle: '> ol > .handle',
diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index c649e0360ad..31682bfe3e6 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -47,7 +47,7 @@ textarea {
 
     abbr {
       border: none;
-      color:  $required-field-marker-color;
+      color: $required-field-marker-color;
       margin-left: 0.3em;
     }
   }
@@ -72,7 +72,7 @@ textarea {
       width: 100%;
     }
 
-    .has_many_container {
+    .has-many-container {
       h3 {
         border-bottom: 1px solid darken($panel-background-color, 12%);
         margin-bottom: 20px;
@@ -85,7 +85,7 @@ textarea {
   }
 
   // relative so the absolutely-positioned handle will fit
-  .has_many_fields {
+  .has-many-fields {
     border-bottom: 1px solid darken($panel-background-color, 12%);
     margin-bottom: 15px;
     padding: 0 15px;
@@ -111,7 +111,7 @@ textarea {
   legend.label {
     font-size: inherit;
     left: 0;
-    position: absolute
+    position: absolute;
   }
 
   .choices-group,
@@ -127,7 +127,7 @@ textarea {
 
   .choice,
   .fragment {
-    margin: 0 0 0.5em 0;
+    margin: 0 0 0.5em;
   }
 
   .fragment {
@@ -213,15 +213,15 @@ $side-by-side-filter-select-width: ($sidebar-inner-content-width / 2);
 
 $date-range-filter-input-width: ($sidebar-inner-content-width / 2) - ($filter-field-seperator-width / 2);
 
-.filter_form_field {
+.filter-form-field {
   margin-bottom: 12px;
 
   .label {
     display: block;
-    margin: 0 0 0.18em 0;
+    margin: 0 0 0.18em;
   }
 
-  &.select_and_search {
+  &.select-and-search {
     input[type=text] {
       margin-left: $filter-field-seperator-width;
       width: $side-by-side-filter-input-width;
@@ -232,7 +232,7 @@ $date-range-filter-input-width: ($sidebar-inner-content-width / 2) - ($filter-fi
     }
   }
 
-  &.filter_date_range {
+  &.filter-date-range {
     input {
       width: $date-range-filter-input-width;
 
@@ -243,7 +243,7 @@ $date-range-filter-input-width: ($sidebar-inner-content-width / 2) - ($filter-fi
   }
 }
 
-.filter_check_boxes {
+.filter-check-boxes {
   .choices {
     border: none;
     margin: 0;
@@ -255,7 +255,7 @@ $date-range-filter-input-width: ($sidebar-inner-content-width / 2) - ($filter-fi
   }
 }
 
-.filter_form {
+.filter-form {
   .buttons > * {
     margin-right: 5px;
   }
diff --git a/app/assets/stylesheets/active_admin/_typography.scss b/app/assets/stylesheets/active_admin/_typography.scss
index d42dfb73f5f..be487e3481c 100644
--- a/app/assets/stylesheets/active_admin/_typography.scss
+++ b/app/assets/stylesheets/active_admin/_typography.scss
@@ -1,4 +1,9 @@
-h1, h2, h3, h4, h5, h6 {
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
   color: $headings-color;
   font-family: $headings-font-family;
   font-weight: $headings-font-weight;
@@ -24,7 +29,8 @@ h4 {
   margin-bottom: 1.25em;
 }
 
-h5, h6 {
+h5,
+h6 {
   font-size: 1em;
 }
 
@@ -32,7 +38,7 @@ p {
   margin: 0 0 1em;
 }
 
-blockquote  {
+blockquote {
   color: $blockquote-color;
   margin: 1em;
 }
@@ -46,7 +52,8 @@ code {
   font-family: $font-family-monospace;
 }
 
-ul, ol {
+ul,
+ol {
   margin: 0 1.5em 1.5em 0;
   padding-left: 1.5em;
 }
diff --git a/features/step_definitions/filter_steps.rb b/features/step_definitions/filter_steps.rb
index 2ad7fe49d73..a126f1ff4a2 100644
--- a/features/step_definitions/filter_steps.rb
+++ b/features/step_definitions/filter_steps.rb
@@ -7,7 +7,7 @@
 end
 
 Then /^I should see a date range filter for "([^"]*)"$/ do |label|
-  expect(page).to have_css '.filter_date_range label', text: label
+  expect(page).to have_css '.filter-date-range label', text: label
 end
 
 Then /^I should see the following filters:$/ do |table|
diff --git a/lib/active_admin/filters/forms.rb b/lib/active_admin/filters/forms.rb
index 7b39a539b12..67c19026f8f 100644
--- a/lib/active_admin/filters/forms.rb
+++ b/lib/active_admin/filters/forms.rb
@@ -49,7 +49,7 @@ module ViewHelper
       def active_admin_filters_form_for(search, filters, options = {})
         defaults = { builder: ActiveAdmin::Filters::FormBuilder,
                      url: collection_path,
-                     html: {class: 'filter_form'} }
+                     html: {class: 'filter-form'} }
         required = { html: {method: :get},
                      as: :q }
         options  = defaults.deep_merge(options).deep_merge(required)
diff --git a/lib/active_admin/form_builder.rb b/lib/active_admin/form_builder.rb
index e926de19592..e1e9657eb73 100644
--- a/lib/active_admin/form_builder.rb
+++ b/lib/active_admin/form_builder.rb
@@ -39,7 +39,7 @@ def has_many(assoc, options = {}, &block)
       custom_settings = :new_record, :allow_destroy, :heading, :sortable, :sortable_start
       builder_options = {new_record: true}.merge! options.slice  *custom_settings
       options         = {for: assoc      }.merge! options.except *custom_settings
-      options[:class] = [options[:class], "inputs has_many_fields"].compact.join(' ')
+      options[:class] = [options[:class], "inputs has-many-fields"].compact.join(' ')
       sortable_column = builder_options[:sortable]
       sortable_start  = builder_options.fetch(:sortable_start, 0)
 
@@ -73,7 +73,7 @@ def has_many(assoc, options = {}, &block)
       end
 
       tag = @already_in_an_inputs_block ? :li : :div
-      html = template.content_tag(tag, html, class: "has_many_container #{assoc}", 'data-sortable' => sortable_column, 'data-sortable-start' => sortable_start)
+      html = template.content_tag(tag, html, class: "has-many-container #{assoc}", 'data-sortable' => sortable_column, 'data-sortable-start' => sortable_start)
       template.concat(html) if template.output_buffer
       html
     end
diff --git a/lib/active_admin/inputs/filters/base.rb b/lib/active_admin/inputs/filters/base.rb
index 420a17c4937..1dc492ad513 100644
--- a/lib/active_admin/inputs/filters/base.rb
+++ b/lib/active_admin/inputs/filters/base.rb
@@ -25,7 +25,7 @@ def label_from_options
 
         def wrapper_html_options
           opts = super
-          (opts[:class] ||= '') << " filter_form_field filter_#{as}"
+          (opts[:class] ||= '') << " filter-form-field filter-#{as}"
           opts
         end
 
diff --git a/lib/active_admin/inputs/filters/base/search_method_select.rb b/lib/active_admin/inputs/filters/base/search_method_select.rb
index 45cfb09ca3c..df1cdde5037 100644
--- a/lib/active_admin/inputs/filters/base/search_method_select.rb
+++ b/lib/active_admin/inputs/filters/base/search_method_select.rb
@@ -31,7 +31,7 @@ def filter(*filters)
 
           def wrapper_html_options
             opts = super
-            (opts[:class] ||= '') << ' select_and_search' unless seems_searchable?
+            (opts[:class] ||= '') << ' select-and-search' unless seems_searchable?
             opts
           end
 
diff --git a/spec/unit/filters/filter_form_builder_spec.rb b/spec/unit/filters/filter_form_builder_spec.rb
index 40e13271f55..9697d54162c 100644
--- a/spec/unit/filters/filter_form_builder_spec.rb
+++ b/spec/unit/filters/filter_form_builder_spec.rb
@@ -43,7 +43,7 @@ def filter(name, options = {})
     let(:body) { Capybara.string(filter :title) }
 
     it "should generate a form which submits via get" do
-      expect(body).to have_selector("form.filter_form[method=get]")
+      expect(body).to have_selector("form.filter-form[method=get]")
     end
 
     it "should generate a filter button" do
diff --git a/spec/unit/form_builder_spec.rb b/spec/unit/form_builder_spec.rb
index 5ff42975706..e917d1e44cf 100644
--- a/spec/unit/form_builder_spec.rb
+++ b/spec/unit/form_builder_spec.rb
@@ -471,22 +471,22 @@ def user
       end
 
       it "should add a link to remove new nested records" do
-        expect(body).to have_selector(".has_many_container > fieldset > ol > li > a.button.has_many_remove[href='#']", text: "Remove")
+        expect(body).to have_selector(".has-many-container > fieldset > ol > li > a.button.has_many_remove[href='#']", text: "Remove")
       end
 
       it "should add a link to add new nested records" do
-        expect(body).to have_selector(".has_many_container > a.button.has_many_add[href='#']", text: "Add New Post")
+        expect(body).to have_selector(".has-many-container > a.button.has_many_add[href='#']", text: "Add New Post")
       end
 
       it "should set an HTML-id valid placeholder" do
-        link = body.find('.has_many_container > a.button.has_many_add')
+        link = body.find('.has-many-container > a.button.has_many_add')
         expect(link[:'data-placeholder']).to match valid_html_id
       end
 
       describe "with namespaced model" do
         it "should set an HTML-id valid placeholder" do
           allow(Post).to receive(:name).and_return "ActiveAdmin::Post"
-          link = body.find('.has_many_container > a.button.has_many_add')
+          link = body.find('.has-many-container > a.button.has_many_add')
           expect(link[:'data-placeholder']).to match valid_html_id
         end
       end
@@ -579,7 +579,7 @@ def user
         end
 
         it "should wrap the destroy field in an li with class 'has_many_delete'" do
-          expect(body).to have_selector(".has_many_container > fieldset > ol > li.has_many_delete > input", count: 1)
+          expect(body).to have_selector(".has-many-container > fieldset > ol > li.has_many_delete > input", count: 1)
         end
       end
 
@@ -737,7 +737,7 @@ def user
         end
 
         it "shows the nested fields for unsaved records" do
-          expect(body).to have_selector("fieldset.inputs.has_many_fields")
+          expect(body).to have_selector("fieldset.inputs.has-many-fields")
         end
 
       end
@@ -754,7 +754,7 @@ def user
         end
 
         it "shows the nested fields for unsaved records" do
-          expect(body).to have_selector("fieldset.inputs.has_many_fields")
+          expect(body).to have_selector("fieldset.inputs.has-many-fields")
         end
 
       end
@@ -776,7 +776,7 @@ def user
         end
 
         it "shows the nested fields for saved and unsaved records" do
-          expect(body).to have_selector("fieldset.inputs.has_many_fields")
+          expect(body).to have_selector("fieldset.inputs.has-many-fields")
         end
       end
 
@@ -791,7 +791,7 @@ def user
         end
 
         it "defaults to 0" do
-          expect(body).to have_selector("div.has_many_container[data-sortable-start='0']")
+          expect(body).to have_selector("div.has-many-container[data-sortable-start='0']")
         end
       end
 
@@ -806,7 +806,7 @@ def user
         end
 
         it "sets the data attribute" do
-          expect(body).to have_selector("div.has_many_container[data-sortable-start='15']")
+          expect(body).to have_selector("div.has-many-container[data-sortable-start='15']")
         end
       end
     end
@@ -825,15 +825,15 @@ def user
         end
 
         it "should wrap the has_many fieldset in an li" do
-          expect(body).to have_selector("ol > li.has_many_container")
+          expect(body).to have_selector("ol > li.has-many-container")
         end
 
         it "should have a direct fieldset child" do
-          expect(body).to have_selector("li.has_many_container > fieldset")
+          expect(body).to have_selector("li.has-many-container > fieldset")
         end
 
         it "should not contain invalid li children" do
-          expect(body).not_to have_selector("div.has_many_container > li")
+          expect(body).not_to have_selector("div.has-many-container > li")
         end
       end
 
@@ -851,11 +851,11 @@ def user
         end
 
         it "should wrap the inner has_many fieldset in an ol > li" do
-          expect(body).to have_selector(".has_many_container ol > li.has_many_container > fieldset")
+          expect(body).to have_selector(".has-many-container ol > li.has-many-container > fieldset")
         end
 
         it "should not contain invalid li children" do
-          expect(body).not_to have_selector(".has_many_container div.has_many_container > li")
+          expect(body).not_to have_selector(".has-many-container div.has-many-container > li")
         end
       end
     end

From d377ac140f4b1841fbc6b18e49c19bde591bfd80 Mon Sep 17 00:00:00 2001
From: Joel Clay <ra3don92@gmail.com>
Date: Mon, 10 Aug 2015 22:41:07 -0400
Subject: [PATCH 137/170] updating failed tests

---
 features/step_definitions/filter_steps.rb | 4 ++--
 lib/active_admin/inputs/filters/base.rb   | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/features/step_definitions/filter_steps.rb b/features/step_definitions/filter_steps.rb
index a126f1ff4a2..3d04fc26835 100644
--- a/features/step_definitions/filter_steps.rb
+++ b/features/step_definitions/filter_steps.rb
@@ -1,9 +1,9 @@
 Then /^I should see a select filter for "([^"]*)"$/ do |label|
-  expect(page).to have_css '.filter_select label', text: label
+  expect(page).to have_css '.filter-select label', text: label
 end
 
 Then /^I should see a string filter for "([^"]*)"$/ do |label|
-  expect(page).to have_css '.filter_string label', text: label
+  expect(page).to have_css '.filter-string label', text: label
 end
 
 Then /^I should see a date range filter for "([^"]*)"$/ do |label|
diff --git a/lib/active_admin/inputs/filters/base.rb b/lib/active_admin/inputs/filters/base.rb
index 1dc492ad513..c0b0167990d 100644
--- a/lib/active_admin/inputs/filters/base.rb
+++ b/lib/active_admin/inputs/filters/base.rb
@@ -25,7 +25,7 @@ def label_from_options
 
         def wrapper_html_options
           opts = super
-          (opts[:class] ||= '') << " filter-form-field filter-#{as}"
+          (opts[:class] ||= '') << " filter-form-field filter-#{as.dasherize}"
           opts
         end
 

From 0d88ffd0e3a8bee12ac2be4c148f6e3a78d1ab18 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 10 Aug 2015 22:19:14 -0400
Subject: [PATCH 138/170] Add footer class and replace selector with class
 lookup

---
 app/assets/stylesheets/active_admin/structure/_footer.scss | 2 +-
 lib/active_admin/views/footer.rb                           | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/structure/_footer.scss b/app/assets/stylesheets/active_admin/structure/_footer.scss
index 5cbb15f7ebc..dfe4ed3fee0 100644
--- a/app/assets/stylesheets/active_admin/structure/_footer.scss
+++ b/app/assets/stylesheets/active_admin/structure/_footer.scss
@@ -1,4 +1,4 @@
-#footer {
+.footer {
   font-size: 0.9em;
   padding: $horizontal-page-margin;
 }
diff --git a/lib/active_admin/views/footer.rb b/lib/active_admin/views/footer.rb
index cf168516e36..dd19b610118 100644
--- a/lib/active_admin/views/footer.rb
+++ b/lib/active_admin/views/footer.rb
@@ -3,7 +3,7 @@ module Views
     class Footer < Component
 
       def build
-        super id: "footer"
+        super id: "footer", class: "footer"
         powered_by_message
       end
 

From 3d61b2e715c99df09feebb70a504f0349eb9a48e Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 10 Aug 2015 22:22:30 -0400
Subject: [PATCH 139/170] Fix LeadingZero and SpaceBeforeBrace lint warnings

---
 .../stylesheets/active_admin/components/_date_picker.scss   | 2 +-
 .../stylesheets/active_admin/components/_dropdown_menu.scss | 2 +-
 app/assets/stylesheets/active_admin/mixins/_buttons.scss    | 6 +++---
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index ed81d158525..5f58c24a35b 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -1,5 +1,5 @@
 .ui-datepicker {
-  box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
+  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
   display: none;
   width: 12em;
 
diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index e7f714c10c0..f66da6a0644 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -18,7 +18,7 @@
   background-color: $dropdown-background-color;
   border: 1px solid $dropdown-border-color;
   border-radius: $border-radius-base;
-  box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
+  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
   display: none;
   left: 0;
   list-style: none;
diff --git a/app/assets/stylesheets/active_admin/mixins/_buttons.scss b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
index 040a0c112ac..fa4327e017a 100644
--- a/app/assets/stylesheets/active_admin/mixins/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_buttons.scss
@@ -40,7 +40,7 @@
     }
 
     &:active {
-      box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
+      box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
     }
   }
 
@@ -56,13 +56,13 @@
   color: $button-primary-color;
 
   &:not(.disabled) {
-    &:hover{
+    &:hover {
       background-color: darken($button-primary-background-color, 10%);
       border-color: darken($button-primary-border-color, 15%);
     }
 
     &:active {
-      box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
+      box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
     }
   }
 

From 33e685c9e8e815fc7584e2f5d14a3b8bb794bbb5 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 10 Aug 2015 22:31:47 -0400
Subject: [PATCH 140/170] Allow QualifyingElement with attribute and class

The member-link class is specific so no need to still type it to an
anchor.
---
 .scss-style.yml                                              | 4 ++--
 app/assets/stylesheets/active_admin/components/_buttons.scss | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/.scss-style.yml b/.scss-style.yml
index 334b0da0526..8e682a9062c 100644
--- a/.scss-style.yml
+++ b/.scss-style.yml
@@ -82,8 +82,8 @@ linters:
     extra_properties: []
   QualifyingElement:
     enabled: true
-    allow_element_with_attribute: false
-    allow_element_with_class: false
+    allow_element_with_attribute: true
+    allow_element_with_class: true
     allow_element_with_id: false
     severity: warning
   SelectorDepth:
diff --git a/app/assets/stylesheets/active_admin/components/_buttons.scss b/app/assets/stylesheets/active_admin/components/_buttons.scss
index a06110cbac2..37c1768c0b5 100644
--- a/app/assets/stylesheets/active_admin/components/_buttons.scss
+++ b/app/assets/stylesheets/active_admin/components/_buttons.scss
@@ -1,4 +1,4 @@
-a.member-link {
+.member-link {
   margin-right: 7px;
   white-space: nowrap;
 }

From 415fce30e582030934b32071f43f4b1076bf7c32 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 10 Aug 2015 22:33:13 -0400
Subject: [PATCH 141/170] Rewrite selector using fragments class as its more
 descriptive

While we changed the settings for QualifyingElement in the scss lint
config this is better since its descriptive about what type of element
we are targeting. This would be for a fieldset containing dropdowns for
example.
---
 app/assets/stylesheets/active_admin/_forms.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 31682bfe3e6..e76065b762c 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -108,7 +108,7 @@ textarea {
 
   // Nested Fieldsets and Legends (radio, check boxes and date/time inputs use nested fieldsets)
 
-  legend.label {
+  .fragments > .label {
     font-size: inherit;
     left: 0;
     position: absolute;

From 03ac1c5e1cab75b480eba82c6e07f4370ec33006 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 10 Aug 2015 22:47:13 -0400
Subject: [PATCH 142/170] Fix id and selector depth warnings for print
 stylesheet

---
 .../stylesheets/active_admin/print.scss       | 22 ++++++-------------
 1 file changed, 7 insertions(+), 15 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/print.scss b/app/assets/stylesheets/active_admin/print.scss
index f164fa1a9c5..988845cf294 100644
--- a/app/assets/stylesheets/active_admin/print.scss
+++ b/app/assets/stylesheets/active_admin/print.scss
@@ -50,8 +50,8 @@ input[type=file],
 form .password,
 form .hidden,
 form .actions,
-#filters-sidebar-section,
-#footer {
+.sidebar-section,
+.footer {
   display: none;
 }
 
@@ -124,14 +124,6 @@ table {
   }
 }
 
-.index_grid {
-  td {
-    img {
-      max-width: 1in;
-    }
-  }
-}
-
 // Show
 .panel {
   margin-bottom: 3em;
@@ -177,14 +169,14 @@ form {
     padding: 0;
   }
 
+  li > label,
+  .fragments > .label {
+    font-weight: bold;
+  }
+
   li {
     padding: 1em 0;
 
-    > label,
-    legend label {
-      font-weight: bold;
-    }
-
     abbr[title] {
       border-bottom: none;
       font-weight: normal;

From ebe3d02c94f83c2504a4df59a583c533ccc7c732 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 10 Aug 2015 22:47:40 -0400
Subject: [PATCH 143/170] Update selector depth to 3 and disable shorthand

---
 .scss-style.yml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.scss-style.yml b/.scss-style.yml
index 8e682a9062c..0a0042643d5 100644
--- a/.scss-style.yml
+++ b/.scss-style.yml
@@ -88,13 +88,13 @@ linters:
     severity: warning
   SelectorDepth:
     enabled: true
-    max_depth: 2
+    max_depth: 3
     severity: warning
   SelectorFormat:
     enabled: true
     convention: hyphenated_lowercase
   Shorthand:
-    enabled: true
+    enabled: false
     severity: warning
   SingleLinePerProperty:
     enabled: true

From 789f7cbcd9a7c88403b12adea2b74e7941084f59 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 00:05:46 -0400
Subject: [PATCH 144/170] Fix SingleLinePerSelector and StringQuotes warnings

---
 app/assets/stylesheets/active_admin/_forms.scss      |  2 +-
 app/assets/stylesheets/active_admin/_header.scss     |  4 +++-
 .../active_admin/components/_date_picker.scss        |  5 +++--
 .../stylesheets/active_admin/components/_tables.scss | 12 ++++++++----
 4 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index e76065b762c..8d1cf34a4d3 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -99,7 +99,7 @@ textarea {
       width: 20px;
 
       &:before {
-        content: '\1801\1801\1801\1801';
+        content: "\1801\1801\1801\1801";
         font-size: 1.8em;
         position: absolute;
       }
diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index 47bfd4e0c06..2b502fd460c 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -4,7 +4,9 @@
   padding: 0 $horizontal-page-margin;
   width: 100%;
 
-  a, a:link, a:visited {
+  a,
+  a:link,
+  a:visited {
     color: $navbar-link-color;
     text-decoration: none;
   }
diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index 5f58c24a35b..e1d5be6f2a8 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -41,7 +41,7 @@
   &:after {
     border-bottom: 4px solid transparent;
     border-top: 4px solid transparent;
-    content: '';
+    content: "";
     height: 0;
     position: absolute;
     top: calc(50% - 4px);
@@ -76,7 +76,8 @@
   border: none;
   margin-bottom: 0;
 
-  td, th {
+  td,
+  th {
     padding: 0;
     text-align: center;
   }
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 1b27a1f364e..3bfa455af06 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -7,7 +7,8 @@ th {
   text-align: left;
 }
 
-th, td {
+th,
+td {
   border-bottom: 1px solid $table-border-color;
   padding: $table-cell-padding;
   vertical-align: top;
@@ -23,7 +24,9 @@ thead {
 // -------------------------------------- Index Tables
 table.index_table {
   th {
-    a, a:link, a:visited {
+    a,
+    a:link,
+    a:visited {
       color: $text-color;
       display: block;
       position: relative;
@@ -37,7 +40,7 @@ table.index_table {
         border-left: 4px solid transparent;
         border-right: 4px solid transparent;
         bottom: 100%;
-        content: '';
+        content: "";
         height: 0;
         position: absolute;
         right: 0;
@@ -74,7 +77,8 @@ table.index_table {
 
 // -------------------------------------- Tables inside Panels
 .panel_contents table {
-  th, td {
+  th,
+  td {
     padding: $table-condensed-cell-padding;
   }
 }

From cfa233c15303d26d656c8451bf5fdd84d2696f61 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 00:07:51 -0400
Subject: [PATCH 145/170] Fix MergeableSelector warnings

---
 .../active_admin/components/_comments.scss    | 12 +++----
 .../active_admin/components/_tables.scss      | 32 +++++++++----------
 2 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_comments.scss b/app/assets/stylesheets/active_admin/components/_comments.scss
index 97d2611f6a2..b7d8e5b163d 100644
--- a/app/assets/stylesheets/active_admin/components/_comments.scss
+++ b/app/assets/stylesheets/active_admin/components/_comments.scss
@@ -1,6 +1,12 @@
 .active_admin_comment {
   margin-bottom: 25px;
   max-width: 45em;
+
+  > fieldset {
+    background-color: transparent;
+    margin: 0;
+    padding: 0;
+  }
 }
 
 .active_admin_comment_meta {
@@ -13,9 +19,3 @@
   font-weight: $font-weight-bold;
   margin: 0;
 }
-
-.active_admin_comment > fieldset {
-  background-color: transparent;
-  margin: 0;
-  padding: 0;
-}
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 3bfa455af06..4be13848945 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -22,7 +22,7 @@ thead {
 }
 
 // -------------------------------------- Index Tables
-table.index_table {
+.index_table {
   th {
     a,
     a:link,
@@ -86,26 +86,26 @@ table.index_table {
 // -------------------------------------- Resource Attributes Table
 .attributes_table {
   overflow: hidden;
-}
 
-.attributes_table table {
-  col {
-    border-right: 1px solid $table-border-color;
+  table {
+    col {
+      border-right: 1px solid $table-border-color;
 
-    &:first-child {
-      border-right: 2px solid $table-border-color;
+      &:first-child {
+        border-right: 2px solid $table-border-color;
+      }
     }
-  }
 
-  th {
-    width: 180px;
-  }
+    th {
+      width: 180px;
+    }
 
-  td .empty {
-    color: $text-muted-color;
-    font-size: 0.8em;
-    letter-spacing: 0.2em;
-    text-transform: uppercase;
+    td .empty {
+      color: $text-muted-color;
+      font-size: 0.8em;
+      letter-spacing: 0.2em;
+      text-transform: uppercase;
+    }
   }
 }
 

From 2ec4f842b6b78c7e5219ed2453fc031b59b8db2a Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 00:10:35 -0400
Subject: [PATCH 146/170] Fix all UnnecessaryParentReference warnings

---
 app/assets/stylesheets/active_admin/_forms.scss                 | 2 +-
 app/assets/stylesheets/active_admin/_header.scss                | 2 +-
 .../stylesheets/active_admin/components/_breadcrumbs.scss       | 2 +-
 .../stylesheets/active_admin/components/_table_tools.scss       | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index 8d1cf34a4d3..db209450f66 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -236,7 +236,7 @@ $date-range-filter-input-width: ($sidebar-inner-content-width / 2) - ($filter-fi
     input {
       width: $date-range-filter-input-width;
 
-      & + input {
+      + input {
         margin-left: 6px;
       }
     }
diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index 2b502fd460c..29118a918e6 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -33,7 +33,7 @@
     padding: 0 20px;
     width: 100%;
 
-    & > li {
+    > li {
       display: inline-block;
       position: relative;
 
diff --git a/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss b/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss
index 847a9964d08..9dfa11ed5cf 100644
--- a/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss
+++ b/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss
@@ -7,7 +7,7 @@
   > li {
     display: inline-block;
 
-    & + li:before {
+    + li:before {
       color: $breadcrumb-separator-color;
       content: "#{$breadcrumb-separator}\00a0"; // Unicode space added since inline-block means non-collapsing white-space
       padding: 0 5px;
diff --git a/app/assets/stylesheets/active_admin/components/_table_tools.scss b/app/assets/stylesheets/active_admin/components/_table_tools.scss
index 0c2452b95d3..5f35a7fb554 100644
--- a/app/assets/stylesheets/active_admin/components/_table_tools.scss
+++ b/app/assets/stylesheets/active_admin/components/_table_tools.scss
@@ -24,7 +24,7 @@
   li {
     float: left;
 
-    & + li a {
+    + li a {
       border-radius: 0;
       margin-left: -1px;
     }

From c40d4d75836fb51109685e3509745b8140996132 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 00:14:18 -0400
Subject: [PATCH 147/170] Disable PropertyCount warning
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This is rather aggressive and really no need for it. We could increment
the max properties but I didn’t want to put a meaningless number there
just to avoid the warning.
---
 .scss-style.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.scss-style.yml b/.scss-style.yml
index 0a0042643d5..282fd6ca48a 100644
--- a/.scss-style.yml
+++ b/.scss-style.yml
@@ -69,7 +69,7 @@ linters:
   PlaceholderInExtend:
     enabled: false
   PropertyCount:
-    enabled: true
+    enabled: false
     include_nested: false
     max_properties: 10
   PropertySortOrder:

From 3d9be7498ecafd4914b5f06604c08bedc8916502 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 00:19:02 -0400
Subject: [PATCH 148/170] Fix last Comment warning

---
 app/assets/stylesheets/active_admin/_base.scss | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/active_admin/_base.scss b/app/assets/stylesheets/active_admin/_base.scss
index 314b460dd7b..6412b075233 100644
--- a/app/assets/stylesheets/active_admin/_base.scss
+++ b/app/assets/stylesheets/active_admin/_base.scss
@@ -1,4 +1,5 @@
-/* Active Admin CSS */
+// Active Admin CSS
+
 // Normalize
 @import "active_admin/normalize";
 

From bf6add79e8639d2d76cddc8167f315e2a7820f52 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 00:20:00 -0400
Subject: [PATCH 149/170] Change to pagination-per-page and use js- prefix for
 behavior

---
 app/assets/javascripts/active_admin/lib/per_page.js.coffee    | 4 ++--
 .../stylesheets/active_admin/components/_pagination.scss      | 2 +-
 lib/active_admin/views/components/paginated_collection.rb     | 2 +-
 spec/unit/views/components/paginated_collection_spec.rb       | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/active_admin/lib/per_page.js.coffee b/app/assets/javascripts/active_admin/lib/per_page.js.coffee
index dd3ba3ae2fb..e35e2bfc149 100644
--- a/app/assets/javascripts/active_admin/lib/per_page.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/per_page.js.coffee
@@ -23,7 +23,7 @@ class ActiveAdmin.PerPage
     while m = re.exec(query)
       params[@_decode(m[1])] = @_decode(m[2])
     params
-   
+
   _decode: (value) ->
     #replace "+" before decodeURIComponent
     decodeURIComponent(value.replace(/\+/g, '%20'))
@@ -39,4 +39,4 @@ class ActiveAdmin.PerPage
 $.widget.bridge 'perPage', ActiveAdmin.PerPage
 
 $(document).on 'ready page:load turbolinks:load', ->
-  $('.pagination_per_page select').perPage()
+  $('.js-pagination-per-page select').perPage()
diff --git a/app/assets/stylesheets/active_admin/components/_pagination.scss b/app/assets/stylesheets/active_admin/components/_pagination.scss
index 24bccc6707a..98d3bcad9a1 100644
--- a/app/assets/stylesheets/active_admin/components/_pagination.scss
+++ b/app/assets/stylesheets/active_admin/components/_pagination.scss
@@ -37,7 +37,7 @@
   float: left;
 }
 
-.pagination_per_page {
+.pagination-per-page {
   float: right;
   margin: 2px 0 0 4px;
 }
diff --git a/lib/active_admin/views/components/paginated_collection.rb b/lib/active_admin/views/components/paginated_collection.rb
index ed54b278834..f11b49d90bd 100644
--- a/lib/active_admin/views/components/paginated_collection.rb
+++ b/lib/active_admin/views/components/paginated_collection.rb
@@ -81,7 +81,7 @@ def build_pagination_with_formats(options)
       end
 
       def build_per_page_select
-        div class: "pagination_per_page" do
+        div class: "pagination-per-page js-pagination-per-page" do
           text_node "Per page:"
           select do
             @per_page.each do |per_page|
diff --git a/spec/unit/views/components/paginated_collection_spec.rb b/spec/unit/views/components/paginated_collection_spec.rb
index b88bf709944..6e8ca9af51d 100644
--- a/spec/unit/views/components/paginated_collection_spec.rb
+++ b/spec/unit/views/components/paginated_collection_spec.rb
@@ -236,7 +236,7 @@ def paginated_collection(*args)
       end
 
       let(:pagination) { paginated_collection(collection, per_page: [1, 2, 3]) }
-      let(:pagination_html) { pagination.find_by_class("pagination_per_page").first }
+      let(:pagination_html) { pagination.find_by_class("pagination-per-page").first }
       let(:pagination_node) { Capybara.string(pagination_html.to_s) }
 
       it "should render per_page select tag" do

From eb0c0962b69c275a3ded8c921ef1fd35e149141a Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 00:38:28 -0400
Subject: [PATCH 150/170] No need to scope blank_slate since we always want
 margin

---
 .../stylesheets/active_admin/components/_blank_slates.scss    | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_blank_slates.scss b/app/assets/stylesheets/active_admin/components/_blank_slates.scss
index a6a85d38da6..bda5ae0df60 100644
--- a/app/assets/stylesheets/active_admin/components/_blank_slates.scss
+++ b/app/assets/stylesheets/active_admin/components/_blank_slates.scss
@@ -5,9 +5,5 @@
 .blank_slate {
   color: $blank-slate-color;
   font-size: 1.3em;
-}
-
-.admin_dashboard .blank_slate,
-.with_sidebar .blank_slate {
   margin: 80px 0;
 }

From 007f578463b34c8ccb1df4501562d8f93c4044fc Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 00:49:30 -0400
Subject: [PATCH 151/170] Fix SelectorFormat and IdSelector warnings for main
 structure

---
 .../active_admin/initializers/tabs.js.coffee         |  2 +-
 app/assets/stylesheets/active_admin/print.scss       |  2 +-
 .../active_admin/structure/_main_structure.scss      | 12 ++++++------
 app/views/layouts/active_admin_logged_out.html.erb   |  4 ++--
 features/step_definitions/additional_web_steps.rb    |  2 +-
 features/step_definitions/batch_action_steps.rb      |  2 +-
 features/step_definitions/layout_steps.rb            |  2 +-
 lib/active_admin/views/pages/base.rb                 |  8 ++++----
 8 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/app/assets/javascripts/active_admin/initializers/tabs.js.coffee b/app/assets/javascripts/active_admin/initializers/tabs.js.coffee
index 33a5dc5cf6e..035523180cf 100644
--- a/app/assets/javascripts/active_admin/initializers/tabs.js.coffee
+++ b/app/assets/javascripts/active_admin/initializers/tabs.js.coffee
@@ -1,3 +1,3 @@
 $(document).on 'ready page:load turbolinks:load', ->
   # Tab navigation
-  $('#active_admin_content .tabs').tabs()
+  $('#js-active-admin-content .tabs').tabs()
diff --git a/app/assets/stylesheets/active_admin/print.scss b/app/assets/stylesheets/active_admin/print.scss
index 988845cf294..5604b39dcbf 100644
--- a/app/assets/stylesheets/active_admin/print.scss
+++ b/app/assets/stylesheets/active_admin/print.scss
@@ -56,7 +56,7 @@ form .actions,
 }
 
 // Content
-#active_admin_content {
+.active-admin-content {
   margin-top: 2em;
 }
 
diff --git a/app/assets/stylesheets/active_admin/structure/_main_structure.scss b/app/assets/stylesheets/active_admin/structure/_main_structure.scss
index 0e4e0fc152a..0242ebbedae 100644
--- a/app/assets/stylesheets/active_admin/structure/_main_structure.scss
+++ b/app/assets/stylesheets/active_admin/structure/_main_structure.scss
@@ -1,28 +1,28 @@
-#active_admin_content {
+.active-admin-content {
   @include clearfix;
   padding: $horizontal-page-margin;
 
   // so index table and filters scroll horizontally
-  &.with_sidebar {
+  &.with-sidebar {
     display: table;
     width: 100%;
   }
 }
 
-#main_content_wrapper {
+.main-content-wrapper {
   float: left;
   width: 100%;
 }
 
-#main_content {
+.main-content {
   margin-right: $sidebar-width + $horizontal-page-margin;
 }
 
-.without_sidebar #main_content {
+.without-sidebar .main-content {
   margin-right: 0;
 }
 
-#sidebar {
+.sidebar-wrapper {
   float: left;
   margin-left: -$sidebar-width;
   width: $sidebar-width;
diff --git a/app/views/layouts/active_admin_logged_out.html.erb b/app/views/layouts/active_admin_logged_out.html.erb
index b8a9442c3eb..12c269c1f89 100644
--- a/app/views/layouts/active_admin_logged_out.html.erb
+++ b/app/views/layouts/active_admin_logged_out.html.erb
@@ -27,13 +27,13 @@
     <% flash_messages.each do |type, message| %>
       <%= content_tag :div, message, class: "flash flash_#{type}" %>
     <% end %>
-    <div id="active_admin_content">
+    <div id="active-admin-content">
       <div class="devise-form-container">
         <%= yield %>
       </div>
     </div>
   </div>
-  <div id="footer">
+  <div id="footer" class="footer">
     <%= yield :footer %>
   </div>
 </div>
diff --git a/features/step_definitions/additional_web_steps.rb b/features/step_definitions/additional_web_steps.rb
index 6fd5dd8103e..84512611da5 100644
--- a/features/step_definitions/additional_web_steps.rb
+++ b/features/step_definitions/additional_web_steps.rb
@@ -69,7 +69,7 @@
 end
 
 Then /^I should see the content "([^"]*)"$/ do |content|
-  expect(page).to have_css '#active_admin_content', text: content
+  expect(page).to have_css '.active-admin-content', text: content
 end
 
 Then /^I should see a validation error "([^"]*)"$/ do |error_message|
diff --git a/features/step_definitions/batch_action_steps.rb b/features/step_definitions/batch_action_steps.rb
index 261a9ef64fa..a95f000f323 100644
--- a/features/step_definitions/batch_action_steps.rb
+++ b/features/step_definitions/batch_action_steps.rb
@@ -46,7 +46,7 @@
 Given /^I submit the batch action form with "([^"]*)"$/ do |action|
   page.find("#batch_action").set action
   form   = page.find "#collection_selection"
-  params = page.all("#main_content input").each_with_object({}) do |input, obj|
+  params = page.all(".main-content input").each_with_object({}) do |input, obj|
     key, value = input['name'], input['value']
     if key == 'collection_selection[]'
       (obj[key] ||= []).push value if input.checked?
diff --git a/features/step_definitions/layout_steps.rb b/features/step_definitions/layout_steps.rb
index 17df723e05c..e34463a5006 100644
--- a/features/step_definitions/layout_steps.rb
+++ b/features/step_definitions/layout_steps.rb
@@ -1,3 +1,3 @@
 Then /^I should see the Active Admin layout$/ do
-  expect(page).to have_css '#active_admin_content #main_content_wrapper'
+  expect(page).to have_css '.active-admin-content .main-content-wrapper'
 end
diff --git a/lib/active_admin/views/pages/base.rb b/lib/active_admin/views/pages/base.rb
index 1c796c829c4..53cc44d7b6c 100644
--- a/lib/active_admin/views/pages/base.rb
+++ b/lib/active_admin/views/pages/base.rb
@@ -71,7 +71,7 @@ def build_title_bar
 
         def build_page_content
           build_flash_messages
-          div id: "active_admin_content", class: (skip_sidebar? ? "without_sidebar" : "with_sidebar") do
+          div id: "js-active-admin-content", class: "active-admin-content " + (skip_sidebar? ? "without-sidebar" : "with-sidebar") do
             build_main_content_wrapper
             build_sidebar unless skip_sidebar?
           end
@@ -86,8 +86,8 @@ def build_flash_messages
         end
 
         def build_main_content_wrapper
-          div id: "main_content_wrapper" do
-            div id: "main_content" do
+          div class: "main-content-wrapper" do
+            div class: "main-content" do
               main_content
             end
           end
@@ -125,7 +125,7 @@ def action_items_for_action
 
         # Renders the sidebar
         def build_sidebar
-          div id: "sidebar" do
+          div class: "sidebar-wrapper" do
             sidebar_sections_for_action.collect do |section|
               sidebar_section(section)
             end

From 3298d4e57dbfb5404b6939f3f8fe502b46939c63 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 01:07:35 -0400
Subject: [PATCH 152/170] Fix as many SelectorFormat warnings as possible

---
 .../active_admin/components/_blank_slates.scss   |  4 ++--
 .../active_admin/components/_comments.scss       |  6 +++---
 .../active_admin/components/_pagination.scss     |  2 +-
 .../active_admin/components/_status_tags.scss    |  2 +-
 app/assets/stylesheets/active_admin/print.scss   |  4 ++--
 features/step_definitions/comment_steps.rb       |  4 ++--
 .../comments/views/active_admin_comments.rb      |  6 +++---
 .../view_helpers/download_format_links_helper.rb |  2 +-
 lib/active_admin/views/components/blank_slate.rb |  4 ++--
 lib/active_admin/views/components/status_tag.rb  |  6 +++---
 .../assets/templates/active_admin.scss           |  2 +-
 spec/unit/views/components/blank_slate_spec.rb   |  4 ++--
 spec/unit/views/components/status_tag_spec.rb    | 16 ++++++++--------
 spec/unit/views/components/table_for_spec.rb     |  4 ++--
 14 files changed, 33 insertions(+), 33 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_blank_slates.scss b/app/assets/stylesheets/active_admin/components/_blank_slates.scss
index bda5ae0df60..044cc7acc2f 100644
--- a/app/assets/stylesheets/active_admin/components/_blank_slates.scss
+++ b/app/assets/stylesheets/active_admin/components/_blank_slates.scss
@@ -1,8 +1,8 @@
-.blank_slate_container {
+.blank-slate-container {
   text-align: center;
 }
 
-.blank_slate {
+.blank-slate {
   color: $blank-slate-color;
   font-size: 1.3em;
   margin: 80px 0;
diff --git a/app/assets/stylesheets/active_admin/components/_comments.scss b/app/assets/stylesheets/active_admin/components/_comments.scss
index b7d8e5b163d..670e054b1a4 100644
--- a/app/assets/stylesheets/active_admin/components/_comments.scss
+++ b/app/assets/stylesheets/active_admin/components/_comments.scss
@@ -1,4 +1,4 @@
-.active_admin_comment {
+.active-admin-comment {
   margin-bottom: 25px;
   max-width: 45em;
 
@@ -9,12 +9,12 @@
   }
 }
 
-.active_admin_comment_meta {
+.active-admin-comment-meta {
   color: $text-muted-color;
   margin-bottom: 5px;
 }
 
-.active_admin_comment_author {
+.active-admin-comment-author {
   color: $primary-color;
   font-weight: $font-weight-bold;
   margin: 0;
diff --git a/app/assets/stylesheets/active_admin/components/_pagination.scss b/app/assets/stylesheets/active_admin/components/_pagination.scss
index 98d3bcad9a1..3e9cba2c8af 100644
--- a/app/assets/stylesheets/active_admin/components/_pagination.scss
+++ b/app/assets/stylesheets/active_admin/components/_pagination.scss
@@ -33,7 +33,7 @@
   }
 }
 
-.download_links {
+.download-links {
   float: left;
 }
 
diff --git a/app/assets/stylesheets/active_admin/components/_status_tags.scss b/app/assets/stylesheets/active_admin/components/_status_tags.scss
index d4582a41933..afcf25b0d0e 100644
--- a/app/assets/stylesheets/active_admin/components/_status_tags.scss
+++ b/app/assets/stylesheets/active_admin/components/_status_tags.scss
@@ -1,4 +1,4 @@
-.status_tag {
+.status-tag {
   border-radius: $status-tag-border-radius;
   color: $status-tag-color;
   padding: $status-tag-padding;
diff --git a/app/assets/stylesheets/active_admin/print.scss b/app/assets/stylesheets/active_admin/print.scss
index 5604b39dcbf..c13a824dc34 100644
--- a/app/assets/stylesheets/active_admin/print.scss
+++ b/app/assets/stylesheets/active_admin/print.scss
@@ -131,11 +131,11 @@ table {
   page-break-inside: avoid;
 }
 
-.active_admin_comment {
+.active-admin-comment {
   padding: 1em 0;
 }
 
-.active_admin_comment_meta {
+.active-admin-comment-meta {
   margin-bottom: 0.7em;
 }
 
diff --git a/features/step_definitions/comment_steps.rb b/features/step_definitions/comment_steps.rb
index 96b26e9d7ac..8c4cad0982f 100644
--- a/features/step_definitions/comment_steps.rb
+++ b/features/step_definitions/comment_steps.rb
@@ -1,9 +1,9 @@
 Then /^I should see a comment by "([^"]*)"$/ do |name|
-  step %{I should see "#{name}" within ".active_admin_comment_author"}
+  step %{I should see "#{name}" within ".active-admin-comment-author"}
 end
 
 When /^I add a comment "([^"]*)"$/ do |comment|
-  step %{I fill in "active_admin_comment_body" with "#{comment}"}
+  step %{I fill in ".active-admin-comment-body" with "#{comment}"}
   step  %{I press "Add Comment"}
 end
 
diff --git a/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb b/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
index f65f833cd41..09d2abcaa7a 100644
--- a/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
+++ b/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
@@ -30,8 +30,8 @@ def build_comments
 
         def build_comment(comment)
           div for: comment do
-            div class: 'active_admin_comment_meta' do
-              span class: 'active_admin_comment_author' do
+            div class: 'active-admin-comment-meta' do
+              span class: 'active-admin-comment-author' do
                 comment.author ? auto_link(comment.author) : I18n.t('active_admin.comments.author_missing')
               end
               span I18n.t('active_admin.comments.commented_on')
@@ -40,7 +40,7 @@ def build_comment(comment)
                 text_node link_to I18n.t('active_admin.comments.delete'), comments_url(comment.id), method: :delete, data: { confirm: I18n.t('active_admin.comments.delete_confirmation') }
               end
             end
-            div class: 'active_admin_comment_body' do
+            div class: 'active-admin-comment-body' do
               simple_format comment.body
             end
           end
diff --git a/lib/active_admin/view_helpers/download_format_links_helper.rb b/lib/active_admin/view_helpers/download_format_links_helper.rb
index df6d0b7c182..ed3595d600e 100644
--- a/lib/active_admin/view_helpers/download_format_links_helper.rb
+++ b/lib/active_admin/view_helpers/download_format_links_helper.rb
@@ -4,7 +4,7 @@ module DownloadFormatLinksHelper
 
       def build_download_format_links(formats = self.class.formats)
         params = request.query_parameters.except :format, :commit
-        div class: "download_links" do
+        div class: "download-links" do
           span I18n.t('active_admin.download')
           formats.each do |format|
             a format.upcase, href: url_for(params: params, format: format)
diff --git a/lib/active_admin/views/components/blank_slate.rb b/lib/active_admin/views/components/blank_slate.rb
index 1ffd11da3e9..7168bbd183a 100644
--- a/lib/active_admin/views/components/blank_slate.rb
+++ b/lib/active_admin/views/components/blank_slate.rb
@@ -5,11 +5,11 @@ class BlankSlate < ActiveAdmin::Component
       builder_method :blank_slate
 
       def default_class_name
-        'blank_slate_container'
+        'blank-slate-container'
       end
 
       def build(content="")
-        @contents = div(content.html_safe, class: "blank_slate")
+        @contents = div(content.html_safe, class: "blank-slate")
       end
 
       def add_child(child)
diff --git a/lib/active_admin/views/components/status_tag.rb b/lib/active_admin/views/components/status_tag.rb
index e6ae56d0168..d583a8dc447 100644
--- a/lib/active_admin/views/components/status_tag.rb
+++ b/lib/active_admin/views/components/status_tag.rb
@@ -11,7 +11,7 @@ def tag_name
       end
 
       def default_class_name
-        'status_tag'
+        'status-tag'
       end
 
       # @overload status_tag(status, options = {})
@@ -24,11 +24,11 @@ def default_class_name
       #
       # @example
       #   status_tag('In Progress')
-      #   # => <span class='status_tag in_progress'>In Progress</span>
+      #   # => <span class='status-tag in_progress'>In Progress</span>
       #
       # @example
       #   status_tag('active', class: 'important', id: 'status_123', label: 'on')
-      #   # => <span class='status_tag active important' id='status_123'>on</span>
+      #   # => <span class='status-tag active important' id='status_123'>on</span>
       #
       def build(status, options = {})
         label = options.delete(:label)
diff --git a/lib/generators/active_admin/assets/templates/active_admin.scss b/lib/generators/active_admin/assets/templates/active_admin.scss
index d3c61f38760..25fca160239 100644
--- a/lib/generators/active_admin/assets/templates/active_admin.scss
+++ b/lib/generators/active_admin/assets/templates/active_admin.scss
@@ -14,4 +14,4 @@
 // Overriding any non-variable SASS must be done after the fact.
 // For example, to change the default status-tag color:
 //
-//   .status_tag { background: #6090DB; }
+//   .status-tag { background: #6090DB; }
diff --git a/spec/unit/views/components/blank_slate_spec.rb b/spec/unit/views/components/blank_slate_spec.rb
index edd26f53798..0f73f0f4b4c 100644
--- a/spec/unit/views/components/blank_slate_spec.rb
+++ b/spec/unit/views/components/blank_slate_spec.rb
@@ -16,12 +16,12 @@
 
     describe '#class_list' do
       subject { super().class_list }
-      it      { is_expected.to include('blank_slate_container') }
+      it      { is_expected.to include('blank-slate-container') }
     end
 
     describe '#content' do
       subject { super().content }
-      it      { is_expected.to include '<div class="blank_slate">There are no Posts yet. <a href="/posts/new">Create one</a></div>' }
+      it      { is_expected.to include '<div class="blank-slate">There are no Posts yet. <a href="/posts/new">Create one</a></div>' }
     end
   end
 end
diff --git a/spec/unit/views/components/status_tag_spec.rb b/spec/unit/views/components/status_tag_spec.rb
index 8d4f26d8789..ae17d7bcfe5 100644
--- a/spec/unit/views/components/status_tag_spec.rb
+++ b/spec/unit/views/components/status_tag_spec.rb
@@ -20,7 +20,7 @@ def status_tag(*args)
 
     describe '#class_list' do
       subject { super().class_list }
-      it      { is_expected.to include('status_tag') }
+      it      { is_expected.to include('status-tag') }
     end
 
     context "when status is 'completed'" do
@@ -33,7 +33,7 @@ def status_tag(*args)
 
       describe '#class_list' do
         subject { super().class_list }
-        it      { is_expected.to include('status_tag') }
+        it      { is_expected.to include('status-tag') }
       end
 
       describe '#class_list' do
@@ -80,7 +80,7 @@ def status_tag(*args)
 
       describe '#class_list' do
         subject { super().class_list }
-        it      { is_expected.to include('status_tag') }
+        it      { is_expected.to include('status-tag') }
       end
 
       describe '#content' do
@@ -94,7 +94,7 @@ def status_tag(*args)
 
       describe '#class_list' do
         subject { super().class_list }
-        it      { is_expected.to include('status_tag') }
+        it      { is_expected.to include('status-tag') }
       end
 
       describe '#content' do
@@ -108,7 +108,7 @@ def status_tag(*args)
 
       describe '#class_list' do
         subject { super().class_list }
-        it      { is_expected.to include('status_tag') }
+        it      { is_expected.to include('status-tag') }
       end
 
       describe '#content' do
@@ -136,7 +136,7 @@ def status_tag(*args)
 
       describe '#class_list' do
         subject { super().class_list }
-        it      { is_expected.to include('status_tag') }
+        it      { is_expected.to include('status-tag') }
       end
 
       describe '#class_list' do
@@ -160,7 +160,7 @@ def status_tag(*args)
 
       describe '#class_list' do
         subject { super().class_list }
-        it      { is_expected.to include('status_tag') }
+        it      { is_expected.to include('status-tag') }
       end
 
       describe '#class_list' do
@@ -184,7 +184,7 @@ def status_tag(*args)
 
       describe '#class_list' do
         subject { super().class_list }
-        it      { is_expected.to include('status_tag') }
+        it      { is_expected.to include('status-tag') }
       end
 
       describe '#class_list' do
diff --git a/spec/unit/views/components/table_for_spec.rb b/spec/unit/views/components/table_for_spec.rb
index d1cabfaf688..dd6a324a1ae 100644
--- a/spec/unit/views/components/table_for_spec.rb
+++ b/spec/unit/views/components/table_for_spec.rb
@@ -281,9 +281,9 @@
       end
 
       it "should render boolean attribute within status tag" do
-        expect(table.find_by_tag("span").first.class_list.to_a.join(' ')).to eq "status_tag yes"
+        expect(table.find_by_tag("span").first.class_list.to_a.join(' ')).to eq "status-tag yes"
         expect(table.find_by_tag("span").first.content).to eq "Yes"
-        expect(table.find_by_tag("span").last.class_list.to_a.join(' ')).to eq "status_tag no"
+        expect(table.find_by_tag("span").last.class_list.to_a.join(' ')).to eq "status-tag no"
         expect(table.find_by_tag("span").last.content).to eq "No"
       end
     end

From b3ed346367e29f6b185e191747fcb4b21ccc7587 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 01:07:58 -0400
Subject: [PATCH 153/170] Don't let a multi word status (e.g. In Progress) wrap

---
 app/assets/stylesheets/active_admin/components/_status_tags.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/app/assets/stylesheets/active_admin/components/_status_tags.scss b/app/assets/stylesheets/active_admin/components/_status_tags.scss
index afcf25b0d0e..d923f4e024e 100644
--- a/app/assets/stylesheets/active_admin/components/_status_tags.scss
+++ b/app/assets/stylesheets/active_admin/components/_status_tags.scss
@@ -3,6 +3,7 @@
   color: $status-tag-color;
   padding: $status-tag-padding;
   text-align: center;
+  white-space: nowrap;
 
   &,
   &.no {

From 12dc8cedc4ea15ed607905d8faa92140be01eb1b Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 13:06:43 -0400
Subject: [PATCH 154/170] Fix a change as this isn't CSS related but a form
 field name

When I renamed the comment component class names to contain hyphens I
thought this was CSS related but I realize now that this line in the
test is actually filling in a form field of the same name as the class.
---
 features/step_definitions/comment_steps.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/features/step_definitions/comment_steps.rb b/features/step_definitions/comment_steps.rb
index 8c4cad0982f..477972ac9d7 100644
--- a/features/step_definitions/comment_steps.rb
+++ b/features/step_definitions/comment_steps.rb
@@ -3,7 +3,7 @@
 end
 
 When /^I add a comment "([^"]*)"$/ do |comment|
-  step %{I fill in ".active-admin-comment-body" with "#{comment}"}
+  step %{I fill in "active_admin_comment_body" with "#{comment}"}
   step  %{I press "Add Comment"}
 end
 

From 0d4ed750f457c5135739d9c10cf885bce126d248 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 14:45:40 -0400
Subject: [PATCH 155/170] Fix all remaining SelectorFormat warnings
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

There are existing CSS classes with underscores but they are not
referenced in any stylesheets so they haven’t been updated. These
changes are to handle Hound warnings which specifically looks in
stylesheets.

* use js- prefixed classes instead for JS specific element lookup
* remove has_nested selector since it’s no longer necessary or used
* panel_contents is no longer used
---
 .../active_admin/lib/batch_actions.js.coffee  |  4 ++--
 .../active_admin/lib/flash.js.coffee          |  4 ++--
 .../stylesheets/active_admin/_header.scss     |  4 ----
 .../components/_batch_actions.scss            |  2 +-
 .../components/_flash_messages.scss           |  4 ++--
 .../active_admin/components/_grid.scss        |  2 +-
 .../active_admin/components/_table_tools.scss |  4 ++--
 .../active_admin/components/_tables.scss      | 14 +++----------
 .../stylesheets/active_admin/print.scss       |  2 +-
 .../layouts/active_admin_logged_out.html.erb  |  2 +-
 features/index/filters.feature                | 20 +++++++++----------
 features/index/index_as_grid.feature          | 16 +++++++--------
 features/index/index_blank_slate.feature      |  2 +-
 .../step_definitions/batch_action_steps.rb    |  4 ++--
 features/step_definitions/flash_steps.rb      |  4 ++--
 features/step_definitions/table_steps.rb      |  2 +-
 features/support/selectors.rb                 |  2 +-
 .../views/components/index_list.rb            |  2 +-
 lib/active_admin/views/components/scopes.rb   |  2 +-
 .../views/components/unsupported_browser.rb   |  2 +-
 lib/active_admin/views/index_as_grid.rb       |  2 +-
 lib/active_admin/views/index_as_table.rb      |  2 +-
 lib/active_admin/views/pages/base.rb          |  4 ++--
 lib/active_admin/views/pages/index.rb         |  2 +-
 lib/active_admin/views/tabbed_navigation.rb   |  1 -
 .../coffeescripts/jquery.aa.flash.js.coffee   |  2 +-
 spec/javascripts/fixtures/flashes.html        |  2 +-
 spec/unit/views/tabbed_navigation_spec.rb     |  3 +--
 28 files changed, 51 insertions(+), 65 deletions(-)

diff --git a/app/assets/javascripts/active_admin/lib/batch_actions.js.coffee b/app/assets/javascripts/active_admin/lib/batch_actions.js.coffee
index 1a9f787b7bf..9b4990a9a8c 100644
--- a/app/assets/javascripts/active_admin/lib/batch_actions.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/batch_actions.js.coffee
@@ -27,8 +27,8 @@ $(document).on 'ready page:load turbolinks:load', ->
 
   if $(".batch_actions_selector").length && $(":checkbox.toggle_all").length
 
-    if $(".paginated_collection table.index_table").length
-      $(".paginated_collection table.index_table").tableCheckboxToggler()
+    if $(".js-index-table").length
+      $(".js-index-table").tableCheckboxToggler()
     else
       $(".paginated_collection").checkboxToggler()
 
diff --git a/app/assets/javascripts/active_admin/lib/flash.js.coffee b/app/assets/javascripts/active_admin/lib/flash.js.coffee
index 734abb0b32e..f497a67804a 100644
--- a/app/assets/javascripts/active_admin/lib/flash.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/flash.js.coffee
@@ -7,8 +7,8 @@ ActiveAdmin.flash =
     reference: ->
       @reference
     constructor: (@message, @type = "notice", close_after) ->
-      @reference = jQuery("<div>").addClass("flash flash_#{@type}").text(@message)
-      jQuery ".flashes"
+      @reference = jQuery("<div>").addClass("flash flash-#{@type}").text(@message)
+      jQuery ".js-flash-messages"
         .append @reference
       @close_after close_after if close_after?
     close_after: (close_after) ->
diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index 29118a918e6..7bc130290db 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -54,10 +54,6 @@
         color: $navbar-link-hover-color;
       }
 
-      &.has_nested:hover > a {
-        z-index: $z-index-navbar; // so top part of sub menu box-shadow doesn't appear over this link
-      }
-
       &:hover ul {
         display: block;
       }
diff --git a/app/assets/stylesheets/active_admin/components/_batch_actions.scss b/app/assets/stylesheets/active_admin/components/_batch_actions.scss
index 5c67015b113..441267d6e85 100644
--- a/app/assets/stylesheets/active_admin/components/_batch_actions.scss
+++ b/app/assets/stylesheets/active_admin/components/_batch_actions.scss
@@ -1,3 +1,3 @@
-.resource_selection_toggle_panel {
+.resource-selection-toggle-panel {
   margin-bottom: 15px;
 }
diff --git a/app/assets/stylesheets/active_admin/components/_flash_messages.scss b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
index ccdfe58ef82..f503244da8d 100644
--- a/app/assets/stylesheets/active_admin/components/_flash_messages.scss
+++ b/app/assets/stylesheets/active_admin/components/_flash_messages.scss
@@ -4,12 +4,12 @@
   font-weight: $flash-message-font-weight;
   padding: $flash-message-padding;
 
-  &.flash_notice {
+  &.flash-notice {
     background-color: $flash-message-notice-background-color;
     color: $flash-message-notice-text-color;
   }
 
-  &.flash_error {
+  &.flash-error {
     background-color: $flash-message-error-background-color;
     color: $flash-message-error-text-color;
   }
diff --git a/app/assets/stylesheets/active_admin/components/_grid.scss b/app/assets/stylesheets/active_admin/components/_grid.scss
index 4199f743190..8ddc29abb23 100644
--- a/app/assets/stylesheets/active_admin/components/_grid.scss
+++ b/app/assets/stylesheets/active_admin/components/_grid.scss
@@ -1,4 +1,4 @@
-.index_grid td {
+.index-grid td {
   border: none;
 }
 
diff --git a/app/assets/stylesheets/active_admin/components/_table_tools.scss b/app/assets/stylesheets/active_admin/components/_table_tools.scss
index 5f35a7fb554..32676b8e1f8 100644
--- a/app/assets/stylesheets/active_admin/components/_table_tools.scss
+++ b/app/assets/stylesheets/active_admin/components/_table_tools.scss
@@ -9,11 +9,11 @@
   vertical-align: baseline;
 }
 
-.table_tools {
+.table-tools {
   margin-bottom: 15px;
 }
 
-.table_tools_segmented_control {
+.table-tools-segmented-control {
   @include clearfix;
   display: inline-block;
   list-style: none;
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 4be13848945..7bf12c233b1 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -22,7 +22,7 @@ thead {
 }
 
 // -------------------------------------- Index Tables
-.index_table {
+.index-table {
   th {
     a,
     a:link,
@@ -75,16 +75,8 @@ thead {
   }
 }
 
-// -------------------------------------- Tables inside Panels
-.panel_contents table {
-  th,
-  td {
-    padding: $table-condensed-cell-padding;
-  }
-}
-
 // -------------------------------------- Resource Attributes Table
-.attributes_table {
+.attributes-table {
   overflow: hidden;
 
   table {
@@ -109,6 +101,6 @@ thead {
   }
 }
 
-.sidebar-section .attributes_table th {
+.sidebar-section .attributes-table th {
   width: 80px;
 }
diff --git a/app/assets/stylesheets/active_admin/print.scss b/app/assets/stylesheets/active_admin/print.scss
index c13a824dc34..6619cc15aac 100644
--- a/app/assets/stylesheets/active_admin/print.scss
+++ b/app/assets/stylesheets/active_admin/print.scss
@@ -61,7 +61,7 @@ form .actions,
 }
 
 // Tables
-.table_tools {
+.table-tools {
   ul,
   li {
     list-style-type: none;
diff --git a/app/views/layouts/active_admin_logged_out.html.erb b/app/views/layouts/active_admin_logged_out.html.erb
index 12c269c1f89..1591c26b29a 100644
--- a/app/views/layouts/active_admin_logged_out.html.erb
+++ b/app/views/layouts/active_admin_logged_out.html.erb
@@ -25,7 +25,7 @@
 
   <div id="content_wrapper">
     <% flash_messages.each do |type, message| %>
-      <%= content_tag :div, message, class: "flash flash_#{type}" %>
+      <%= content_tag :div, message, class: "flash flash-#{type}" %>
     <% end %>
     <div id="active-admin-content">
       <div class="devise-form-container">
diff --git a/features/index/filters.feature b/features/index/filters.feature
index 3c80f0bebf2..a70d9cd0191 100644
--- a/features/index/filters.feature
+++ b/features/index/filters.feature
@@ -20,7 +20,7 @@ Feature: Index Filtering
     When I fill in "Title" with "Hello World 2"
     And I press "Filter"
     And I should see 1 posts in the table
-    And I should see "Hello World 2" within ".index_table"
+    And I should see "Hello World 2" within ".index-table"
 
   Scenario: Filtering posts with no results
     Given 3 posts exist
@@ -33,7 +33,7 @@ Feature: Index Filtering
 
     When I fill in "Title" with "THIS IS NOT AN EXISTING TITLE!!"
     And I press "Filter"
-    Then I should not see ".index_table"
+    Then I should not see ".index-table"
     And I should not see a sortable table header
     And I should not see pagination
     And I should see "No Posts found"
@@ -52,7 +52,7 @@ Feature: Index Filtering
     When I fill in "Title" with "Hello World 2"
     And I press "Filter"
     And I should see 1 posts in the table
-    And I should see "Hello World 2" within ".index_table"
+    And I should see "Hello World 2" within ".index-table"
 
   Scenario: Checkboxes - Filtering posts written by anyone
     Given 1 post exists
@@ -65,7 +65,7 @@ Feature: Index Filtering
     """
     When I press "Filter"
     Then I should see 2 posts in the table
-    And I should see "Hello World" within ".index_table"
+    And I should see "Hello World" within ".index-table"
     And the "Jane Doe" checkbox should not be checked
 
   Scenario: Checkboxes - Filtering posts written by Jane Doe
@@ -80,7 +80,7 @@ Feature: Index Filtering
     When I check "Jane Doe"
     And I press "Filter"
     Then I should see 1 posts in the table
-    And I should see "Hello World" within ".index_table"
+    And I should see "Hello World" within ".index-table"
     And the "Jane Doe" checkbox should be checked
 
   Scenario: Disabling filters
@@ -102,8 +102,8 @@ Feature: Index Filtering
     When I select "Jane Doe" from "Authors"
     And I press "Filter"
     Then I should see 1 categories in the table
-    And I should see "Non-Fiction" within ".index_table"
-    And I should not see "Mystery" within ".index_table"
+    And I should see "Non-Fiction" within ".index-table"
+    And I should not see "Mystery" within ".index-table"
 
   @javascript
   Scenario: Clearing filter preserves custom parameters
@@ -139,8 +139,8 @@ Feature: Index Filtering
     """
     When I press "Filter"
     Then I should see 2 posts in the table
-    And I should see "Mystery" within ".index_table"
-    And I should see "Non-Fiction" within ".index_table"
+    And I should see "Mystery" within ".index-table"
+    And I should see "Non-Fiction" within ".index-table"
     And the "Jane Doe" checkbox should not be checked
 
   Scenario: Checkboxes - Filtering categories via posts written by Jane Doe
@@ -155,7 +155,7 @@ Feature: Index Filtering
     When I check "Jane Doe"
     And I press "Filter"
     Then I should see 1 categories in the table
-    And I should see "Non-Fiction" within ".index_table"
+    And I should see "Non-Fiction" within ".index-table"
     And the "Jane Doe" checkbox should be checked
 
 
diff --git a/features/index/index_as_grid.feature b/features/index/index_as_grid.feature
index 5a65418133e..b399a7edc8d 100644
--- a/features/index/index_as_grid.feature
+++ b/features/index/index_as_grid.feature
@@ -12,8 +12,8 @@ Feature: Index as Grid
         end
       end
       """
-    Then the table ".index_grid" should have 3 rows
-    And the table ".index_grid" should have 3 columns
+    Then the table ".index-grid" should have 3 rows
+    And the table ".index-grid" should have 3 columns
     And there should be 9 "a" tags within index grid
 
   Scenario: Viewing index as a grid and set the number of columns
@@ -26,9 +26,9 @@ Feature: Index as Grid
         end
       end
       """
-    Then the table ".index_grid" should have 9 rows
-    And the table ".index_grid" should have 1 columns
-    And there should be 9 "a" tags within "table.index_grid"
+    Then the table ".index-grid" should have 9 rows
+    And the table ".index-grid" should have 1 columns
+    And there should be 9 "a" tags within "table.index-grid"
 
   Scenario: Viewing index as a grid with an odd number of items
     Given 9 posts exist
@@ -40,6 +40,6 @@ Feature: Index as Grid
         end
       end
       """
-    Then the table ".index_grid" should have 5 rows
-    And the table ".index_grid" should have 2 columns
-    And there should be 9 "a" tags within "table.index_grid"
+    Then the table ".index-grid" should have 5 rows
+    And the table ".index-grid" should have 2 columns
+    And there should be 9 "a" tags within "table.index-grid"
diff --git a/features/index/index_blank_slate.feature b/features/index/index_blank_slate.feature
index 15eb70fd97e..d27c8f2dda4 100644
--- a/features/index/index_blank_slate.feature
+++ b/features/index/index_blank_slate.feature
@@ -15,7 +15,7 @@ Feature: Index Blank Slate
     Then I should not see a sortable table header
     And I should see "There are no Posts yet."
     And I should see "Create one"
-    And I should not see ".index_table"
+    And I should not see ".index-table"
     And I should not see pagination
     When I follow "Create one"
     Then I should be on the new post page
diff --git a/features/step_definitions/batch_action_steps.rb b/features/step_definitions/batch_action_steps.rb
index a95f000f323..38320abe201 100644
--- a/features/step_definitions/batch_action_steps.rb
+++ b/features/step_definitions/batch_action_steps.rb
@@ -20,7 +20,7 @@
 end
 
 When /^I check the (\d+)(?:st|nd|rd|th) record$/ do |index|
-  page.all("table.index_table input[type=checkbox]")[index.to_i].set true
+  page.all("table.index-table input[type=checkbox]")[index.to_i].set true
 end
 
 When /^I toggle the collection selection$/ do
@@ -32,7 +32,7 @@
 end
 
 Then /^I (should|should not) see the batch action (button|selector)$/ do |maybe, type|
-  selector = "div.table_tools .batch_actions_selector"
+  selector = "div.table-tools .batch_actions_selector"
   selector << ' .button' if maybe == 'should' && type == 'button'
 
   verb = maybe == 'should' ? :to : :to_not
diff --git a/features/step_definitions/flash_steps.rb b/features/step_definitions/flash_steps.rb
index d94c09e083d..129a6c185ef 100644
--- a/features/step_definitions/flash_steps.rb
+++ b/features/step_definitions/flash_steps.rb
@@ -3,9 +3,9 @@
 end
 
 Then /^I should see a successful create flash$/ do
-  expect(page).to have_css 'div.flash_notice', text: /was successfully created/
+  expect(page).to have_css 'div.flash-notice', text: /was successfully created/
 end
 
 Then /^I should not see a successful create flash$/ do
-  expect(page).to_not have_css 'div.flash_notice', text: /was successfully created/
+  expect(page).to_not have_css 'div.flash-notice', text: /was successfully created/
 end
diff --git a/features/step_definitions/table_steps.rb b/features/step_definitions/table_steps.rb
index e803dcb98e9..e502dfd3e30 100644
--- a/features/step_definitions/table_steps.rb
+++ b/features/step_definitions/table_steps.rb
@@ -1,6 +1,6 @@
 Then /^I should see (\d+) ([\w]*) in the table$/ do |count, resource_type|
   expect(page).to \
-    have_css("table.index_table tr > td:first-child", count: count.to_i)
+    have_css("table.index-table tr > td:first-child", count: count.to_i)
 end
 
 # TODO: simplify this, if possible?
diff --git a/features/support/selectors.rb b/features/support/selectors.rb
index e973712185c..cd8cb130785 100644
--- a/features/support/selectors.rb
+++ b/features/support/selectors.rb
@@ -24,7 +24,7 @@ def selector_for(locator)
     #    [:xpath, "//header"]
 
     when "index grid"
-      [:css, "table.index_grid"]
+      [:css, "table.index-grid"]
 
     when /^the "([^"]*)" sidebar$/
       [:css, "##{$1.tr(" ", '').parameterize}-sidebar-section"]
diff --git a/lib/active_admin/views/components/index_list.rb b/lib/active_admin/views/components/index_list.rb
index 80009ebefd4..687f8b3a21e 100644
--- a/lib/active_admin/views/components/index_list.rb
+++ b/lib/active_admin/views/components/index_list.rb
@@ -11,7 +11,7 @@ class IndexList < ActiveAdmin::Component
       include ::ActiveAdmin::Helpers::Collection
 
       def default_class_name
-        "indexes table_tools_segmented_control"
+        "indexes table-tools-segmented-control"
       end
 
       def tag_name
diff --git a/lib/active_admin/views/components/scopes.rb b/lib/active_admin/views/components/scopes.rb
index 2fa83369983..f20001c9d62 100644
--- a/lib/active_admin/views/components/scopes.rb
+++ b/lib/active_admin/views/components/scopes.rb
@@ -14,7 +14,7 @@ class Scopes < ActiveAdmin::Component
 
 
       def default_class_name
-        "scopes table_tools_segmented_control"
+        "scopes table-tools-segmented-control"
       end
 
       def tag_name
diff --git a/lib/active_admin/views/components/unsupported_browser.rb b/lib/active_admin/views/components/unsupported_browser.rb
index 87bf41e8498..186347551e9 100644
--- a/lib/active_admin/views/components/unsupported_browser.rb
+++ b/lib/active_admin/views/components/unsupported_browser.rb
@@ -2,7 +2,7 @@ module ActiveAdmin
   module Views
     class UnsupportedBrowser < Component
       def build
-        add_class 'flash flash_warning'
+        add_class 'flash flash-warning'
 
         para I18n.t("active_admin.unsupported_browser.headline").html_safe
         para I18n.t("active_admin.unsupported_browser.recommendation").html_safe
diff --git a/lib/active_admin/views/index_as_grid.rb b/lib/active_admin/views/index_as_grid.rb
index 37bff683122..3360eee74ec 100644
--- a/lib/active_admin/views/index_as_grid.rb
+++ b/lib/active_admin/views/index_as_grid.rb
@@ -46,7 +46,7 @@ def self.index_name
 
       def build_table
         resource_selection_toggle_panel if active_admin_config.batch_actions.any?
-        table class: "index_grid" do
+        table class: "index-grid" do
           @collection.in_groups_of(number_of_columns).each do |group|
             build_row(group)
           end
diff --git a/lib/active_admin/views/index_as_table.rb b/lib/active_admin/views/index_as_table.rb
index f9364e083a0..08ed58ffd1d 100644
--- a/lib/active_admin/views/index_as_table.rb
+++ b/lib/active_admin/views/index_as_table.rb
@@ -213,7 +213,7 @@ def build(page_presenter, collection)
         table_options = {
           id: "index_table_#{active_admin_config.resource_name.plural}",
           sortable: true,
-          class: "index_table index",
+          class: "index-table js-index-table",
           i18n: active_admin_config.resource_class,
           paginator: page_presenter[:paginator] != false,
           row_class: page_presenter[:row_class]
diff --git a/lib/active_admin/views/pages/base.rb b/lib/active_admin/views/pages/base.rb
index 53cc44d7b6c..7cf095bf155 100644
--- a/lib/active_admin/views/pages/base.rb
+++ b/lib/active_admin/views/pages/base.rb
@@ -78,9 +78,9 @@ def build_page_content
         end
 
         def build_flash_messages
-          div class: 'flashes' do
+          div class: 'js-flash-messages' do
             flash_messages.each do |type, message|
-              div message, class: "flash flash_#{type}"
+              div message, class: "flash flash-#{type}"
             end
           end
         end
diff --git a/lib/active_admin/views/pages/index.rb b/lib/active_admin/views/pages/index.rb
index b65722d8dd2..3dd4f9126e8 100644
--- a/lib/active_admin/views/pages/index.rb
+++ b/lib/active_admin/views/pages/index.rb
@@ -60,7 +60,7 @@ def build_collection
         include ::ActiveAdmin::ViewHelpers::DownloadFormatLinksHelper
 
         def build_table_tools
-          div class: "table_tools" do
+          div class: "table-tools" do
             build_batch_actions_selector
             build_scopes
             build_index_list
diff --git a/lib/active_admin/views/tabbed_navigation.rb b/lib/active_admin/views/tabbed_navigation.rb
index 64c92afc8cd..cc42f53daa0 100644
--- a/lib/active_admin/views/tabbed_navigation.rb
+++ b/lib/active_admin/views/tabbed_navigation.rb
@@ -60,7 +60,6 @@ def build_menu_item(item)
           end
 
           if children.present?
-            li.add_class "has_nested"
             ul do
               children.each { |child| build_menu_item child }
             end
diff --git a/spec/javascripts/coffeescripts/jquery.aa.flash.js.coffee b/spec/javascripts/coffeescripts/jquery.aa.flash.js.coffee
index 34726aaaa64..5c3e8bd9610 100644
--- a/spec/javascripts/coffeescripts/jquery.aa.flash.js.coffee
+++ b/spec/javascripts/coffeescripts/jquery.aa.flash.js.coffee
@@ -1,7 +1,7 @@
 describe "ActiveAdmin.flash", ->
   beforeEach ->
     loadFixtures('flashes.html')
-    @flashes = $(".flashes")
+    @flashes = $(".js-flash-messages")
 
   describe "abstract", ->
     it "should add a flash box with class and message"
diff --git a/spec/javascripts/fixtures/flashes.html b/spec/javascripts/fixtures/flashes.html
index 7559016977f..3202f335a4d 100644
--- a/spec/javascripts/fixtures/flashes.html
+++ b/spec/javascripts/fixtures/flashes.html
@@ -1,2 +1,2 @@
-<div class="flashes">
+<div class="js-flash-messages">
 </div>
diff --git a/spec/unit/views/tabbed_navigation_spec.rb b/spec/unit/views/tabbed_navigation_spec.rb
index e52556fbd08..9e3f6100c2b 100644
--- a/spec/unit/views/tabbed_navigation_spec.rb
+++ b/spec/unit/views/tabbed_navigation_spec.rb
@@ -111,10 +111,9 @@
         expect(html).to have_selector("li.current")
       end
 
-      it "should add the 'current' and 'has_nested' classes to the li and 'current' to the sub li" do
+      it "should add the 'current' class to the li and 'current' to the sub li" do
         assigns[:current_tab] = menu["Reports"]["A Sub Reports"]
         expect(html).to have_selector("li#reports.current")
-        expect(html).to have_selector("li#reports.has_nested")
         expect(html).to have_selector("li#a_sub_reports.current")
       end
 

From 0b909dfa324eb9be4d5d8ff68519fd24042ff389 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 14:48:55 -0400
Subject: [PATCH 156/170] Change default CSS class name to "dropdown"
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This way it doesn’t conflict with the inner CSS class dropdown-menu
which is specified on the actual menu part of the dropdown.

No need to specify a default class name for status_tag component since
the default is sufficient now.
---
 lib/active_admin/views/components/dropdown_menu.rb | 4 ++++
 lib/active_admin/views/components/status_tag.rb    | 4 ----
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/lib/active_admin/views/components/dropdown_menu.rb b/lib/active_admin/views/components/dropdown_menu.rb
index 4d00e49156b..7415393d239 100644
--- a/lib/active_admin/views/components/dropdown_menu.rb
+++ b/lib/active_admin/views/components/dropdown_menu.rb
@@ -16,6 +16,10 @@ module Views
     class DropdownMenu < ActiveAdmin::Component
       builder_method :dropdown_menu
 
+      def default_class_name
+        "dropdown"
+      end
+
       # Build a new action list
       #
       # @param [String] name  The name to display in the button
diff --git a/lib/active_admin/views/components/status_tag.rb b/lib/active_admin/views/components/status_tag.rb
index d583a8dc447..e26fa3501bf 100644
--- a/lib/active_admin/views/components/status_tag.rb
+++ b/lib/active_admin/views/components/status_tag.rb
@@ -10,10 +10,6 @@ def tag_name
         'span'
       end
 
-      def default_class_name
-        'status-tag'
-      end
-
       # @overload status_tag(status, options = {})
       #   @param [String] status the status to display. One of the span classes will be an underscored version of the status.
       #   @param [Hash] options

From 62c9696f351a1b9d8ca8f28b6f288c01fb93d1e9 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 15:27:00 -0400
Subject: [PATCH 157/170] Add explicit CSS classes now using hyphens

Before they were (and still are) generated with underscores. We no
longer use these in the stylesheets but in some cases we have to
specify the classes otherwise styling breaks as it did with comments
and comment form.
---
 .../orm/active_record/comments/views/active_admin_comments.rb | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb b/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
index 09d2abcaa7a..749fbb74021 100644
--- a/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
+++ b/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
@@ -29,7 +29,7 @@ def build_comments
         end
 
         def build_comment(comment)
-          div for: comment do
+          div for: comment, class: 'active-admin-comment' do
             div class: 'active-admin-comment-meta' do
               span class: 'active-admin-comment-author' do
                 comment.author ? auto_link(comment.author) : I18n.t('active_admin.comments.author_missing')
@@ -67,7 +67,7 @@ def comment_form_url
         end
 
         def build_comment_form
-          active_admin_form_for(ActiveAdmin::Comment.new, url: comment_form_url) do |f|
+          active_admin_form_for(ActiveAdmin::Comment.new, html: { class: 'active-admin-comment' }, url: comment_form_url) do |f|
             f.inputs do
               f.input :resource_type, as: :hidden,  input_html: { value: ActiveAdmin::Comment.resource_type(parent.resource) }
               f.input :resource_id,   as: :hidden,  input_html: { value: parent.resource.id }

From 8ed69955c77f8b94b10ed68d27bcee1cb30e97ba Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 15:32:12 -0400
Subject: [PATCH 158/170] Restructure some CSS so selectors aren't so deep

I kept some selectors as they were but several we can move around since
they have specific class names. Being familiar enough with the code
base its a safe change.

Change SelectorDepth max to 4 (from 3).
---
 .scss-style.yml                               |   2 +-
 .../stylesheets/active_admin/_forms.scss      |  15 ++-
 .../stylesheets/active_admin/_header.scss     | 102 +++++++++---------
 .../active_admin/components/_date_picker.scss |  54 +++++-----
 .../active_admin/components/_tables.scss      |  12 +--
 .../comments/views/active_admin_comments.rb   |   2 +-
 .../views/components/attributes_table.rb      |   2 +-
 lib/active_admin/views/header.rb              |   4 +-
 .../views/components/attributes_table_spec.rb |   2 +-
 9 files changed, 97 insertions(+), 98 deletions(-)

diff --git a/.scss-style.yml b/.scss-style.yml
index 282fd6ca48a..68542be04b0 100644
--- a/.scss-style.yml
+++ b/.scss-style.yml
@@ -88,7 +88,7 @@ linters:
     severity: warning
   SelectorDepth:
     enabled: true
-    max_depth: 3
+    max_depth: 4
     severity: warning
   SelectorFormat:
     enabled: true
diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index db209450f66..fcb0c0d72f2 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -71,20 +71,19 @@ textarea {
       padding: 15px;
       width: 100%;
     }
-
-    .has-many-container {
-      h3 {
-        border-bottom: 1px solid darken($panel-background-color, 12%);
-        margin-bottom: 20px;
-      }
-    }
   }
 
   > fieldset {
     padding: 15px;
   }
 
-  // relative so the absolutely-positioned handle will fit
+  .has-many-container {
+    h3 {
+      border-bottom: 1px solid darken($panel-background-color, 12%);
+      margin-bottom: 20px;
+    }
+  }
+
   .has-many-fields {
     border-bottom: 1px solid darken($panel-background-color, 12%);
     margin-bottom: 15px;
diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index 7bc130290db..e4b70a142cd 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -26,67 +26,69 @@
     color: $navbar-color;
     font-size: 1.3em;
   }
+}
 
-  .tabs {
-    display: table-cell;
-    margin: 0;
-    padding: 0 20px;
-    width: 100%;
+.main-utility-navigation {
+  padding: 0;
+  text-align: right;
+  white-space: nowrap;
+}
 
-    > li {
+.main-navigation {
+  display: table-cell;
+  margin: 0;
+  padding: 0 20px;
+  width: 100%;
+
+  // first level navigation items
+  > li {
+    display: inline-block;
+    position: relative;
+
+    &.current > a {
+      background-color: $navbar-link-active-background-color;
+      color: $navbar-link-active-color;
+    }
+
+    &:hover > a {
+      background-color: $navbar-link-hover-background-color;
+      color: $navbar-link-hover-color;
+    }
+
+    &:hover ul {
+      display: block;
+    }
+
+    > a {
       display: inline-block;
+      padding: $navbar-padding-vertical $navbar-padding-horizontal;
       position: relative;
+      transition: background-color 0.15s, color 0.15s;
+    }
+  }
 
-      a {
-        display: inline-block;
-        padding: $navbar-padding-vertical $navbar-padding-horizontal;
-        position: relative;
-        transition: background-color 0.15s, color 0.15s;
-      }
+  // second level (sub menu for current item)
+  ul {
+    background-color: $navbar-background-color;
+    border-radius: 0 0 $navbar-border-radius $navbar-border-radius;
+    display: none;
+    list-style: none;
+    min-width: 175px;
+    padding: 5px 0;
+    position: absolute;
+    z-index: $z-index-navbar;
 
-      &.current > a {
-        background-color: $navbar-link-active-background-color;
-        color: $navbar-link-active-color;
+    > li {
+      > a {
+        display: block;
+        padding: ($navbar-padding-vertical / 2) $navbar-padding-horizontal;
       }
 
-      &:hover > a {
+      &.current a,
+      > a:hover {
         background-color: $navbar-link-hover-background-color;
         color: $navbar-link-hover-color;
       }
-
-      &:hover ul {
-        display: block;
-      }
-
-      ul {
-        background-color: $navbar-background-color;
-        border-radius: 0 0 $navbar-border-radius $navbar-border-radius;
-        display: none;
-        list-style: none;
-        min-width: 175px;
-        padding: 5px 0;
-        position: absolute;
-        z-index: $z-index-navbar;
-
-        li {
-          a {
-            display: block;
-            padding: ($navbar-padding-vertical / 2) $navbar-padding-horizontal;
-          }
-
-          &.current a,
-          a:hover {
-            background-color: $navbar-link-hover-background-color;
-            color: $navbar-link-hover-color;
-          }
-        }
-      }
     }
   }
-
-  .utility-nav {
-    padding: 0;
-    text-align: right;
-    white-space: nowrap;
-  }
 }
diff --git a/app/assets/stylesheets/active_admin/components/_date_picker.scss b/app/assets/stylesheets/active_admin/components/_date_picker.scss
index e1d5be6f2a8..0f9e882dc64 100644
--- a/app/assets/stylesheets/active_admin/components/_date_picker.scss
+++ b/app/assets/stylesheets/active_admin/components/_date_picker.scss
@@ -82,40 +82,38 @@
     text-align: center;
   }
 
-  thead th {
+  th {
     border-bottom: none;
     font-size: 0.9em;
     font-weight: $font-weight-bold;
     padding: 2px 0;
   }
 
-  tbody {
-    td {
-      border: none;
-      height: 22px;
-      width: 22px;
-
-      a {
-        border-radius: $border-radius-base;
-        color: $text-color;
-        display: block;
-        font-size: 0.9em;
-        line-height: 1;
-        padding: 6px 0;
-
-        &:hover {
-          background-color: $date-picker-calendar-link-hover-background-color;
-        }
-
-        &.ui-state-active,
-        &.ui-state-active:hover {
-          background-color: $date-picker-calendar-link-active-background-color;
-        }
-
-        &.ui-state-highlight,
-        &.ui-state-highlight:hover { // today's date
-          background-color: $date-picker-calendar-link-hover-background-color;
-        }
+  td {
+    border: none;
+    height: 22px;
+    width: 22px;
+
+    a {
+      border-radius: $border-radius-base;
+      color: $text-color;
+      display: block;
+      font-size: 0.9em;
+      line-height: 1;
+      padding: 6px 0;
+
+      &:hover {
+        background-color: $date-picker-calendar-link-hover-background-color;
+      }
+
+      &.ui-state-active,
+      &.ui-state-active:hover {
+        background-color: $date-picker-calendar-link-active-background-color;
+      }
+
+      &.ui-state-highlight,
+      &.ui-state-highlight:hover { // today's date
+        background-color: $date-picker-calendar-link-hover-background-color;
       }
     }
   }
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index 7bf12c233b1..d93933f549a 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -91,13 +91,13 @@ thead {
     th {
       width: 180px;
     }
+  }
 
-    td .empty {
-      color: $text-muted-color;
-      font-size: 0.8em;
-      letter-spacing: 0.2em;
-      text-transform: uppercase;
-    }
+  .empty-value {
+    color: $text-muted-color;
+    font-size: 0.8em;
+    letter-spacing: 0.2em;
+    text-transform: uppercase;
   }
 }
 
diff --git a/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb b/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
index 749fbb74021..53db0bd4530 100644
--- a/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
+++ b/lib/active_admin/orm/active_record/comments/views/active_admin_comments.rb
@@ -47,7 +47,7 @@ def build_comment(comment)
         end
 
         def build_empty_message
-          span I18n.t('active_admin.comments.no_comments_yet'), class: 'empty'
+          span I18n.t('active_admin.comments.no_comments_yet'), class: 'empty-value'
         end
 
         def comments_url(*args)
diff --git a/lib/active_admin/views/components/attributes_table.rb b/lib/active_admin/views/components/attributes_table.rb
index cfba14d9de6..14295859ccb 100644
--- a/lib/active_admin/views/components/attributes_table.rb
+++ b/lib/active_admin/views/components/attributes_table.rb
@@ -75,7 +75,7 @@ def header_content_for(attr)
       end
 
       def empty_value
-        span I18n.t('active_admin.empty'), class: "empty"
+        span I18n.t('active_admin.empty'), class: "empty-value"
       end
 
       def content_for(record, attr)
diff --git a/lib/active_admin/views/header.rb b/lib/active_admin/views/header.rb
index d9b9332565c..6a3ee4b9a35 100644
--- a/lib/active_admin/views/header.rb
+++ b/lib/active_admin/views/header.rb
@@ -19,11 +19,11 @@ def build_site_title
       end
 
       def build_global_navigation
-        insert_tag view_factory.global_navigation, @menu, class: 'tabs'
+        insert_tag view_factory.global_navigation, @menu, class: 'main-navigation tabs'
       end
 
       def build_utility_navigation
-        insert_tag view_factory.utility_navigation, @utility_menu, id: "utility_nav", class: 'utility-nav tabs'
+        insert_tag view_factory.utility_navigation, @utility_menu, id: "utility_nav", class: 'main-utility-navigation tabs'
       end
 
     end
diff --git a/spec/unit/views/components/attributes_table_spec.rb b/spec/unit/views/components/attributes_table_spec.rb
index 29535615f11..ce16e417354 100644
--- a/spec/unit/views/components/attributes_table_spec.rb
+++ b/spec/unit/views/components/attributes_table_spec.rb
@@ -78,7 +78,7 @@
           [
             ["Id" , "1"],
             ["Title" , "Hello World"],
-            ["Body" , "<span class=\"empty\">Empty</span>"]
+            ["Body" , "<span class=\"empty-value\">Empty</span>"]
           ].each_with_index do |(title, content), i|
             describe "for #{title}" do
               let(:current_row){ table.find_by_tag("tr")[i] }

From 3a924c0f5cdab6f9812453cd2eeecf9f4188e387 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 15:56:17 -0400
Subject: [PATCH 159/170] Update hound to use our scss-style config file

---
 .hound.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.hound.yml b/.hound.yml
index 59e5ffe2967..075241a13fd 100644
--- a/.hound.yml
+++ b/.hound.yml
@@ -9,6 +9,7 @@ java_script:
 
 scss:
   enabled: false
+  config_file: .scss-style.yml
 
 Metrics/LineLength:
   Max: 110

From 79bcf2a63c99d097dfb8e64bad6cf13fd5efe773 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 16:24:12 -0400
Subject: [PATCH 160/170] Fix behavior for enabling batch actions button

The hyphens in CSS class names are now starting to cause some issues in
JS since these were reliant on auto generated underscore based names.
We really should consider switching all element lookups to using
explicit js- prefixed (separate classes all together) classes instead
as its clearer and easier to work with going forward. Otherwise its
very difficult to tell when a class is used for presentation or
behavior.
---
 .../javascripts/active_admin/lib/batch_actions.js.coffee    | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/active_admin/lib/batch_actions.js.coffee b/app/assets/javascripts/active_admin/lib/batch_actions.js.coffee
index 9b4990a9a8c..2cb733dcb67 100644
--- a/app/assets/javascripts/active_admin/lib/batch_actions.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/batch_actions.js.coffee
@@ -30,10 +30,10 @@ $(document).on 'ready page:load turbolinks:load', ->
     if $(".js-index-table").length
       $(".js-index-table").tableCheckboxToggler()
     else
-      $(".paginated_collection").checkboxToggler()
+      $(".paginated-collection").checkboxToggler()
 
-    $(document).on 'change', '.paginated_collection :checkbox', ->
-      if $(".paginated_collection :checkbox:checked").length
+    $(document).on 'change', '.paginated-collection :checkbox', ->
+      if $(".paginated-collection :checkbox:checked").length
         $(".batch_actions_selector").each -> $(@).aaDropdownMenu("enable")
       else
         $(".batch_actions_selector").each -> $(@).aaDropdownMenu("disable")

From 488345f6bee2b8a191b876c178c00ec8f4cf4dea Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 16:39:43 -0400
Subject: [PATCH 161/170] Fix header changes so utility nav overrides take
 priority

---
 app/assets/stylesheets/active_admin/_header.scss | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_header.scss b/app/assets/stylesheets/active_admin/_header.scss
index e4b70a142cd..9810de14766 100644
--- a/app/assets/stylesheets/active_admin/_header.scss
+++ b/app/assets/stylesheets/active_admin/_header.scss
@@ -28,13 +28,8 @@
   }
 }
 
+.main-navigation,
 .main-utility-navigation {
-  padding: 0;
-  text-align: right;
-  white-space: nowrap;
-}
-
-.main-navigation {
   display: table-cell;
   margin: 0;
   padding: 0 20px;
@@ -92,3 +87,9 @@
     }
   }
 }
+
+.main-utility-navigation {
+  padding: 0;
+  text-align: right;
+  white-space: nowrap;
+}

From be0afde09c43824b49679c8c1f5dd99815633359 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 11 Aug 2015 19:11:17 -0400
Subject: [PATCH 162/170] Fix all ColorVariable warnings
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

While I’m at it I’ve configured most of the Flat UI theme colors we use
in variables with the same matching name from the theme. Some are only
used once but figured it’d be good to just configure them by name so
its easier to find which ones we are using if someone else is curious
or wants to contribute.
---
 .../active_admin/mixins/_variables.scss       | 51 +++++++++++--------
 1 file changed, 30 insertions(+), 21 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/mixins/_variables.scss b/app/assets/stylesheets/active_admin/mixins/_variables.scss
index d9e91674ec5..d5615f9f33b 100644
--- a/app/assets/stylesheets/active_admin/mixins/_variables.scss
+++ b/app/assets/stylesheets/active_admin/mixins/_variables.scss
@@ -23,23 +23,32 @@
 // $blank-slate-border            -> REMOVED
 
 
-// Color theme from Flat UI (color swatch section at http://designmodo.github.io/Flat-UI/)
+// Flat UI (color swatch section at http://designmodo.github.io/Flat-UI/)
+$alizarin-color: #e74c3c !default;
+$asbestos-color: #7f8c8d !default;
+$belize-hole-color: #2980b9 !default;
+$clouds-color: #ecf0f1 !default;
+$emerald-color: #2ecc71 !default;
+$nephritis-color: #27ae60 !default;
+$silver-color: #bdc3c7 !default;
+$sunflower-color: #f1c40f !default;
+$wet-asphalt-color: #34495e !default;
 
 
 //== Scaffolding
 
-$primary-color: #34495e !default;
-$success-color: #2ecc71 !default;
-$warning-color: #f1c40f !default;
-$error-color: #e74c3c !default;
+$primary-color: $wet-asphalt-color !default;
+$success-color: $emerald-color !default;
+$warning-color: $sunflower-color !default;
+$error-color: $alizarin-color !default;
 
 $body-background-color: #fff !default;
 
 $text-color: #3f4c4d !default;
-$text-muted-color: #7f8c8d !default;
+$text-muted-color: $asbestos-color !default;
 
-$link-color: #2980b9 !default;
-$link-hover-color: darken(#2980b9, 5%) !default;
+$link-color: $belize-hole-color !default;
+$link-hover-color: darken($link-color, 5%) !default;
 $link-hover-decoration: underline !default;
 
 //== Typography
@@ -102,8 +111,8 @@ $button-primary-border-color: darken($primary-color, 5%) !default;
 //== Forms
 
 $input-background-color: #fff !default;
-$input-border-color: lighten(#bdc3c7, 5%) !default;
-$input-border-focus-color: darken(#bdc3c7, 5%) !default;
+$input-border-color: lighten($silver-color, 5%) !default;
+$input-border-focus-color: darken($silver-color, 5%) !default;
 $input-border-radius: $border-radius-base !default;
 $input-color: $text-color !default;
 
@@ -131,7 +140,7 @@ $table-border-color: darken($body-background-color, 12%) !default;
 $table-cell-padding: 8px !default;
 $table-condensed-cell-padding: 5px !default;
 
-$table-stripe-color: lighten(#ecf0f1, 4%) !default;
+$table-stripe-color: lighten($clouds-color, 4%) !default;
 $table-selected-color: #fcf9c1 !default;
 
 //== Badges
@@ -145,8 +154,8 @@ $badge-line-height: 1 !default;
 
 //== Breadcrumbs
 
-$breadcrumb-color: #7f8c8d !default;
-$breadcrumb-separator-color: #7f8c8d !default;
+$breadcrumb-color: $asbestos-color !default;
+$breadcrumb-separator-color: $asbestos-color !default;
 $breadcrumb-separator: "/" !default;
 
 //== Flash Messages
@@ -189,9 +198,9 @@ $navbar-link-active-background-color: lighten($primary-color, 8%) !default;
 
 //== Panels
 
-$panel-background-color: lighten(#ecf0f1, 4%) !default;
+$panel-background-color: lighten($clouds-color, 4%) !default;
 $panel-body-padding: 15px !default;
-$panel-heading-background-color: #ecf0f1 !default;
+$panel-heading-background-color: $clouds-color !default;
 $panel-heading-padding: 10px 15px !default;
 $panel-border-radius: $border-radius-base !default;
 
@@ -201,14 +210,14 @@ $status-tag-border-radius: $border-radius-base !default;
 $status-tag-padding: 0.2em 0.5em !default;
 
 $status-tag-color: #fff !default;
-$status-tag-no-background-color: #7f8c8d !default;
-$status-tag-yes-background-color: #27ae60 !default;
+$status-tag-no-background-color: $asbestos-color !default;
+$status-tag-yes-background-color: $nephritis-color !default;
 
 //== Tabs
 
 $tabs-border-color: #d3d3d3 !default;
 
-$tabs-link-hover-background-color: darken(#fff, 10%) !default;
+$tabs-link-hover-background-color: #e6e6e6 !default;
 
 $tabs-active-link-hover-background-color: #fff !default;
 $tabs-active-link-hover-border-color: $tabs-border-color !default;
@@ -216,7 +225,7 @@ $tabs-active-link-hover-color: $text-color !default;
 
 //== Title Bar
 
-$title-bar-background-color: lighten(#ecf0f1, 2%) !default;
+$title-bar-background-color: lighten($clouds-color, 2%) !default;
 $title-bar-color: $text-color !default;
 
 $title-bar-heading-font-size: 1.9em !default;
@@ -228,8 +237,8 @@ $date-picker-header-link-color: #fff !default;
 $date-picker-header-link-hover-color: #fff !default;
 
 $date-picker-calendar-background-color: #fff !default;
-$date-picker-calendar-link-hover-background-color: #ecf0f1 !default;
-$date-picker-calendar-link-active-background-color: darken(#ecf0f1, 10%) !default;
+$date-picker-calendar-link-hover-background-color: $clouds-color !default;
+$date-picker-calendar-link-active-background-color: darken($clouds-color, 10%) !default;
 
 //== Typography
 

From d54baeeb2ccb9890f600e0db1628a61a64b5697e Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 18 Aug 2015 17:40:16 -0400
Subject: [PATCH 163/170] Update html for table sort indicator

Reuse the caret class component and specify up or down based on sort
order. Place the caret next to the text so its not off to the right
edge of the column. Only show the caret if a sort is actually applied.
---
 .../components/_dropdown_menu.scss            | 11 ++++++
 .../active_admin/components/_tables.scss      | 34 +------------------
 .../views/components/table_for.rb             | 13 ++++---
 3 files changed, 21 insertions(+), 37 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
index f66da6a0644..9082fd6920e 100644
--- a/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
+++ b/app/assets/stylesheets/active_admin/components/_dropdown_menu.scss
@@ -5,8 +5,19 @@
   display: inline-block;
   height: 0;
   margin-left: 2px;
+  margin-top: -2px;
   vertical-align: middle;
   width: 0;
+
+  &.down {
+    border-bottom: none;
+    border-top: $caret-width-base dashed;
+  }
+
+  &.up {
+    border-bottom: $caret-width-base dashed;
+    border-top: none;
+  }
 }
 
 .dropdown {
diff --git a/app/assets/stylesheets/active_admin/components/_tables.scss b/app/assets/stylesheets/active_admin/components/_tables.scss
index d93933f549a..71c7fe6a79b 100644
--- a/app/assets/stylesheets/active_admin/components/_tables.scss
+++ b/app/assets/stylesheets/active_admin/components/_tables.scss
@@ -28,42 +28,10 @@ thead {
     a:link,
     a:visited {
       color: $text-color;
-      display: block;
-      position: relative;
+      display: inline-block;
       text-decoration: none;
       white-space: nowrap;
     }
-
-    &.sortable a {
-      &:after,
-      &:before {
-        border-left: 4px solid transparent;
-        border-right: 4px solid transparent;
-        bottom: 100%;
-        content: "";
-        height: 0;
-        position: absolute;
-        right: 0;
-        top: calc(50% - 2px);
-        width: 0;
-      }
-    }
-
-    &.sorted-asc a {
-      padding-right: 11px;
-
-      &:after { // upward pointing arrow
-        border-bottom: 4px solid;
-      }
-    }
-
-    &.sorted-desc a {
-      padding-right: 11px;
-
-      &:before { // downward pointing arrow
-        border-top: 4px solid;
-      }
-    }
   }
 
   tbody tr:nth-of-type(odd) {
diff --git a/lib/active_admin/views/components/table_for.rb b/lib/active_admin/views/components/table_for.rb
index 68a0a972a3b..7f0961c327b 100644
--- a/lib/active_admin/views/components/table_for.rb
+++ b/lib/active_admin/views/components/table_for.rb
@@ -68,13 +68,18 @@ def build_table_header(col)
         sort_key = sortable? && col.sortable? && col.sort_key
         params   = request.query_parameters.except :page, :order, :commit, :format
 
-        classes << 'sortable'                         if sort_key
-        classes << "sorted-#{current_sort[1]}"        if sort_key && current_sort[0] == sort_key
         classes << col.html_class
 
         if sort_key
+          classes << 'sortable'
+
+          caret_classes = Arbre::HTML::ClassList.new
+          caret_classes << 'caret up' if current_sort[0] == sort_key && current_sort[1] == 'asc'
+          caret_classes << 'caret down' if current_sort[0] == sort_key && current_sort[1] == 'desc'
+
           th class: classes do
-            link_to col.pretty_title, params: params, order: "#{sort_key}_#{order_for_sort_key(sort_key)}"
+            text_node link_to col.pretty_title, params: params, order: "#{sort_key}_#{order_for_sort_key(sort_key)}"
+            span class: caret_classes
           end
         else
           th col.pretty_title, class: classes
@@ -139,7 +144,7 @@ class Column
 
         attr_accessor :title, :data , :html_class
 
-        def initialize(*args, &block) 
+        def initialize(*args, &block)
           @options = args.extract_options!
 
           @title = args[0]

From 26d178c9b04a2ab02e9937f0549401e0af4944f0 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Sun, 11 Oct 2015 15:28:02 -0400
Subject: [PATCH 164/170] Fix status_tag spec as it had new test case entry

I knew beforehand that we accepted a PR updating status_tag and it had
a new test case so after rebasing master I had to update this since for
CSS class names we use hyphens now, not underscores.
---
 spec/unit/views/components/status_tag_spec.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/spec/unit/views/components/status_tag_spec.rb b/spec/unit/views/components/status_tag_spec.rb
index ae17d7bcfe5..f59b10f051a 100644
--- a/spec/unit/views/components/status_tag_spec.rb
+++ b/spec/unit/views/components/status_tag_spec.rb
@@ -122,7 +122,7 @@ def status_tag(*args)
 
       describe '#class_list' do
         subject { super().class_list }
-        it      { is_expected.to include('status_tag') }
+        it      { is_expected.to include('status-tag') }
       end
 
       describe '#content' do

From 3713dc58512cbf72b34db45e177a37e9deead861 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 24 Nov 2015 19:04:20 -0500
Subject: [PATCH 165/170] Remove batch_actions.js.coffee after rebase (no
 longer needed)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

We’ve changed this layout already but after rebasing a newer change
moved this code from application.js.coffee to a new file but is no
longer used or needed.
---
 .../active_admin/initializers/batch_actions.js.coffee      | 7 -------
 1 file changed, 7 deletions(-)
 delete mode 100644 app/assets/javascripts/active_admin/initializers/batch_actions.js.coffee

diff --git a/app/assets/javascripts/active_admin/initializers/batch_actions.js.coffee b/app/assets/javascripts/active_admin/initializers/batch_actions.js.coffee
deleted file mode 100644
index fe4a04633be..00000000000
--- a/app/assets/javascripts/active_admin/initializers/batch_actions.js.coffee
+++ /dev/null
@@ -1,7 +0,0 @@
-$(document).on 'ready page:load turbolinks:load', ->
-  # In order for index scopes to overflow properly onto the next line, we have
-  # to manually set its width based on the width of the batch action button.
-  if (batch_actions_selector = $('.table_tools .batch_actions_selector')).length
-    batch_actions_selector.next().css
-      width: "calc(100% - 10px - #{batch_actions_selector.outerWidth()}px)"
-      'float': 'right'

From 5a2339a46adfadc66d9dfffa6faca2a7af57e5c7 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Tue, 24 Nov 2015 22:58:01 -0500
Subject: [PATCH 166/170] Fix failing test due to CSS class name change

---
 features/step_definitions/attribute_steps.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/features/step_definitions/attribute_steps.rb b/features/step_definitions/attribute_steps.rb
index 0d2868ded9a..2aa415e292e 100644
--- a/features/step_definitions/attribute_steps.rb
+++ b/features/step_definitions/attribute_steps.rb
@@ -9,7 +9,7 @@
 end
 
 Then /^the attribute "([^"]*)" should be empty$/ do |title|
-  elems = all ".attributes_table th:contains('#{title}') ~ td > span.empty"
+  elems = all ".attributes-table th:contains('#{title}') ~ td > span.empty-value"
   expect(elems.first).to_not eq(nil), 'attribute not empty'
 end
 

From caf488442035183301752e7897d86fab2a0a5fbe Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 25 Apr 2016 18:40:52 -0400
Subject: [PATCH 167/170] Update new spec to use dashes

This spec file was introduced long after I started this feature branch.
---
 spec/unit/view_helpers/display_helper_spec.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/spec/unit/view_helpers/display_helper_spec.rb b/spec/unit/view_helpers/display_helper_spec.rb
index bad44c99711..45454e26958 100644
--- a/spec/unit/view_helpers/display_helper_spec.rb
+++ b/spec/unit/view_helpers/display_helper_spec.rb
@@ -159,7 +159,7 @@ class ThisModel
 
       value = format_attribute post, :starred
 
-      expect(value.to_s).to eq "<span class=\"status_tag yes\">Yes</span>\n"
+      expect(value.to_s).to eq "<span class=\"status-tag yes\">Yes</span>\n"
     end
   end
 end

From e417f99c85cacc53e99e2896ecc272bbfd008903 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 25 Apr 2016 18:41:06 -0400
Subject: [PATCH 168/170] Fix rendering of draggable grip handle

---
 app/assets/stylesheets/active_admin/_forms.scss | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/active_admin/_forms.scss b/app/assets/stylesheets/active_admin/_forms.scss
index fcb0c0d72f2..ca8107d198a 100644
--- a/app/assets/stylesheets/active_admin/_forms.scss
+++ b/app/assets/stylesheets/active_admin/_forms.scss
@@ -92,14 +92,15 @@ textarea {
     .handle {
       bottom: 0;
       cursor: move;
+      line-height: 6px;
       position: absolute;
       right: 0;
       top: 0;
       width: 20px;
 
       &:before {
-        content: "\1801\1801\1801\1801";
-        font-size: 1.8em;
+        content: "\1801\A\1801\A\1801\A\1801";
+        font-size: 1.6em;
         position: absolute;
       }
     }

From 9a802adf68ea9f9dd1c6e23feadcb306ed29727d Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Thu, 28 Jul 2016 16:43:54 -0400
Subject: [PATCH 169/170] Use correct class name for dropdown component
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This was a name change I made since it was confusing to me. The menu
portion is what pops out. The list of options. The dropdown itself is
the whole component. I should have been more careful on rebasing and
spotting this but in my defense its been a year now since I’ve worked
on this feature branch. Since then I’ve done occasional rebases.
---
 app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee b/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee
index 70e1a4d8352..77198d82359 100644
--- a/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee
+++ b/app/assets/javascripts/active_admin/lib/dropdown-menu.js.coffee
@@ -67,4 +67,4 @@ class ActiveAdmin.DropdownMenu
 $.widget.bridge 'aaDropdownMenu', ActiveAdmin.DropdownMenu
 
 $(document).on 'ready page:load turbolinks:load', ->
-  $('.dropdown_menu').aaDropdownMenu()
+  $('.dropdown').aaDropdownMenu()

From 9dbba4dc072ebb1f4c534c731f6d3e58fc6f9860 Mon Sep 17 00:00:00 2001
From: Javier Julio <jjfutbol@gmail.com>
Date: Mon, 12 Sep 2016 14:15:38 -0400
Subject: [PATCH 170/170] Fix failing test by using hyphen in .attributes-table
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This happens from time to time when rebasing master as these files get
changed and I sometimes miss these sorry on conflicts. Sorry. 😩 All
tests now passing locally.
---
 features/step_definitions/attribute_steps.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/features/step_definitions/attribute_steps.rb b/features/step_definitions/attribute_steps.rb
index 2aa415e292e..0155e5175b8 100644
--- a/features/step_definitions/attribute_steps.rb
+++ b/features/step_definitions/attribute_steps.rb
@@ -1,5 +1,5 @@
 Then /^I should see the attribute "([^"]*)" with "([^"]*)"$/ do |title, value|
-  elems = all ".attributes_table th:contains('#{title}') ~ td:contains('#{value}')"
+  elems = all ".attributes-table th:contains('#{title}') ~ td:contains('#{value}')"
   expect(elems.first).to_not eq(nil), 'attribute missing'
 end