From aa8cceef9c84960c776498c4aeed13a9288188b8 Mon Sep 17 00:00:00 2001
From: Paulo Tada <paulohtfs@gmail.com>
Date: Tue, 12 Jul 2016 17:16:15 -0300
Subject: [PATCH] Wrapping the mid content of profile-info page

---
 src/app/profile/info/profile-info.html | 42 +++++++++++++++++++++---------------------
 src/app/profile/profile.html           | 13 ++++++++-----
 src/app/profile/profile.scss           | 21 +++++++++++++++++----
 3 files changed, 46 insertions(+), 30 deletions(-)

diff --git a/src/app/profile/info/profile-info.html b/src/app/profile/info/profile-info.html
index bdffa27..c29c354 100644
--- a/src/app/profile/info/profile-info.html
+++ b/src/app/profile/info/profile-info.html
@@ -34,26 +34,26 @@
 </div>
 
 <div class="container" id="noosfero-profile">
-    <div class="col-sm-2">
-        <noosfero-profile-image [profile]="vm.profile" class="img-avatar-main" data-pin-nopin="true"></noosfero-profile-image>
-        <ul class="social">
-            <li>Facebook</li>
-            <li>Twitter</li>
-            <li>Instagram</li>
-        </ul>
-    </div>
-    <div class="col-sm-10">
-        <h3>{{vm.profile.name}}</h3>
-        <p>Brasília-DF, Brasil</p>
-        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eget fermentum mauris, non viverra felis. In varius, felis et placerat feugiat, massa magna sagittis nisl, ut scelerisque ex urna nec ipsum.</p>
-        <br />
-        <p class="pull-left">www.noosfero.gov.br/<strong>patriciaoliveira</strong></p>
-        <div class="pull-right info-contato">
-          <button ng-click="vm.toggleInformation()" class="btn btn-sm">Informações de Contato</button>
-          <div clas="profile-contact" ng-show="vm.showInformation">
-              <p class="email">patricia@oliveira.com</p>
-              <p class="phone">61 9999-9999</p>
-          </div>
-        </div>
+  <div class="col-sm-2">
+    <noosfero-profile-image [profile]="vm.profile" class="img-avatar-main" data-pin-nopin="true"></noosfero-profile-image>
+    <ul class="social">
+      <li>Facebook</li>
+      <li>Twitter</li>
+      <li>Instagram</li>
+    </ul>
+  </div>
+  <div class="col-sm-10">
+    <h3>{{vm.profile.name}}</h3>
+    <p>Brasília-DF, Brasil</p>
+    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eget fermentum mauris, non viverra felis. In varius, felis et placerat feugiat, massa magna sagittis nisl, ut scelerisque ex urna nec ipsum.</p>
+    <br />
+    <p class="pull-left">www.noosfero.gov.br/<strong>patriciaoliveira</strong></p>
+    <div class="pull-right info-contato">
+      <button ng-click="vm.toggleInformation()" class="btn btn-sm">Informações de Contato</button>
+      <div clas="profile-contact" ng-show="vm.showInformation">
+        <p class="email">patricia@oliveira.com</p>
+        <p class="phone">61 9999-9999</p>
+      </div>
     </div>
+  </div>
 </div>
diff --git a/src/app/profile/profile.html b/src/app/profile/profile.html
index c7841e1..5046108 100644
--- a/src/app/profile/profile.html
+++ b/src/app/profile/profile.html
@@ -5,10 +5,13 @@
                   [profile]="vm.profile">
   </custom-content>
   <div class="row" ui-view="profile-info"></div>
-  <noosfero-boxes ng-if="vm.boxes"
-                  [layout]="vm.profile.layout_template"
-                  [boxes]="vm.boxes"
-                  [owner]="vm.profile" class="row">
-  </noosfero-boxes>
+
+  <div class="wrapper-container">
+    <noosfero-boxes ng-if="vm.boxes"
+                    [layout]="vm.profile.layout_template"
+                    [boxes]="vm.boxes"
+                    [owner]="vm.profile" class="row">
+    </noosfero-boxes>
+  </div>
   <custom-content class="profile-footer" [label]="'profile.custom_footer.label'" [attribute]="'custom_footer'" [profile]="vm.profile"></custom-content>
 </div>
diff --git a/src/app/profile/profile.scss b/src/app/profile/profile.scss
index 477f187..7a4b867 100644
--- a/src/app/profile/profile.scss
+++ b/src/app/profile/profile.scss
@@ -1,3 +1,4 @@
+
 .profile-container {
   @extend .container-fluid;
   margin-top:     -$wrapper-padding-top;
@@ -9,6 +10,11 @@
   }
 }
 
+.wrapper-container {
+  margin: auto;
+  max-width: 980px;
+}
+
 #profile-left {
   text-align: center;
   margin-top: 15px;
@@ -146,6 +152,12 @@ a{
 /* NOOSFERO PROFILE */
 .bg-image {}
 
+@mixin profile-img {
+  text-align: center;
+  margin: 10px;
+  border: 1px solid #eee;
+}
+
 #noosfero-profile {
   background:#fff;
   margin: -200px auto auto;
@@ -155,9 +167,11 @@ a{
   border:1px solid #eee;
   padding:20px 0;
   font-size: 14px;
-  img, i {
-    text-align: center;
-    margin:10px; border:1px solid #eee;
+  img {
+    @include profile-img;
+  }
+  i {
+    @include profile-img;
   }
   .col-sm-2 {
     text-align: center;
@@ -171,7 +185,6 @@ a{
   }
   .profile-contact {
     padding-top: 10px;
-  
     p {
       margin: 0px;
     }
--
libgit2 0.21.2