From 416acd32c4fd435cd0f86805b40afbadb135b089 Mon Sep 17 00:00:00 2001
From: Vitaly Takmazov
Date: Thu, 28 Jun 2018 17:42:55 +0300
Subject: PM styling
---
vnext/src/components/PM.js | 38 +++++++++++++++++++++++++++++---------
1 file changed, 29 insertions(+), 9 deletions(-)
(limited to 'vnext/src/components/PM.js')
diff --git a/vnext/src/components/PM.js b/vnext/src/components/PM.js
index 1833f3a3..7684c6ac 100644
--- a/vnext/src/components/PM.js
+++ b/vnext/src/components/PM.js
@@ -6,17 +6,37 @@ import { format } from '../utils/embed';
export default function PM(props) {
const { chat } = props;
return (
-
-
-
+
+
);
}
-const chatItemStyle = {
- padding: '5px 13px',
- fontSize: '14px',
- listStyle: 'none',
- margin: '10px 0',
- boxShadow: '0 0 3px rgba(0,0,0, 0.16)'
+function bubbleStyle(me, msg) {
+ const isMe = me.uid === msg.user.uid;
+ const color = isMe ? '#fff' : '#222';
+ const background = isMe ? '#0076ff' : '#eee';
+ return {
+ background: background,
+ color: color,
+ padding: '0 12px'
+ }
+}
+
+function chatItemStyle(me, msg) {
+ const isMe = me.uid === msg.user.uid;
+ const alignment = isMe ? 'flex-end' : 'flex-start';
+ return {
+ padding: '3px 6px',
+ listStyle: 'none',
+ margin: '10px 0',
+ display: 'flex',
+ flexDirection: 'column',
+ alignItems: alignment
+ }
}
\ No newline at end of file
--
cgit v1.2.3