From 0c20b97b2ff8290e2fb2cf494c559501c43fad2b Mon Sep 17 00:00:00 2001
From: Pierre HUBERT <pierre@mail.local>
Date: Sat, 7 Jul 2018 07:27:55 +0200
Subject: [PATCH] Improved header appearance

---
 assets/css/pages/groups/sections/header.css | 16 +++++++++++---
 assets/js/pages/groups/sections/header.js   | 24 +++++++++++++++------
 2 files changed, 30 insertions(+), 10 deletions(-)

diff --git a/assets/css/pages/groups/sections/header.css b/assets/css/pages/groups/sections/header.css
index 6f172a0a..9f8f119a 100644
--- a/assets/css/pages/groups/sections/header.css
+++ b/assets/css/pages/groups/sections/header.css
@@ -4,9 +4,6 @@
  * @author Pierre HUBERT
  */
 
-.group-header {
-    
-}
 
 .group-header .group-icon {
     max-height: 150px;
@@ -19,4 +16,17 @@
 .group-header .col-info .fa {
     margin-right: 10px;
     width: 10px;
+}
+
+.group-header .group-col-icon {
+    text-align: center;
+}
+
+.group-header .group-col-icon span {
+    display: block;
+}
+
+.group-header .col-md-4 {
+    display: table;
+    margin: auto;
 }
\ No newline at end of file
diff --git a/assets/js/pages/groups/sections/header.js b/assets/js/pages/groups/sections/header.js
index cd665c44..71ff29ee 100644
--- a/assets/js/pages/groups/sections/header.js
+++ b/assets/js/pages/groups/sections/header.js
@@ -32,7 +32,7 @@ ComunicWeb.pages.groups.sections.header = {
         var firstColumn = createElem2({
             appendTo: row,
             type: "div",
-            class: "col-lg-8"
+            class: "col-md-4 group-col-icon",
         });
 
         //Group icon
@@ -51,36 +51,46 @@ ComunicWeb.pages.groups.sections.header = {
             innerHTML: info.name
         });
 
-        //Second column : information about the company
+
+        //Second column : Information about the company
         var secondColumn = createElem2({
             appendTo: row,
             type: "div",
-            class: "col-lg-4 col-info"
+            class: "col-md-4"
+        });
+
+        add_p(secondColumn, "Column 2 : Group info");
+
+        //Third column : information about the group
+        var thirdColumn = createElem2({
+            appendTo: row,
+            type: "div",
+            class: "col-md-4 col-info"
         });
 
         //Add join date
         var joinDate = createElem2({
-            appendTo: secondColumn,
+            appendTo: thirdColumn,
             type: "div",
             innerHTML: '<i class="fa fa-clock-o"></i> Created '+ComunicWeb.common.date.timeDiffToStr(info.time_create)+' ago'
         });
 
         //Add number of members
         var joinDate = createElem2({
-            appendTo: secondColumn,
+            appendTo: thirdColumn,
             type: "div",
             innerHTML: '<i class="fa fa-group"></i> '+ info.number_members+' members'
         });
 
         //Display membership level
         if(signed_in())
-            ComunicWeb.pages.groups.sections.membershipBlock.display(info, secondColumn);
+            ComunicWeb.pages.groups.sections.membershipBlock.display(info, thirdColumn);
 
         //If the user is an admin, add a link to configure the page
         if(signed_in() && info.membership == "administrator"){
 
             var settingsLink = createElem2({
-                appendTo: secondColumn,
+                appendTo: thirdColumn,
                 type: "div",
                 class: "a",
                 innerHTML: " <i class='fa fa-gear'></i>Settings"