fix: replace tooltip class by ant icon (#351)

* better to use ant icons instead of creating special classes
hasadna · Dec 27, 2023 · 76aac34 · 76aac34
1 parent 9a85007
commit 76aac34
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 22 deletions.
diff --git a/src/pages/dashboard/AllLineschart/AllLinesChart.tsx b/src/pages/dashboard/AllLineschart/AllLinesChart.tsx
@@ -7,6 +7,7 @@ import { GroupByRes, useGroupBy } from 'src/api/groupByService'
 import { FC } from 'react'
 import { Moment } from 'moment/moment'
 import Widget from 'src/shared/Widget'
+import { InfoCircleOutlined } from '@ant-design/icons'
 
 const convertToChartCompatibleStruct = (arr: GroupByRes[]) => {
   return arr.map((item: GroupByRes) => ({
@@ -37,7 +38,7 @@ export const AllLinesChart: FC<AllChartComponentProps> = ({ startDate, endDate }
           title={convertLineFeedToHtmlTags(t('dashboard_tooltip_content'))}
           placement="left"
           arrow>
-          <span className="tooltip-icon">i</span>
+          <InfoCircleOutlined style={{ marginRight: '12px' }} />
         </Tooltip>
       </h2>
       {groupByOperatorLoading ? (

diff --git a/src/pages/dashboard/DashboardPage.scss b/src/pages/dashboard/DashboardPage.scss
@@ -13,24 +13,4 @@
     height: 400px;
     overflow-y: scroll;
   }
-
-  .tooltip-icon {
-    position: relative;
-    display: inline-flex;
-    justify-content: center;
-    align-items: center;
-    width: 20px;
-    height: 20px;
-    border-radius: 50%;
-    background-color: #888;
-    color: #fff;
-    font-size: 14px;
-    cursor: pointer;
-    vertical-align: middle;
-    margin-right: 10px;
-  }
-
-  .tooltip-icon:hover {
-    background-color: #333;
-  }
-}
+}