From d9749c8d36750136cbd8989918b1fec8ff2c4b49 Mon Sep 17 00:00:00 2001
From: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>
Date: Tue, 24 Nov 2015 16:51:01 +0100
Subject: Improve UI for group members page

Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>
---
 .../groups/group_members/_group_member.html.haml   |  4 +-
 app/views/groups/group_members/index.html.haml     | 58 +++++++++++-----------
 2 files changed, 32 insertions(+), 30 deletions(-)

(limited to 'app/views/groups')

diff --git a/app/views/groups/group_members/_group_member.html.haml b/app/views/groups/group_members/_group_member.html.haml
index bae67552a10..a79a0fcdc8e 100644
--- a/app/views/groups/group_members/_group_member.html.haml
+++ b/app/views/groups/group_members/_group_member.html.haml
@@ -4,7 +4,7 @@
 %li{class: "#{dom_class(member)} js-toggle-container", id: dom_id(member)}
   %span{class: ("list-item-name" if show_controls)}
     - if member.user
-      = image_tag avatar_icon(user, 16), class: "avatar s16", alt: ''
+      = image_tag avatar_icon(user, 24), class: "avatar s24", alt: ''
       %strong
         = link_to user.name, user_path(user)
       %span.cgray= user.username
@@ -14,7 +14,7 @@
         %label.label.label-danger
           %strong Blocked
     - else
-      = image_tag avatar_icon(member.invite_email, 16), class: "avatar s16", alt: ''
+      = image_tag avatar_icon(member.invite_email, 24), class: "avatar s24", alt: ''
       %strong
         = member.invite_email
       %span.cgray
diff --git a/app/views/groups/group_members/index.html.haml b/app/views/groups/group_members/index.html.haml
index d4ad33a8bf1..b3a811b2669 100644
--- a/app/views/groups/group_members/index.html.haml
+++ b/app/views/groups/group_members/index.html.haml
@@ -1,38 +1,40 @@
+- @blank_container = true
 - page_title "Members"
 - header_title group_title(@group, "Members", group_group_members_path(@group))
-- if should_user_see_group_roles?(current_user, @group)
-  %p.light
-    Members of group have access to all group projects.
-    Read more about permissions
-    %strong= link_to "here", help_page_path("permissions", "permissions"), class: "vlink"
 
 
-.clearfix.js-toggle-container
-  = form_tag group_group_members_path(@group), method: :get, class: 'form-inline member-search-form'  do
-    .form-group
-      = search_field_tag :search, params[:search], { placeholder: 'Find existing member by name', class: 'form-control search-text-input', spellcheck: false }
-    = button_tag 'Search', class: 'btn'
 
-  - if current_user && current_user.can?(:admin_group_member, @group)
-    .pull-right
-      = button_tag class: 'btn btn-new js-toggle-button', type: 'button' do
-        Add members
-        %i.fa.fa-chevron-down
-
-    .js-toggle-content.hide.new-group-member-holder
-      = render "new_group_member"
 
-.panel.panel-default.prepend-top-20
-  .panel-heading
-    %strong #{@group.name}
-    group members
-    %small
-      (#{@members.total_count})
-  %ul.well-list
-    - @members.each do |member|
-      = render 'groups/group_members/group_member', member: member, show_controls: true
+.group-members-page
+  - if current_user && current_user.can?(:admin_group_member, @group)
+    .panel.panel-default
+      .panel-heading
+        Add new user to group
+      .panel-body
+        - if should_user_see_group_roles?(current_user, @group)
+          %p.light
+            Members of group have access to all group projects.
+            Read more about permissions
+            %strong= link_to "here", help_page_path("permissions", "permissions"), class: "vlink"
+        .new-group-member-holder
+          = render "new_group_member"
 
-= paginate @members, theme: 'gitlab'
+  .panel.panel-default
+    .panel-heading
+      %strong #{@group.name}
+      group members
+      %small
+        (#{@members.total_count})
+      .pull-right
+        = form_tag group_group_members_path(@group), method: :get, class: 'form-inline member-search-form'  do
+          .form-group
+            = search_field_tag :search, params[:search], { placeholder: 'Find existing member by name', class: 'form-control', spellcheck: false }
+          = button_tag class: 'btn' do
+            = icon("search")
+    %ul.content-list
+      - @members.each do |member|
+        = render 'groups/group_members/group_member', member: member, show_controls: true
+    = paginate @members, theme: 'gitlab'
 
 :javascript
   $('form.member-search-form').on('submit', function(event) {
-- 
cgit v1.2.1