nsm-activeadmin 0.2.2

data/app/assets/stylesheets/active_admin/_base.css.scss

@@ -0,0 +1,400 @@
+/* Active Admin CSS */
+
+
+// Reset Away!
+@include global-reset;
+
+// Partials
+@import "active_admin/typography";
+@import "active_admin/header";
+@import "active_admin/forms";
+@import "active_admin/components/comments";
+@import "active_admin/components/flash_messages";
+@import "active_admin/components/date_picker";
+
+body {
+  font-family: Helvetica, Arial, sans-serif;
+  line-height: 150%;
+  font-size: 72%;
+  background: #fff;
+  margin: 0;
+  padding: 0;
+  color: $text-color;
+}
+
+// ----------------------------------- Page Title Bar 
+#title_bar {
+  @include section-header;
+  position: relative; 
+  margin: 0; 
+  padding: 10px $horizontal-page-margin; 
+
+  h2 { 
+    margin: 12px 0 5px 0; 
+    padding: 0; 
+    font-size: 2.6em;
+    font-weight: bold;
+  }
+
+  .action_items { 
+    position: absolute; 
+    right: $horizontal-page-margin; 
+    top: 28px;
+
+    a { 
+      @include light-button; 
+      @include icon(#777, 0.8em); 
+      @include gradient(#f9f9f9, #dddbdb);
+      padding: .8em 1.5em .7em 1.5em;
+      border: 1px solid #f8f8f8;
+      span.icon { vertical-align: bottom; margin-right: 4px;} 
+      &:hover{ @include icon-color(#000); }
+      &:active { border: inherit; }
+    }
+  }
+}
+
+// ----------------------------------- Main Structure 
+#active_admin_content { 
+  margin: 0; 
+  padding: 25px $horizontal-page-margin; 
+  
+  #main_content_wrapper { 
+    float: left; 
+    width: 100%; 
+
+    #main_content{ 
+      margin-right: 300px; 
+    }
+  }
+
+  &.without_sidebar #main_content_wrapper #main_content{ margin-right: 0; }
+
+  #sidebar { 
+    float: left; 
+    width: $sidebar-width; 
+    margin-left: -$sidebar-width;
+  }
+}
+
+// ----------------------------------- Footer 
+#footer {
+  padding: 30px 30px;  
+  font-size: 0.8em; 
+  clear: both; 
+
+  p { 
+    padding-top: 10px
+  }
+}
+
+// ----------------------------------- Links 
+a, a:link, a:visited {
+  color: $link-color;
+  text-decoration: underline;
+}
+a:hover { text-decoration: none; }
+
+// ----------------------------------- Buttons 
+
+td, p {
+  @include icon(#B3BCC1, 0.8em);
+  span.icon { margin: 0 3px; }
+}
+
+a.member_link {
+  margin-right: 7px;
+  white-space: nowrap;
+}
+
+a.button, input[type=submit] { @include dark-button; }
+
+// ----------------------------------- Breadcrumbs 
+.breadcrumb {
+  text-transform: uppercase;
+  font-size: 0.9em;
+  font-weight: normal;
+
+  a, a:link {
+    color: #8a949e ;
+    text-decoration: none;
+  }
+
+  a:hover { text-decoration: underline; }
+
+  .breadcrumb_sep {
+    margin: 0 2px;
+    color: #aab2ba;
+  }
+}
+
+// ----------------------------------- Sections & Panels
+// Helper class to apply to elements to make them sections
+.section, .panel{ @include section; }
+
+// ----------------------------------- Blank Slate
+
+.blank_slate_container {
+  text-align: center;
+  
+  .blank_slate {
+    @include rounded;
+    -webkit-font-smoothing: antialiased;
+    border: 1px dashed #DDD;
+    color: #ADB3B6;
+    display: inline-block;
+    font-size: 1.2em;
+    font-weight: bold;
+    padding: 14px 25px;
+    text-align: center;
+    
+    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;
+}
+
+// ----------------------------------- Tables 
+table.index_table {
+  width: 100%;
+  margin-bottom: 10px;
+  border: 0;
+  border-spacing: 0;
+
+
+  th { 
+    @include section-header;
+    text-align: left;
+    padding-left: $cell-horizontal-padding;
+    padding-right: $cell-horizontal-padding;
+
+    a, a:link, a:visited {
+      color: $section-header-text-color;
+      text-decoration: none;
+      display: block;
+    }
+
+    &.sortable a {
+      background: url(active_admin_image_path('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, &.sorted-desc {
+      @include gradient(darken($secondary-gradient-start, 5%), darken($secondary-gradient-stop, 5%));
+      border-bottom: 1px solid $secondary-gradient-stop;
+    }
+  }
+
+  tr.even td { background: $table-stripe-color; }
+
+  td {
+    padding: 10px $cell-horizontal-padding 8px $cell-horizontal-padding;
+    border-bottom: 1px solid #e8e8e8;
+    vertical-align: top;
+  }
+}
+
+// ----------------------------------- Tables inside Panels
+
+.panel_contents table {
+  margin-top: 5px;
+  th { 
+    padding-top: 10px;
+    background: none;
+    color: $primary-color;
+    @include no-shadow;
+    @include text-shadow;
+    text-transform: uppercase;
+    border-bottom: 1px solid #ccc;
+  }
+  tr.odd td { background: darken($table-stripe-color, 3%); }
+  tr.even td { background: $table-stripe-color; }
+}
+
+// ----------------------------------- Sidebar Sections 
+.sidebar_section { @include section; }
+
+// -------------------------------------- Pagination 
+.pagination_information { 
+  float: right;
+  margin-bottom: 5px;
+  font-size: 0.95em;
+  color: #b3bcc1;
+  b { color: #5c6469; }
+}
+
+.paginated_collection_contents { 
+  clear: both;
+}
+
+.pagination { 
+  display: inline; 
+  font-size: 0.9; 
+  margin-left: 10px; 
+
+  a { @include light-button; }
+  span.page.current { @include default-button; }
+  a, span.page.current { 
+    @include rounded(0px);
+    margin-right: 4px; 
+    padding: 2px 5px;
+  }
+  span.page.current { padding-left: 7px; }
+}
+
+// -------------------------------------- Index Footer (Under Table) 
+#index_footer { padding-top: 5px; text-align: right; font-size: 0.85em; }
+
+
+
+.index_content { clear: both; }
+
+// -------------------------------------- Index as Grid 
+table.index_grid td { border: none; background: none; padding: 0 20px 20px 0; margin: 0;}
+
+
+// -------------------------------------- Logged Out 
+body.logged_out {
+  background: #e8e9ea;
+
+  #content_wrapper{
+    width: 500px;
+    margin: 70px auto;
+    #active_admin_content {
+      @include shadow;
+      background: #fff;
+      padding: 13px 30px;
+    }
+  }
+
+  h2 {
+    @include section-header;
+    @include primary-gradient;
+    @include text-shadow(#000);
+    color: #fff;
+    margin: -13px -30px 20px -30px;
+  }
+
+  #login {
+    /* Login Form */
+    form {
+      fieldset {
+        @include no-shadow;
+        background: none;
+        padding: 0;
+        li { padding: 10px 0; }
+
+        input[type=text], input[type=email], input[type=password] {
+          width: 70%;
+        }
+        &.buttons { margin-left: 20%; }
+        margin-bottom: 0;
+      }
+    }
+
+    a { float: right; margin-top: -32px; }
+  }
+
+}
+
+// -------------------------------------- Dashboard 
+table.dashboard {
+  width: 100%; 
+  td { border-bottom: none; }
+  .dashboard_section { @include section; }
+}
+
+
+// -------------------------------------- Resource Attributes Table 
+.attributes_table { overflow: hidden; }
+
+.attributes_table table {
+  th, td {
+    padding: 8px $cell-horizontal-padding 6px $cell-horizontal-padding;
+    vertical-align: top;
+    border-bottom: 1px solid #e8e8e8; 
+  }
+  th {
+    @include no-shadow;
+    @include no-gradient;
+    width: 150px;
+    font-size: 0.9em;
+    padding-left: 0;
+    text-transform: uppercase;
+    color: $primary-color;
+    @include text-shadow;
+  }
+  td {
+    .empty {
+      color: #bbb;
+      font-size: 0.8em;
+      text-transform: uppercase;
+      letter-spacing: 0.2em;
+    }
+  }
+}
+
+.sidebar_section .attributes_table th { width: 50px; }
+
+
+// -------------------------------------- Status Tags
+.status {
+  background: darken($secondary-color, 15%);
+  color: #fff;
+  text-transform: uppercase;
+  letter-spacing: 0.15em;
+  padding: 3px 5px 2px 5px;
+  font-size: 0.8em;
+
+  &.ok, &.published, &.complete, &.completed, &.green { background: #8daa92; }
+  &.warn, &.warning, &.orange { background: #e29b20; }
+  &.error, &.errored, &.red { background: #d45f53; }
+
+
+}
+
+
+// -------------------------------------- Scopes
+.scopes {
+  float: left;
+  margin-bottom: 10px;
+  font-size: 1.0em;
+
+  .scope {
+    padding: 4px 8px 3px 8px;
+    margin-right: 4px;
+    a { text-decoration: none; font-weight: bold; color: #888; }
+    a:hover { text-decoration: underline; ; }
+    &.selected { 
+      @include rounded(5px);
+      @include inset-shadow(0,1px,0,#ccc);
+      @include text-shadow;
+      background: #efefef;
+      color: #666;
+      em { font-weight: bold; font-style: normal;  
+      }
+    }
+    .count{ color: #aaa; font-size: 0.9em; }
+  }
+  .scopes_seperator { display: none; }
+}
+
+// -------------------------------------- Columns
+.columns {
+  clear: both;
+  padding: 0;
+  .column { float: left; }
+}

data/app/assets/stylesheets/active_admin/_forms.css.scss

@@ -0,0 +1,256 @@
+// -------------------------------------- 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 }
+
+  fieldset { 
+    border: 0; 
+    padding: 10px 0;
+    margin-bottom: 20px;
+
+    &.inputs { @include section-background; }
+
+    legend {
+      width: 100%;
+      span { display: block; @include section-header; }
+    }
+
+    ol > li {
+      padding: 10px;
+      label {
+        display: block;
+        width: 20%;
+        float: left;
+        font-size: 1.0em;
+        font-weight: bold;
+        color: $section-header-text-color;
+        abbr { border: none; color: #aaa; }
+      }
+    }
+
+
+    ol > li > li label { 
+      line-height:100%; 
+      padding-top:0; 
+      input { 
+        line-height:100%; 
+        vertical-align:middle; 
+        margin-top:-0.1em;
+      }
+    }
+  }
+
+  /* Nested Fieldsets and Legends */
+  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; }
+      }
+
+      ol { 
+        float:left; 
+        width:74%; 
+        margin:0; 
+        padding:0 0 0 20%; 
+
+        li {
+          padding:0; 
+          border:0; 
+        }
+      }
+    }
+  }
+
+  /* Text Fields */
+  input[type=text], input[type=password], input[type=email], input[type=url], input[type=tel], textarea {
+    width: 76%;
+    border: 1px solid #c9d0d6;
+    @include rounded;
+    font-size: 0.95em;
+    outline: none;
+    padding: 8px $text-input-horizontal-padding 7px;
+    
+    &:focus {
+      border: 1px solid #99a2aa;
+      @include shadow(0,0,4px,#99a2aa);
+    }
+  }
+
+  fieldset > ol > li {
+
+    /* Hints */
+    p.inline-hints { 
+      font-size: 0.95em;
+      font-style: italic;
+      color:#666; 
+      margin: 0.5em 0 0 20%;  
+    }
+
+    /* Date and Time Fields */
+    &.date, &.time, &.datetime {
+      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 {
+      height: 1.1em;
+      label { 
+        width: 100%;
+        padding-left:20%; 
+        padding-right: 10px; 
+        text-transform: none !important;
+        font-weight: normal;
+        input { margin:0 0.5em 0 0.2em; }
+      }
+    }
+
+    &.hidden { display: none; }
+
+    /* Errors */
+    p.inline-errors { 
+      text-transform:capitalize;
+      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; }
+    }
+
+    &.error {
+      input[type=text], input[type=password], input[type=email], input[type=url], input[type=tel], textarea {
+        border: 1px solid $error-color;
+      }
+    }
+  }
+
+  /* Buttons */
+  
+  input[type=submit] { @include dark-button; }
+  
+  .buttons { 
+    margin-top: 15px; 
+    input[type=submit] { margin-right: 10px; }
+  }
+  
+  fieldset.buttons li { 
+    float:left; 
+    padding-right:0.5em;
+    padding-top: 0;
+    &.cancel { margin-left: 0.3em; padding: 5px; a { @include light-button; @include icon(#777, 9px);} }
+  }
+
+}
+
+// -------------------------------------- Sidebar Forms 
+
+$sidebar-inner-content-width: $sidebar-width - ($section-padding * 2);
+
+.sidebar_section { 
+
+  label {
+    display: block;
+    text-transform: uppercase;
+    color: $section-header-text-color;
+    font-size: 0.9em;
+    font-weight: bold;
+  }
+
+  select {
+    width: $sidebar-inner-content-width;
+  }
+  
+  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;
+
+$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;
+
+form.filter_form {
+  .filter_form_field {
+    margin-bottom: 10px; 
+    clear: both;
+    
+    &.filter_numeric {
+      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_check_boxes {
+      label { margin-bottom: 3px; }
+      .check_boxes_wrapper label { 
+        font-weight: normal; 
+        margin-bottom: 3px;
+        text-transform: none;
+        font-size: 1.0em;
+        input { vertical-align: baseline; }
+      }
+    }
+
+    &.filter_date_range {
+      .seperator {
+        display: inline-block;
+        text-align: center;
+        width: $filter-field-seperator-width;
+      }
+    
+      input[type=text] {
+        background: #fff url(active_admin_image_path('datepicker/datepicker-input-icon.png')) no-repeat 100% 7px;
+        padding-right: $date-range-filter-input-right-padding;
+        width: $date-range-filter-input-width;
+      }
+    }
+  }
+  a.clear_filters_btn { @include light-button; }
+}
+