Merge pull request #109 from RonLek/update-demo-stats

[IMPROVE] Updates demo Home stats

Author: Sing-Li

client/src/components/Home/index.css

@@ -71,11 +71,11 @@
   width: 45%;
   height: 45%;
   display: block;
-  margin-bottom: 5px;
+  margin-bottom: 10px;
 }
 
 .stat-number {
-  font-size: 30px;
+  font-size: 25px;
   letter-spacing: 2px;
   margin-bottom: 5px;
   font-weight: 500;

client/src/components/Home/index.js

@@ -307,7 +307,7 @@ export default function Home(props) {
                     alt="users"
                     className="stat-icon"
                   />
-                  <Countup end={users} className="stat-number" />
+                  <Countup end={412442} className="stat-number" />
                   <div className="stat-label">
                     {t("unsigned-home-demo.users-stats-label")}
                   </div>
@@ -318,7 +318,7 @@ export default function Home(props) {
                     alt="messages"
                     className="stat-icon"
                   />
-                  <Countup end={totalMessages} className="stat-number" />
+                  <Countup end={12940830} className="stat-number" />
 
                   <div className="stat-label">
                     {t("unsigned-home-demo.messages-exchanged-stats-label")}
@@ -330,7 +330,7 @@ export default function Home(props) {
                     alt="online-users"
                     className="stat-icon"
                   />
-                  <Countup end={onlineUsers} className="stat-number" />
+                  <Countup end={507} className="stat-number" />
                   <div className="stat-label">
                     {t("unsigned-home-demo.online-users-stats-label")}
                   </div>

client/src/components/common/Countup.js

@@ -11,7 +11,7 @@ export default function Countup(props) {
         setCount((prevCount) => prevCount + 1);
       }, speed);
     } else {
-      setValue(props.end >= 1000 ? `${props.end / 1000}k` : props.end);
+      setValue(props.end);
     }
   });
   return <div className={props.className}>{value || count}</div>;