Added inputs div to selectable gridlists

concerto · Mar 4, 2012 · d3007fa · d3007fa
1 parent 552a4db
commit d3007fa
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 16 deletions.
diff --git a/app/assets/stylesheets/application/layout/lists-grid-stacked.scss.erb b/app/assets/stylesheets/application/layout/lists-grid-stacked.scss.erb
@@ -12,14 +12,13 @@
 	float: left;
 	min-width: 150px;
 	width:20%;
-	min-height:80px;
-	
-  > div, .cont {
+  min-height:80px;
+
+  .cont {
 		padding: 12px;
 		border-right: solid 1px $grayLight;
 		border-bottom: solid 1px $grayLight;
 		min-height: 64px;
-		display: block;
 		text-decoration:none;
 
 		// these elements come along for the ride by bringing in gridlist-item mixin:
@@ -87,23 +86,38 @@ ul.GL {
       margin-bottom: 6px;
     }
 
-    > li > a {
-      @include border-radius(4px);
-      display: block;
-      border: solid 1px $grayLight;
-      color: $gray;
-      $transition: border linear .1s, background linear .1s;
-      @include transition($transition);
+    > li {
+      > a, > div {
+        @include border-radius(4px);
+        display: block;
+        border: solid 1px $grayLight;
+        color: $gray;
+        $transition: border linear .1s, background linear .1s;
+        @include transition($transition);
+      }
 
-      &:hover {
+      > a:hover {
         background: $concerto-blue-6;
         border: solid 1px $concerto-blue-2;
         text-decoration: none;
+
+        .inp {
+          background: $concerto-blue-4;
+        }
       }
     }
+
+    .inp {
+      float: left;
+      background: $grayLightest;
+      min-height: 46px;
+      padding: 8px 5px;
+      @include border-radius-corners(4px, 0px, 0px, 4px);
+    }
 
     .cont {
       border: none;
+      float: left;
     }
   }
 

diff --git a/app/views/screens/_form.html.erb b/app/views/screens/_form.html.erb
@@ -66,12 +66,13 @@
         <% if @screen.template %>
         <ul class="GL inset-selection small">
           <li>
-            <%= link_to "#" do %>
+            <div>
               <div class="cont">
                 <p><b><%= @screen.template.name %></b></p>
                 <p>by <%= @screen.template.author %></p>
               </div>
-            <% end %>
+              <div class="clear"></div>
+            </div>
           </li>
         </ul>
         <% else %>
@@ -88,12 +89,14 @@
           <% @templates.each do |template| %>
           <li>
             <%= link_to "#" do %>
-              <%= f.radio_button :template_id, template.id %>
-              <%= label_tag(:template_id, template.name) %>
+              <div class="inp">
+                <%= f.radio_button :template_id, template.id %>
+              </div>
               <div class="cont">
                 <p><b><%= template.name %></b></p>
                 <p>by <%= template.author %></p>
               </div>
+              <div class="clear"></div>
             <% end %>
           </li>
           <% end %>