styles:部分icon在hover的时候，需要有背景色

km-console/packages/layout-clusters-fe/src/components/CardBar/BrokerHealthCheck.tsx

@@ -7,7 +7,7 @@ import { Tag, Tooltip, Utils } from 'knowdesign';
 import api from '@src/api';
 import { QuestionCircleOutlined } from '@ant-design/icons';
 import { HealthStateEnum } from '../HealthState';
-
+import './index.less';
 export default () => {
   const routeParams = useParams<{
     clusterId: string;
@@ -87,7 +87,7 @@ export default () => {
               <div>
                 <span style={{ display: 'inline-block', marginRight: '8px' }}>Similar Config</span>
                 <Tooltip overlayClassName="rebalance-tooltip" title="所有Broker配置是否一致">
-                  <QuestionCircleOutlined />
+                  <span className='rebalance-tooltip-bg'><QuestionCircleOutlined /></span>
                 </Tooltip>
               </div>
             );

km-console/packages/layout-clusters-fe/src/components/CardBar/index.less

@@ -177,3 +177,13 @@
     border-radius: 6px;
   }
 }
+.rebalance-tooltip-bg {
+  padding: 6px;
+  margin-left: -6px;
+  font-size: 14px;
+  cursor: pointer;
+  border-radius: 50%;
+  &:hover {
+    background: rgba(33, 37, 41, 0.04);
+  }
+}

km-console/packages/layout-clusters-fe/src/components/ChartOperateBar/style/index.less

@@ -37,8 +37,7 @@
         display: flex;
         justify-content: center;
         align-items: center;
-        width: 22px;
-        height: 22px;
+        padding: 6px;
         border-radius: 50%;
         cursor: pointer;
         .icon {
@@ -46,7 +45,7 @@
           color: #74788d;
         }
         &:hover {
-          background: #21252904;
+          background: rgba(33, 37, 41, 0.04);
           .refresh-icon {
             color: #495057;
           }