From 2013dcf7cb586bf67571754637ee417f66a3318c Mon Sep 17 00:00:00 2001
From: ayesha waris <73840786+ayeshoali@users.noreply.github.com>
Date: Thu, 30 Mar 2023 14:59:16 +0500
Subject: [PATCH] style: tooltips aligned to the side in topic stats (#488)

---
 src/components/TopicStats.jsx                      | 3 +++
 src/discussions/topics/topic-group/topic/Topic.jsx | 3 +++
 2 files changed, 6 insertions(+)

diff --git a/src/components/TopicStats.jsx b/src/components/TopicStats.jsx
index 513a9cea..416ea828 100644
--- a/src/components/TopicStats.jsx
+++ b/src/components/TopicStats.jsx
@@ -26,6 +26,7 @@ function TopicStats({
   return (
     <div className="d-flex align-items-center mt-2.5" style={{ marginBottom: '2px' }}>
       <OverlayTrigger
+        placement="right"
         overlay={(
           <Tooltip>
             <div className="d-flex flex-column align-items-start">
@@ -42,6 +43,7 @@ function TopicStats({
         </div>
       </OverlayTrigger>
       <OverlayTrigger
+        placement="right"
         overlay={(
           <Tooltip>
             <div className="d-flex flex-column align-items-start">
@@ -59,6 +61,7 @@ function TopicStats({
       </OverlayTrigger>
       {Boolean(canSeeReportedStats) && (
         <OverlayTrigger
+          placement="right"
           overlay={(
             <Tooltip>
               <div className="d-flex flex-column align-items-start">
diff --git a/src/discussions/topics/topic-group/topic/Topic.jsx b/src/discussions/topics/topic-group/topic/Topic.jsx
index 76df2b70..47a1d246 100644
--- a/src/discussions/topics/topic-group/topic/Topic.jsx
+++ b/src/discussions/topics/topic-group/topic/Topic.jsx
@@ -56,6 +56,7 @@ function Topic({
           </div>
           <div className="d-flex align-items-center mt-2.5" style={{ marginBottom: '2px' }}>
             <OverlayTrigger
+              placement="right"
               overlay={(
                 <Tooltip>
                   <div className="d-flex flex-column align-items-start">
@@ -72,6 +73,7 @@ function Topic({
               </div>
             </OverlayTrigger>
             <OverlayTrigger
+              placement="right"
               overlay={(
                 <Tooltip>
                   <div className="d-flex flex-column align-items-start">
@@ -89,6 +91,7 @@ function Topic({
             </OverlayTrigger>
             {Boolean(canSeeReportedStats) && (
               <OverlayTrigger
+                placement="right"
                 overlay={(
                   <Tooltip>
                     <div className="d-flex flex-column align-items-start">