cleaning UI and styling

keram · Jan 22, 2012 · 64a1e83 · 64a1e83
1 parent 78e79f0
commit 64a1e83
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 35 deletions.
diff --git a/app/views/admin/pages/tabs/_snippets_field.html.erb b/app/views/admin/pages/tabs/_snippets_field.html.erb
@@ -1,24 +1,22 @@
 <div id="<%= "part-#{part.id}" %>" class="part-snippets">
-  <h1><%= part.title %></h1>
-  <div class="active-snippets">
+  <div class="active-snippets block">
     <% if part.snippets.before.any? %>
-      <h2><%= t('.before_body') %></h2>
+      <h3><%= t('.before_body') %></h3>
       <ul>
         <%= render :partial => '/admin/pages/tabs/snippets_list_item', :collection => part.snippets.before, :as => :snippet, :locals => {:part => part, :before_body => true} %>
       </ul>
     <% end %>
     <% if part.snippets.after.any? %>
-      <h2><%= t('.after_body') %></h2>
+      <h3><%= t('.after_body') %></h3>
       <ul>
         <%= render :partial => '/admin/pages/tabs/snippets_list_item', :collection => part.snippets.after, :as => :snippet, :locals => {:part => part, :before_body => false} %>
       </ul>
     <% end %>
   </div>
-
-  <div class="inactive-snippets">
+  <div class="inactive-snippets block">
     <% inactive_snippets = Snippet.all %>
     <% if inactive_snippets.length > 0 %>
-      <h2><%= t('.inactive') %></h2>
+      <h3><%= t('.inactive') %></h3>
       <ul>
         <% inactive_snippets.each do |snippet| %>
           <li class='clearfix record <%= cycle('on', 'on-hover') %>' >

diff --git a/public/stylesheets/page-snippet-picker.css b/public/stylesheets/page-snippet-picker.css
@@ -1,4 +1,4 @@
-/* 
+/*
     Document   : page-snippet-picker.css
     Created on : May 16, 2011, 4:41:03 AM
     Author     : keram
@@ -8,63 +8,75 @@
 
 a.add-snippet,
 span.add-snippet {
-	background-repeat: no-repeat;
-	background-position: left center;
-	border: none; 
-	padding-left: 20px;
+    background-repeat: no-repeat;
+    background-position: left center;
+    border: none;
+    padding-left: 20px;
 }
 
 span.add-snippet {
-   float: right;
-   color: lightGray;
-   margin: 3px;
+    float: right;
+    color: lightGray;
+    margin: 3px;
 }
 
 .part-snippets ul {
-	background: #fff;
-	padding: 10px;
-	padding-bottom: 0px;
-	margin-bottom: 5px;
+    background: #fff;
+    padding: 10px;
+    padding-bottom: 0px;
+    margin-bottom: 5px;
 }
 
 .active-snippets ul {
-	margin-bottom: 15px;
+    margin-bottom: 15px;
 }
 
 .inactive-snippets ul {
-	background: #fcfcfc;
+    background: #fcfcfc;
 }
 
 .msg {
-	margin: 5px 5px 10px;
-	padding: 20px;
+    margin: 5px 5px 10px;
+    padding: 20px;
 }
 
 .msg.alert {
-	color: #f66;
-	background: #fff;
-}
-
-#page_snippet_picker h1 {
-   text-align: left;
+    color: #f66;
+    background: #fff;
 }
 
 .part-snippets {
-   margin-bottom: 5ex;
+    margin-bottom: 5ex;
 }
 
 .part-snippets:last-child {
-   margin-bottom: 0;
+    margin-bottom: 0;
 }
 
 #page_snippet_picker div.actions {
-   display: inline;
+    display: inline;
+}
+
+#page_snippet_picker span.title {
+    line-height: 30px;
 }
 
-#part-snippets-menu {
-   margin: 1ex;
+#part-snippets-menu, .part-snippets {
+    margin: 1ex;
 }
 
 #part-snippets-menu li {
-   display: inline;
+    display: inline;
 }
+
+#part-snippets-select {
+    font-weight: bold;
+    width: 21%;
+    font-size: 16px;
+    line-height: 20px;
+}
+
+.part-snippets .block {
+    border-top: solid 1px #99998B;
+    padding-top: 1ex;
+}