From f35db162cf0120c77075175eb83621dd17e2b4e6 Mon Sep 17 00:00:00 2001
From: Ryan Lerch <rlerch@redhat.com>
Date: Aug 27 2018 09:06:44 +0000
Subject: tidy up the group info page


this tidys up the group info page, matching the newui style
and recent changes to the user profile page.

---

diff --git a/pagure/templates/group_info.html b/pagure/templates/group_info.html
index 40fa3d1..f0c548a 100644
--- a/pagure/templates/group_info.html
+++ b/pagure/templates/group_info.html
@@ -1,9 +1,8 @@
 {% extends "master.html" %}
-{% from "_render_repo.html" import render_repos_as_card %}
+{% from "userprofile_macros.html" import render_repo_listing %}
 
 {% block title %}Group {{ group.group_name }}{% endblock %}
 {% set tag = "groups" %}
-{% from "_browseheader.html" import browse_header %}
 
 {% block header %}
 <link href="{{ url_for('static', filename='vendor/selectize/selectize.bootstrap3.css') }}"
@@ -13,56 +12,68 @@
 {% block content %}
 <div class="bg-light border border-top-0 pt-2">
   <div class="container">
-        {{browse_header(select=tag)}}
-  </div>
-</div>
-<div class="container">
-  <div class="media my-4">
-      <div class="align-self-start mr-3">
-          <span class="fa fa-users fa-fw fa-4x text-muted"></span>
-      </div>
-      <div class="media-body align-self-start">
-        <h3 class="mb-0 font-weight-bold">{{group.display_name }}</h3>
-        {% if group.description %}<div>{{ group.description }}</div>{% endif %}
-        <div><small>
-            formed {{ group.created |humanize }} 
-            by <a href="{{ url_for('ui_ns.view_user', username=group.creator.user)}}">{{ group.creator.user }}</a></small>
+    <div class="media my-4">
+        <div class="align-self-start mr-3">
+            <span class="fa fa-users fa-fw fa-4x text-muted"></span>
         </div>
-      </div>
-      {% if g.authenticated and (member or g.admin)
-        and config.get('ENABLE_GROUP_MNGT') %}
-        <form method="POST" action="{{ url_for('ui_ns.group_delete',
-        group=group.group_name) }}">
-        <div class="btn-group ml-auto">
-          <a href="{{ url_for('ui_ns.edit_group', group=group.group_name) }}"
-             class="btn btn-sm btn-outline-primary">
-              <span class="fa fa-pencil" title="Edit group"></span>&nbsp;Edit 
-          </a>
-            <button
-              onclick="return confirm('Are you sure you want to delete the group `{{group.group_name}}`?');"
-              title="Delete group"
-              class="btn btn-sm btn-outline-danger">
-              <i class="fa fa-trash"></i> &nbsp;Delete
-            </button>
+        <div class="media-body align-self-start">
+          <h3 class="mb-0 font-weight-bold">{{group.display_name }}</h3>
+          {% if group.description %}<div>{{ group.description }}</div>{% endif %}
+          <div><small>
+              formed {{ group.created |humanize }}
+              by <a href="{{ url_for('ui_ns.view_user', username=group.creator.user)}}">{{ group.creator.user }}</a></small>
           </div>
-          {{ form.csrf_token }}
-        </form>
-     {% endif %}
-    </div>
+        </div>
+        {% if g.authenticated and (member or g.admin)
+          and config.get('ENABLE_GROUP_MNGT') %}
+          <form method="POST" action="{{ url_for('ui_ns.group_delete',
+          group=group.group_name) }}">
+          <div class="btn-group ml-auto">
+            <a href="{{ url_for('ui_ns.edit_group', group=group.group_name) }}"
+                class="btn btn-sm btn-outline-primary">
+                <span class="fa fa-pencil" title="Edit group"></span>&nbsp;Edit
+            </a>
+              <button
+                onclick="return confirm('Are you sure you want to delete the group `{{group.group_name}}`?');"
+                title="Delete group"
+                class="btn btn-sm btn-outline-danger">
+                <i class="fa fa-trash"></i> &nbsp;Delete
+              </button>
+            </div>
+            {{ form.csrf_token }}
+          </form>
+        {% endif %}
+      </div>
+  </div>
+</div>
+<div class="container pt-4">
     <div class="row">
       <div class="col-md-8">
-            {{ render_repos_as_card(group.projects, group.projects|count, 'Projects') }}
+          <div class="d-flex align-items-center mb-3">
+            <h4 class="font-weight-bold mb-0">Group Projects</h4>
+            <span class="btn btn-outline-secondary disabled opacity-100 border-0 ml-auto font-weight-bold">{{ group.projects | length }} projects</span>
+          </div>
+        {% if group.projects | length > 0 %}
+        {{render_repo_listing(group.projects)}}
+        {% else %}
+        <div class="alert alert-secondary text-center p-4">
+          no projects
+        </div>
+        {% endif %}
+
       </div>
       <div class="col-md-4">
-        <div class="card">
+        <div class='card'>
           <div class="card-header">
-            Group Members <span class="label label-default">{{group.users|count}}</span>
+            <div class="d-flex align-items-center">
+            <div><strong>{{group.users|count}} Members</strong></div>
             {% if g.authenticated and (member or admin)
                   and config.get('ENABLE_GROUP_MNGT') %}
-              <div id="add_user_button" class="btn btn-secondary btn-sm pull-xs-right">
-                <span class="fa fa-plus"></span>
+              <div id="add_user_button" class="btn btn-outline-primary btn-sm ml-auto">
+                <span class="fa fa-user-plus"></span>
               </div>
             {% endif %}
+            </div>
           </div>
           <div class="list-group list-group-flush">
 
@@ -86,7 +97,7 @@
               {% if g.authenticated and user != group.creator
                     and (member or g.admin)
                     and config.get('ENABLE_GROUP_MNGT') %}
-               <form class="pull-xs-right" method="POST" style="display: inline-block"
+               <form class="float-right" method="POST" style="display: inline-block"
                 action="{{ url_for('ui_ns.group_user_delete',
                     group=group.group_name, user=user.user) }}">
                 {{ form.csrf_token }}
@@ -94,7 +105,7 @@
                   onclick="return confirm('Are you sure to remove user `{{
                     user.user}}` from the group `{{group.group_name}}`?');"
                   title="Remove user from group"
-                  class="btn btn-sm btn-danger">
+                  class="btn btn-sm btn-outline-danger border-0">
                   <i class="fa fa-trash"></i>
                 </button>
               </form>
@@ -102,7 +113,7 @@
             </div>
             {% endfor %}
           </div> <!--list-group-->
-        </div> <!--card-->
+        </div> <!-- card -->
       </div> <!--col-md-4 -->
     </div> <!--row-->
   </div> <!--container-->