From 1bfb34a35ee640300fac48c9f9745fb2fd905b3d Mon Sep 17 00:00:00 2001 From: Max Date: Fri, 17 Jan 2020 16:29:30 +0100 Subject: [PATCH 1/4] Add profile picture in sidenav, Make all profile pictures round --- .../feed/postlist/postlist.component.sass | 15 +++---- .../main-navigation.component.html | 9 ++++- .../main-navigation.component.sass | 15 +++++++ src/app/services/login/login.service.ts | 1 + src/app/services/selfservice/self.service.ts | 39 ++----------------- 5 files changed, 32 insertions(+), 47 deletions(-) diff --git a/src/app/components/feed/postlist/postlist.component.sass b/src/app/components/feed/postlist/postlist.component.sass index 431c00e..7ee04b9 100644 --- a/src/app/components/feed/postlist/postlist.component.sass +++ b/src/app/components/feed/postlist/postlist.component.sass @@ -1,6 +1,7 @@ @import '../../../../styles/mixins.sass' @import '../../../../styles/vars.sass' +$mat-card-header-size: 40px !default .post box-sizing: border-box width: 100% @@ -25,19 +26,13 @@ padding: 0 margin: 0 margin-left: 8px + .profile-picture + border-radius: 50% + width: $mat-card-header-size + height: $mat-card-header-size .activity-info display: contents .span margin-left: 32px -$mat-card-header-size: 100px !default -.profile-picture - height: $mat-card-header-size - width: $mat-card-header-size - border-radius: 50% - flex-shrink: 0 - background-size: cover - transition-duration: 0.5s - z-index: 10 - object-fit: cover diff --git a/src/app/components/main-navigation/main-navigation.component.html b/src/app/components/main-navigation/main-navigation.component.html index 586c6d4..1027467 100644 --- a/src/app/components/main-navigation/main-navigation.component.html +++ b/src/app/components/main-navigation/main-navigation.component.html @@ -8,8 +8,13 @@ fixedInViewport="false" autoFocus="false"> Menu - - Hello, {{user.username}} + +
+ +
+
+ Hello, {{user.username}} +
Home diff --git a/src/app/components/main-navigation/main-navigation.component.sass b/src/app/components/main-navigation/main-navigation.component.sass index 578a8f4..fc8a0dc 100644 --- a/src/app/components/main-navigation/main-navigation.component.sass +++ b/src/app/components/main-navigation/main-navigation.component.sass @@ -4,6 +4,21 @@ .sidenav width: 200px +#name-bar + padding: 0 4px +.mat-card-avatar + display: contents +.profile-picture + width: 52px + height: 52px + border-radius: 50% + flex-shrink: 0 +.hello-text-box + margin-left: 8px + .hello-text + white-space: normal + font-size: initial + .link user-select: none cursor: pointer diff --git a/src/app/services/login/login.service.ts b/src/app/services/login/login.service.ts index 6a26378..b88e013 100644 --- a/src/app/services/login/login.service.ts +++ b/src/app/services/login/login.service.ts @@ -22,6 +22,7 @@ const graphqlQuery = `mutation($email: String!, $pwHash: String!) { handle, points, level, + profilePicture, receivedRequests{id, sender{name, handle, id}}, sentRequests{receiver{id}}, friends { diff --git a/src/app/services/selfservice/self.service.ts b/src/app/services/selfservice/self.service.ts index 9b97659..efb8fb6 100644 --- a/src/app/services/selfservice/self.service.ts +++ b/src/app/services/selfservice/self.service.ts @@ -37,43 +37,11 @@ export class SelfService { } public updateUserInfo(response: any) { - const user: User = new User(); - let friendRequest: FriendRequest = new FriendRequest(); - user.loggedIn = true; - user.userID = response.data.getSelf.id; - user.username = response.data.getSelf.name; - user.handle = response.data.getSelf.handle; - user.email = response.data.getSelf.email; - user.points = response.data.getSelf.points; - user.level = response.data.getSelf.level; - for (const friend of response.data.getSelf.friends) { - user.friends.push(new FriendInfo( - friend.id, - friend.name, - friend.level, - user.buildProfilePictureUrl(friend.profilePicture) - )); - } - for (const group of response.data.getSelf.groups) { - user.groups.push(new GroupInfo(group.id, group.name)); - } - user.chatIDs = response.data.getSelf.chats; - for (const request of response.data.getSelf.sentRequests) { - user.sentRequestUserIDs.push(request.receiver.id); - } - for (const request of response.data.getSelf.receivedRequests) { - friendRequest = new FriendRequest(); - friendRequest.id = request.id; - friendRequest.senderUserID = request.sender.id; - friendRequest.senderUsername = request.sender.name; - friendRequest.senderHandle = request.sender.handle; - user.receivedRequests.push(friendRequest); - } - if (JSON.parse(response.data.getSelf.settings).darkmode === 'true') { - user.darkmode = true; - } + const user = new User(); + user.assignFromResponse(response.data.getSelf); this.data.changeUserInfo(user); } + public fakeLogin() { const user: User = new User(); let friendRequest: FriendRequest = new FriendRequest(); @@ -105,6 +73,7 @@ export class SelfService { handle, points, level, + profilePicture, receivedRequests{id, sender{name, handle, id}}, sentRequests{receiver{id}}, friends { From cd8180c39dc81f227da3c44465c0d0f306fffb35 Mon Sep 17 00:00:00 2001 From: Max Date: Fri, 17 Jan 2020 16:42:49 +0100 Subject: [PATCH 2/4] Improve alignment of userlist --- src/app/components/userlist/userlist.component.sass | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/app/components/userlist/userlist.component.sass b/src/app/components/userlist/userlist.component.sass index c95aa90..24bb128 100644 --- a/src/app/components/userlist/userlist.component.sass +++ b/src/app/components/userlist/userlist.component.sass @@ -9,8 +9,7 @@ user-select: none ::ng-deep .mat-card-header-text width: 1000% - margin: 0 - margin-left: 24px + margin: auto 0 auto 24px .mat-card-subtitle margin: 0 word-break: break-all From f89cd0ad7fc391276c890ed6ffe0f67dde94346f Mon Sep 17 00:00:00 2001 From: Max Date: Fri, 17 Jan 2020 16:43:22 +0100 Subject: [PATCH 3/4] Remove primary color of toolbar in group and profile component --- src/app/components/group/group.component.html | 4 ++-- src/app/components/profile/profile.component.html | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/app/components/group/group.component.html b/src/app/components/group/group.component.html index 854b722..dadc9de 100644 --- a/src/app/components/group/group.component.html +++ b/src/app/components/group/group.component.html @@ -1,7 +1,7 @@
- +
{{groupProfile.name}} @@ -34,7 +34,7 @@ - +
{{groupProfile.name}} diff --git a/src/app/components/profile/profile.component.html b/src/app/components/profile/profile.component.html index 81d38a8..cc5263c 100644 --- a/src/app/components/profile/profile.component.html +++ b/src/app/components/profile/profile.component.html @@ -1,7 +1,7 @@
- +
@@ -43,7 +43,7 @@ - +
From 562664ec5f2aa19a4d0193f2304df2c24f42a86a Mon Sep 17 00:00:00 2001 From: Max Date: Sat, 18 Jan 2020 00:09:10 +0100 Subject: [PATCH 4/4] Make nav bar black in dark mode --- src/app/app.module.ts | 5 +- src/app/components/about/about.component.html | 6 +- src/app/components/about/about.component.sass | 1 - .../feed/postlist/postlist.component.sass | 2 + .../components/imprint/imprint.component.html | 2 +- .../main-navigation.component.html | 11 +- .../main-navigation.component.sass | 7 +- src/app/gv-new-logo.svg | 141 ++++++++++++++++++ src/styles/greenvironment-material-theme.scss | 56 +++---- 9 files changed, 189 insertions(+), 42 deletions(-) create mode 100644 src/app/gv-new-logo.svg diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 1dcd433..99d543d 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -70,6 +70,7 @@ import {MatSnackBarModule} from '@angular/material/snack-bar'; // import logo from 'src/assets/gv-new-logo.svg'; import logo from '!!raw-loader!./gv-new-logo-white.svg'; +import logo_green from '!!raw-loader!./gv-new-logo.svg'; const config: SocketIoConfig = { url: 'http://localhost:4444', options: {} }; @@ -162,6 +163,8 @@ const appRoutes: Routes = [ export class AppModule { constructor(iconRegistry: MatIconRegistry, sanitizer: DomSanitizer) { iconRegistry.addSvgIconLiteral( - 'logo', sanitizer.bypassSecurityTrustHtml(logo)); + 'logo', sanitizer.bypassSecurityTrustHtml(logo)); + iconRegistry.addSvgIconLiteral( + 'logo_green', sanitizer.bypassSecurityTrustHtml(logo_green)); } } diff --git a/src/app/components/about/about.component.html b/src/app/components/about/about.component.html index 1a31a56..13f59fa 100644 --- a/src/app/components/about/about.component.html +++ b/src/app/components/about/about.component.html @@ -5,7 +5,7 @@




