_base.css.scss in activeadmin-0.3.2

- old
+ new

@@ -9,10 +9,11 @@
 @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";
+@import "active_admin/components/tables";
 
 body {
   font-family: Helvetica, Arial, sans-serif;
   line-height: 150%;
   font-size: 72%;
@@ -23,40 +24,56 @@
 }
 
 // ----------------------------------- Page Title Bar 
 #title_bar {
   @include section-header;
+  @include clearfix;
+  @include box-sizing(border-box);
+  display: table;
+  width: 100%;
   position: relative; 
   margin: 0; 
   padding: 10px $horizontal-page-margin; 
 
+  #titlebar_left, #titlebar_right {
+    height: 50px;
+    vertical-align: middle;
+    display: table-cell;
+  }
+  
+  #titlebar_right {
+    text-align: right;
+  }
+  
   h2 { 
-    margin: 12px 0 5px 0; 
+    margin: 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);
+      display: inline-block;
       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 
+// ----------------------------------- Main Structure
+
+#wrapper {
+  display: table;
+  width: 100%;
+}
+
 #active_admin_content { 
   margin: 0; 
   padding: 25px $horizontal-page-margin; 
   
   #main_content_wrapper { 
@@ -109,13 +126,16 @@
 
 a.button, input[type=submit] { @include dark-button; }
 
 // ----------------------------------- Breadcrumbs 
 .breadcrumb {
-  text-transform: uppercase;
+  display: block;
   font-size: 0.9em;
   font-weight: normal;
+  line-height: 1.0em;
+  margin-bottom: 12px;
+  text-transform: uppercase;
 
   a, a:link {
     color: #8a949e ;
     text-decoration: none;
   }
@@ -162,68 +182,9 @@
   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; }
 