From f6752f262049aa0d462c5fd0e6bb783f33fc36ac Mon Sep 17 00:00:00 2001
From: Michel Felipe <mfelipeof@gmail.com>
Date: Thu, 24 Mar 2016 11:39:26 -0300
Subject: [PATCH] Changes into sass on profile-info and use moment dateFormat filter

---
 src/app/index.scss                             |  1 +
 src/app/layout/scss/_layout.scss               | 38 ++++++++++++++++++++++++++++++++++++++
 src/app/profile/image/image.scss               |  6 +++++-
 src/app/profile/info/profile-info.component.ts |  3 ++-
 src/app/profile/info/profile-info.html         |  2 +-
 5 files changed, 47 insertions(+), 3 deletions(-)
 create mode 100644 src/app/layout/scss/_layout.scss

diff --git a/src/app/index.scss b/src/app/index.scss
index 22b0979..af07f5c 100644
--- a/src/app/index.scss
+++ b/src/app/index.scss
@@ -68,3 +68,4 @@ h1, h2, h3, h4, h5 {
 @import "../../bower_components/bootswatch/flatly/_bootswatch.scss";
 @import "layout/scss/mixins";
 @import "layout/scss/bootstrap-overrides";
+@import "layout/scss/layout"
diff --git a/src/app/layout/scss/_layout.scss b/src/app/layout/scss/_layout.scss
new file mode 100644
index 0000000..ed1684d
--- /dev/null
+++ b/src/app/layout/scss/_layout.scss
@@ -0,0 +1,38 @@
+/* MAINBOX */
+.main-box {
+		border: 1px solid #e7ebee;
+    box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
+    margin-bottom: 16px;
+    /* overflow: hidden; */
+    @include border-radius($border-radius-base);
+
+	@media (max-width: $break-xs-max) {
+		margin-bottom: 10px;
+	}
+
+	h2 {
+	    font-size: 1.3em;
+	    line-height: 29px;
+	    margin: 0;
+	    padding: 0;
+
+		@media (max-width: $break-xxs-max) {
+			margin-bottom: 5px;
+		}
+	}
+	&.no-header {
+		padding-top: 20px;
+	}
+	.main-box-header {
+	    min-height: 50px;
+	    padding: 10px 20px;
+
+		&.with-border {
+			border-bottom: 1px solid #ecf0f1;
+		}
+	}
+	.main-box-body {
+		padding: 0 20px 20px 20px;
+    text-align: center;
+	}
+}
diff --git a/src/app/profile/image/image.scss b/src/app/profile/image/image.scss
index f2f8fb8..0f67fe7 100644
--- a/src/app/profile/image/image.scss
+++ b/src/app/profile/image/image.scss
@@ -1,3 +1,7 @@
 i.profile-image {
-  color: rgb(44, 62, 80);  
+  color: rgb(44, 62, 80);
+
+  border-radius: 50%;
+  background-clip: padding-box;
+  margin-bottom: 15px;
 }
diff --git a/src/app/profile/info/profile-info.component.ts b/src/app/profile/info/profile-info.component.ts
index 49583e4..2d8cbe0 100644
--- a/src/app/profile/info/profile-info.component.ts
+++ b/src/app/profile/info/profile-info.component.ts
@@ -7,12 +7,13 @@ import {ProfileService} from "../../../lib/ng-noosfero-api/http/profile.service"
     providers: [provide('profileService', { useClass: ProfileService })]
 })
 @Inject(ProfileService)
+@Inject("amDateFormatFilter")
 export class ProfileInfoComponent {
 
     activities: any;
     profile: noosfero.Profile;
 
-    constructor(private profileService: ProfileService) {
+    constructor(private profileService: ProfileService, private amDateFormatFilter: any) {
         this.activate();
     }
 
diff --git a/src/app/profile/info/profile-info.html b/src/app/profile/info/profile-info.html
index 31cd2b6..75880d3 100644
--- a/src/app/profile/info/profile-info.html
+++ b/src/app/profile/info/profile-info.html
@@ -8,7 +8,7 @@
       <div class="main-box-body clearfix">
         <noosfero-profile-image [profile]="vm.profile" class="img-responsive center-block"></noosfero-profile-image>
         <div class="profile-since">
-          {{"profile.member_since" | translate}}: {{vm.profile.created_at}}
+          {{"profile.member_since" | translate}}: {{vm.profile.created_at | amDateFormat:'MMMM YYYY'}}
         </div>
       </div>
     </div>
--
libgit2 0.21.2