From dedeb19daea7f73febf1b486c232e2d85651a979 Mon Sep 17 00:00:00 2001
From: Franck Royer <franck@status.im>
Date: Tue, 4 May 2021 07:53:26 +1000
Subject: [PATCH] Make date font smaller and change author/message fonts

---
 web-chat/src/App.tsx | 31 ++++++++++++++++++++++++++++++-
 1 file changed, 30 insertions(+), 1 deletion(-)

diff --git a/web-chat/src/App.tsx b/web-chat/src/App.tsx
index b6949b28a9..937db54fb2 100644
--- a/web-chat/src/App.tsx
+++ b/web-chat/src/App.tsx
@@ -13,6 +13,35 @@ import { WakuContext } from './WakuContext';
 import { ThemeProvider } from '@livechat/ui-kit';
 import { generate } from 'server-name-generator';
 
+const themes = {
+  AuthorName: {
+    css: {
+      fontSize: '1.1em',
+    },
+  },
+  Message: {
+    css: {
+      margin: '0em',
+      padding: '0em',
+      fontSize: '0.83em',
+    },
+  },
+  MessageText: {
+    css: {
+      margin: '0em',
+      padding: '0.1em',
+      paddingLeft: '1em',
+      fontSize: '1.1em',
+    },
+  },
+  MessageGroup: {
+    css: {
+      margin: '0em',
+      padding: '0.2em',
+    },
+  },
+};
+
 export const ChatContentTopic = 'dingpu';
 
 export default function App() {
@@ -82,7 +111,7 @@ export default function App() {
       style={{ height: '100vh', width: '100vw', overflow: 'hidden' }}
     >
       <WakuContext.Provider value={{ waku: stateWaku }}>
-        <ThemeProvider>
+        <ThemeProvider theme={themes}>
           <Room
             nick={nick}
             lines={stateMessages}