Keep it clean and green!

@@ -65,8 +65,8 @@

We believe, that together we can do amazing things to protect our environment and keep it clean and green.

You aren't part of greenvironment yet? - join us now!

- Register + Register
- Login + Login
\ No newline at end of file diff --git a/src/app/components/about/about.component.sass b/src/app/components/about/about.component.sass index be12ffc..d8cea49 100644 --- a/src/app/components/about/about.component.sass +++ b/src/app/components/about/about.component.sass @@ -11,7 +11,6 @@ padding: 2em max-width: 100% min-height: 50% - background-color: mat-color($primary) #text1 padding: 2em diff --git a/src/app/components/feed/postlist/postlist.component.sass b/src/app/components/feed/postlist/postlist.component.sass index 7ee04b9..9ad0f8b 100644 --- a/src/app/components/feed/postlist/postlist.component.sass +++ b/src/app/components/feed/postlist/postlist.component.sass @@ -12,6 +12,8 @@ $mat-card-header-size: 40px !default margin-top: 10px .mat-card-subtitle display: contents + .mat-card-content + overflow: auto a:hover cursor: pointer #button-box diff --git a/src/app/components/imprint/imprint.component.html b/src/app/components/imprint/imprint.component.html index 2828c76..d53a447 100644 --- a/src/app/components/imprint/imprint.component.html +++ b/src/app/components/imprint/imprint.component.html @@ -1,4 +1,4 @@ -Imprint +Imprint

The greenvironment network is being developed by the greenvironment team

Contact

diff --git a/src/app/components/main-navigation/main-navigation.component.html b/src/app/components/main-navigation/main-navigation.component.html index 1027467..80caa1f 100644 --- a/src/app/components/main-navigation/main-navigation.component.html +++ b/src/app/components/main-navigation/main-navigation.component.html @@ -7,8 +7,8 @@ fxShow="true" fxHide.gt-sm="true" fixedInViewport="false" autoFocus="false"> - Menu - + Menu +
@@ -32,7 +32,7 @@ - + - + + Greenvironment -