From 1dcf975c97a504040b365a78353ec82efef7c515 Mon Sep 17 00:00:00 2001 From: wilfried Date: Sat, 29 May 2021 23:04:28 +0200 Subject: [PATCH 1/2] rr --- .../src/app/general/general.component.html | 76 +++++++++++++------ frontend/src/app/login/login.component.html | 3 +- .../src/app/services/auth/auth.service.ts | 2 + .../app/services/message/message.service.ts | 1 + frontend/src/styles.scss | 10 ++- 5 files changed, 66 insertions(+), 26 deletions(-) diff --git a/frontend/src/app/general/general.component.html b/frontend/src/app/general/general.component.html index 21f47dc..9453b2c 100644 --- a/frontend/src/app/general/general.component.html +++ b/frontend/src/app/general/general.component.html @@ -1,25 +1,55 @@ - - - - Socket.IO chat - - - - -
- -
- - +
+
+ + + +

{{user?.login}}

+ +
+
+ + +
+ +
+ +
+

{{username}}

+
+ +
+
+ {{item.user}} : {{item.message}} +
+
    +
+
+ +
+
+
+
+ +
+
+
+ +
+
+ +
+ +
+
+ + diff --git a/frontend/src/app/login/login.component.html b/frontend/src/app/login/login.component.html index 28e356d..814a887 100644 --- a/frontend/src/app/login/login.component.html +++ b/frontend/src/app/login/login.component.html @@ -24,5 +24,6 @@ - +
+ diff --git a/frontend/src/app/services/auth/auth.service.ts b/frontend/src/app/services/auth/auth.service.ts index 2b070eb..7d16dad 100644 --- a/frontend/src/app/services/auth/auth.service.ts +++ b/frontend/src/app/services/auth/auth.service.ts @@ -11,6 +11,8 @@ export class AuthService { // @ts-ignore islog: boolean; + // @ts-ignore + public currentUser; constructor(private messageService: MessageService) { } diff --git a/frontend/src/app/services/message/message.service.ts b/frontend/src/app/services/message/message.service.ts index 13b1560..ed7273a 100644 --- a/frontend/src/app/services/message/message.service.ts +++ b/frontend/src/app/services/message/message.service.ts @@ -25,3 +25,4 @@ export class MessageService { } } + diff --git a/frontend/src/styles.scss b/frontend/src/styles.scss index 5e6c778..7ab98a2 100644 --- a/frontend/src/styles.scss +++ b/frontend/src/styles.scss @@ -5,6 +5,7 @@ body { .container-fluid { padding: 50px 200px; overflow: hidden; + background-color: #87CEEB; } .user-list-card { @@ -54,9 +55,10 @@ body { align-items: center; .username { - font-size: 14px; + font-size: 20px; font-weight: 500; margin-bottom: 0; + margin-left: 20px; display: flex; justify-content: center; align-items: center; @@ -64,7 +66,7 @@ body { } .chat-body { - background-image: url(./assets/image/user.png); + background-image: url(./assets/image/fond.png); background-repeat: no-repeat; background-size: cover; background-position: center center; @@ -107,3 +109,7 @@ body { } } } + +.modal-footer { + display: block; +} From 362a1f236ba2b005ed6fa2f8cc2c7fd318a064c5 Mon Sep 17 00:00:00 2001 From: wilfried Date: Sun, 30 May 2021 10:40:48 +0200 Subject: [PATCH 2/2] try frontend... --- .../src/app/general/general.component.html | 43 +++++---- frontend/src/app/general/general.component.ts | 2 +- frontend/src/styles.scss | 87 +++++++------------ 3 files changed, 52 insertions(+), 80 deletions(-) diff --git a/frontend/src/app/general/general.component.html b/frontend/src/app/general/general.component.html index 9453b2c..d909a79 100644 --- a/frontend/src/app/general/general.component.html +++ b/frontend/src/app/general/general.component.html @@ -5,50 +5,47 @@
-

{{user?.login}}

+

{{username}}

+
-
- + +
-

{{username}}

+

General Chat

-
- {{item.user}} : {{item.message}} -
+
-
-
-
-
- -
-
-
- -
+ + +
+
+
+
+
-
- +
+ +
+
+
diff --git a/frontend/src/app/general/general.component.ts b/frontend/src/app/general/general.component.ts index 096d68b..383ffcc 100644 --- a/frontend/src/app/general/general.component.ts +++ b/frontend/src/app/general/general.component.ts @@ -11,7 +11,7 @@ import {MessageService} from "../services/message/message.service"; }) export class GeneralComponent implements OnInit { - private username = sessionStorage.getItem('login'); + public username = sessionStorage.getItem('login'); private room = 'general'; public msg = ''; diff --git a/frontend/src/styles.scss b/frontend/src/styles.scss index 7ab98a2..0bbb80a 100644 --- a/frontend/src/styles.scss +++ b/frontend/src/styles.scss @@ -47,67 +47,42 @@ body { position: relative; overflow: hidden; - .chat-header { - height: 70px; - background-color: #E5E5E5; + +} + +.chat-header { + height: 70px; + border-radius: 10px; + background-color: #E5E5E5; + display: flex; + justify-content: flex-start; + align-items: center; + + .username { + font-size: 20px; + font-weight: 500; + margin-bottom: 0; + margin-left: 20px; display: flex; - justify-content: flex-start; + justify-content: center; align-items: center; - - .username { - font-size: 20px; - font-weight: 500; - margin-bottom: 0; - margin-left: 20px; - display: flex; - justify-content: center; - align-items: center; - } } +} - .chat-body { - background-image: url(./assets/image/fond.png); - background-repeat: no-repeat; - background-size: cover; - background-position: center center; - height: calc(100vh - 125px); - overflow-y: auto; +.chat-body { + background-color: white; + border-radius: 10px; + height: calc(89.5vh - 89.5px); + overflow-y: auto; +} - .message-container { - background-color: white; - padding: 7px; - border-radius: 5px; - width: fit-content; - max-width: 90%; - margin-bottom: 15px; - } - - .same-user { - display: flex; - justify-content: flex-end; - - .message-container { - background-color: lightskyblue; - } - } - } - - .chat-footer { - position: absolute; - bottom: 0; - left: 0; - right: 0; - background-color: #EDEDED; - padding: 10px 20px; - - .form-control { - background-color: white; - border: 1px solid #D8DDEC; - box-sizing: border-box; - font-size: 1rem; - color: black; - } - } +.chat-footer { + border-radius: 10px; + bottom: 0; + left: 0; + right: 0; + background-color: #EDEDED; + padding: 10px 20px; } .modal-footer {