cleaned up group edit a little

app/views/groups/edit.html.haml

@@ -9,15 +9,22 @@
   = "Editing Groups"
 
 %ul#group_list
+
 - for group in @groups
-  %li{:class => 'group'}
-    = group.name
+
+  %li.group
+    %h3= group.name
+
     %ul{:id => group.id}
-      dummy person for dropping onto 
-      -for person in group.people
-        %li{:class => 'person', :id => person.id, :from_group_id => group.id}
-          = image_tag(person.profile.image_url(:thumb_small),:size => "30x30")  unless person.profile.image_url.nil?
-          = person.real_name
+      -if group.people.size < 1
+        %li.grey Drag to add people
+
+      -else
+        -for person in group.people
+
+          %li.person{:id => person.id, :from_group_id => group.id}
+            = image_tag(person.profile.image_url(:thumb_small),:size => "30x30") unless person.profile.image_url.nil?
+            = person.real_name
 %p
   %br
   = link_to 'Update Groups', '#', :class => 'button', :id => "move_friends_link"

public/stylesheets/application.css

@@ -577,3 +577,25 @@ h1.big_text {
 .editing, .editing:hover {
   background-color: yellow;
   border: 1px #666666 solid; }
+
+.group {
+  list-style: none; }
+  .group ul {
+    min-height: 20px;
+    margin: 0;
+      margin-left: 1em;
+      margin-bottom: 25px;
+    background-color: #efefef;
+    border: 1px solid #cccccc;
+    border-radius: 3px;
+    list-style: none;
+    padding: 15px; }
+    .group ul li {
+      margin-left: 0;
+      padding: 5px;
+      cursor: move; }
+      .group ul li img {
+        display: inline-block; }
+    .group ul .grey {
+      font-style: italic;
+      color: #666666; }

public/stylesheets/sass/application.sass

@@ -748,3 +748,35 @@ h1.big_text
   :background
     :color yellow
   :border 1px #666 solid
+
+
+.group
+  :list
+    :style none
+  ul
+    :min-height 20px
+    :margin 0
+      :left 1em
+      :bottom 25px
+    :background
+      :color #efefef
+    :border 1px solid #ccc
+    :border
+      :radius 3px
+    :list
+      :style none
+    :padding 15px
+
+    li
+      :margin
+        :left 0
+      :padding 5px 
+      :cursor move
+
+      img
+        :display inline-block
+
+    .grey
+      :font
+        :style italic
+      :color #666