activeadmin 0.3.4 → 0.4.0

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

@@ -3,15 +3,20 @@
   @include primary-gradient;
   @include shadow;
   @include text-shadow(#000);
+  height: 20px;
   overflow: visible;
+  position: relative;
   padding: 9px $horizontal-page-margin;
+  position: relative;
   z-index: 900;
 
   h1 { 
     display: inline-block; 
     color: #cdcdcd;
+    float: left;
     margin-right: 20px; 
     margin-bottom: 0px;
+    padding-top: 3px;
     font-size: 1.3em; 
     font-weight: normal;
     
@@ -21,17 +26,28 @@
       &:hover {
         color: #fff;
       }
-      
     } 
+    
+    img {
+      position: relative;
+      top: -2px;
+    }
   }
 
   a, a:link { color: #cdcdcd; }
 
+  .header-item {
+    float: left;
+    top: 2px;
+    position: relative;
+    height: 20px
+  }
+
   ul#tabs {
-    margin: 0; 
-    padding: 0; 
     display: inline-block; 
     height: 100%;
+    margin: 0; 
+    padding: 0;
 
     & > li { 
       display: inline-block; 
@@ -108,8 +124,11 @@
   }
 
   #utility_nav { 
-    position: absolute; right: 25px; top: 10px; 
     color: #aaa;
+    float: right;
+    display: inline-block;
+    margin: 0;
+    padding: 0;
     span, a { margin-left: 10px; }
 
     a { text-decoration: none; }

data/app/assets/stylesheets/active_admin/components/_blank_slates.scss

@@ -0,0 +1,31 @@
+.blank_slate_container {
+  clear: both;
+  text-align: center;
+  
+  .blank_slate {
+    @include rounded;
+    -webkit-font-smoothing: antialiased;
+    border: 1px dashed #DADADA;
+    color: #AAA;
+    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;
+}

data/app/assets/stylesheets/active_admin/components/_breadcrumbs.scss

@@ -0,0 +1,20 @@
+.breadcrumb {
+  display: block;
+  font-size: 0.9em;
+  font-weight: normal;
+  line-height: 1.0em;
+  margin-bottom: 12px;
+  text-transform: uppercase;
+
+  a, a:link, a:visited, a:active {
+    color: #8a949e ;
+    text-decoration: none;
+  }
+
+  a:hover { text-decoration: underline; }
+
+  .breadcrumb_sep {
+    margin: 0 2px;
+    color: #aab2ba;
+  }
+}

data/app/assets/stylesheets/active_admin/components/_buttons.scss

@@ -0,0 +1,12 @@
+
+td, p {
+  @include icon(#B3BCC1, 0.8em);
+  span.icon { margin: 0 3px; }
+}
+
+a.member_link {
+  margin-right: 7px;
+  white-space: nowrap;
+}
+
+a.button, a:link.button, a:visited.button, input[type=submit] { @include dark-button; }

data/app/assets/stylesheets/active_admin/components/_flash_messages.css.scss

@@ -9,6 +9,8 @@ body.logged_in {
     line-height: 1.0em;
     margin-bottom: 10px;
     padding: 13px 30px 11px;
+    position: relative;
+    top: -15px;
 
     &.flash_notice {
       @include gradient(#dce9dd, #ccdfcd);

data/app/assets/stylesheets/active_admin/components/_grid.scss

@@ -0,0 +1,9 @@
+// -------------------------------------- Index as Grid 
+table.index_grid td { border: none; background: none; padding: 0 20px 20px 0; margin: 0;}
+
+// -------------------------------------- Columns
+.columns {
+  clear: both;
+  padding: 0;
+  .column { float: left; }
+}

data/app/assets/stylesheets/active_admin/components/_links.scss

@@ -0,0 +1,5 @@
+a, a:link, a:visited {
+  color: $link-color;
+  text-decoration: underline;
+}
+a:hover { text-decoration: none; }

data/app/assets/stylesheets/active_admin/components/_pagination.scss

@@ -0,0 +1,34 @@
+.paginated_collection_contents { 
+  clear: both;
+}
+
+.pagination { 
+  float: right; 
+  font-size: 0.9em; 
+  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;
+  }
+}
+
+.pagination_information { 
+  float: right;
+  margin-bottom: 5px;
+  color: #b3bcc1;
+  b { color: #5c6469; }
+}
+
+.download_links {
+  float: left;
+}

data/app/assets/stylesheets/active_admin/components/_panels.scss

@@ -0,0 +1,6 @@
+// ----------------------------------- Helper class to apply to elements to make them sections
+.section, .panel{ @include section; }
+
+// ----------------------------------- Sidebar Sections 
+
+.sidebar_section { @include section; }

data/app/assets/stylesheets/active_admin/components/_scopes.scss

@@ -0,0 +1,10 @@
+.scopes {
+  li {
+    .count {
+      color: #8e979e;
+      font-weight: normal;
+      font-size: 0.9em;
+      line-height: 10px;
+    }
+  }
+}

data/app/assets/stylesheets/active_admin/components/_status_tags.scss

@@ -0,0 +1,12 @@
+.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; }
+}

data/app/assets/stylesheets/active_admin/components/_table_tools.css.scss

@@ -0,0 +1,101 @@
+.table_tools {
+  display: block;
+  margin-bottom: 14px;
+  width: 100%;
+}
+
+.table_tools {
+  .table_tools_button + .table_tools_button {
+    margin-left: 6px;
+  }
+  
+  .table_tools_button + .table_tools_segmented_control {
+    margin-left: 6px;
+  }
+  
+  .table_tools_segmented_control + .table_tools_button {
+    margin-left: 6px;
+  }
+}
+
+a.table_tools_button {
+  @include light-button;
+  font-size: 0.9em;
+  color: #777;
+  text-decoration: none;
+  padding: 4px 14px 4px;
+  position: relative;
+  
+  &.selected {
+    @include box-shadow(0 1px 0px rgba(0,0,0,0.10), 0 0 0 1px #FFF inset, 0 0 10px rgba(120,175,220,0.36));
+    
+    &:active {
+      @include box-shadow(0 1px 0px rgba(0,0,0,0.10), 0 0 0 1px #FFF inset, 0 0 10px rgba(120,175,220,0.36), 0, 1px, 2px, rgba(0,0,0,0.30));
+    }
+  }
+
+  &.dropdown_button {
+    padding-right: 20px;
+    
+    .arrow {
+      border-color: #777 transparent transparent;
+      border-style: solid;
+      border-width: 3px 3px 0;
+      height: 0;
+      position: absolute;
+      top: 8px;
+      right: 9px;
+      width: 0;
+    }
+  }
+
+}
+
+.table_tools_segmented_control {
+  display: inline-block;
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+  
+  li {
+    display: inline-block;
+    list-style-image: none;
+    list-style-type: none;
+    margin-left: -7px;
+    white-space: nowrap;
+    
+    a {
+      border-radius: 0px;
+    }
+    
+    &:first-child {
+      margin-left: 0;
+      
+      a {
+        border-top-left-radius: 12px;
+        border-bottom-left-radius: 12px;
+      }
+    }
+    
+    &:last-child {
+      a {
+        border-top-right-radius: 12px;
+        border-bottom-right-radius: 12px;
+      }
+    }
+    
+    &.selected {
+      a {
+        background: #F0F0F0;
+        @include box-shadow(0 1px 1px 0 rgba(0,0,0,0.1) inset);
+        color: #8a8a8a;
+        cursor: default;
+        
+        &:hover {
+          color: #8a8a8a;
+        }
+      }
+    }
+  }
+  
+}

data/app/assets/stylesheets/active_admin/components/_tables.css.scss

@@ -16,6 +16,7 @@ table.index_table {
 
   th { 
     @include section-header;
+    border-right: none;
     text-align: left;
     padding-left: $cell-horizontal-padding;
     padding-right: $cell-horizontal-padding;
@@ -24,6 +25,7 @@ table.index_table {
       color: $section-header-text-color;
       text-decoration: none;
       display: block;
+      white-space: nowrap;
     }
 
     &.sortable a {
@@ -35,12 +37,20 @@ table.index_table {
 
     &.sorted-asc, &.sorted-desc {
       @include gradient(darken($secondary-gradient-start, 5%), darken($secondary-gradient-stop, 5%));
-      border-bottom: 1px solid $secondary-gradient-stop;
     }
+    
+    &:last-child {
+      border-right: solid 1px #d4d4d4;
+    }
+    
   }
 
   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;
@@ -63,4 +73,35 @@ table.index_table {
   }
   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 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; }

data/app/assets/stylesheets/active_admin/mixins/_all.css.scss

@@ -7,4 +7,5 @@
 @import "active_admin/mixins/buttons";
 @import "active_admin/mixins/sections";
 @import "active_admin/mixins/utilities";
-
+@import "active_admin/mixins/typography";
+@import "bourbon";

data/app/assets/stylesheets/active_admin/mixins/_buttons.css.scss

@@ -1,27 +1,64 @@
 @mixin default-button {
-  @include shadow;
   @include gradient(lighten($primary-color, 15%), darken($primary-color, 12%));
   @include rounded(200px);
   @include text-shadow(#000);
-  text-decoration: none;
-  margin-right: 3px;
+  @include box-shadow(0 1px 0px rgba(0,0,0,0.10), 0 0 0 1px rgba(255,255,255, 0.2) inset);
+  border: solid 1px #484e53;
+  @include border-colors(#616a71, #484e53, #363b3f);
+  color: #efefef;
+  display: inline-block;
   font-weight: bold;
   font-size: 1.0em;
-  cursor: pointer;
-  padding: .6em 1.4em .5em 1.3em;
-  border: none;
-  color: #efefef;
-  &:hover { color: #fff; @include icon-color(#fff); @include shadow(0, 1px, 3px, #888) }
-  &:active { @include inset-shadow(0, 1px, 2px, #000); }
+  @include sans-family;
+  line-height: 12px;
+  margin-right: 3px;
+  padding: 7px 16px 6px;
+  text-decoration: none;
+  -webkit-font-smoothing: antialiased;
+  
+  &:hover {
+    color: #FFF;
+    @include icon-color(#fff);
+    @include gradient(lighten($primary-color, 18%), darken($primary-color, 9%));
+  }
+  
+  &:active {
+    @include box-shadow(0 1px 3px rgba(0,0,0,0.40) inset, 0 1px 0 0px #FFF);
+    @include gradient(lighten($primary-color, 13%), darken($primary-color, 14%));
+  }
 }
 
 @mixin light-button {
   @include default-button;
-  @include gradient(#f9f9f9, #dddbdb);
+  @include gradient(#fdfdfd, #e8e8e8);
+  @include box-shadow(0 1px 0px rgba(0,0,0,0.10), 0 0 0 1px rgba(255,255,255, 0.8) inset);
+  @include border-colors(#d3d3d3, #c7c7c7, #c2c2c2);
   @include text-shadow;
   color: #777;
-  &:hover { color: #444; @include icon-color(#444) }
-  &:active { @include inset-shadow; }
+  &:hover {
+    @include icon-color(#444);
+    color: #444;
+    @include gradient(#fdfdfd, #eaeaea);
+  }
+  &:active {
+    @include box-shadow(0 1px 3px rgba(0,0,0,0.18) inset, 0 1px 0 0px #EEE);
+    @include gradient(#fcfcfc, #e5e4e5);
+  }
+  
+  &.disabled {
+    color: #777;
+    cursor: default;
+    opacity: 0.6;
+    
+    &:hover {
+      color: #777;
+    }
+    &:active {
+      @include box-shadow(0 1px 0px rgba(0,0,0,0.10), 0 0 0 1px #FFF inset);
+    }
+  }
 }
 
-@mixin dark-button { @include default-button; }
+@mixin dark-button {
+  @include default-button;
+}