Fix tooltips. Svgs don't accept classnames with the recnet changes

Vizzuality · Jul 8, 2024 · 6c488e1 · 6c488e1
1 parent e3477fb
commit 6c488e1
Show file tree

Hide file tree

Showing 8 changed files with 12 additions and 15 deletions.
diff --git a/src/components/charts/species-bar/component.jsx b/src/components/charts/species-bar/component.jsx
@@ -25,7 +25,7 @@ function SpeciesBar({
           delay={100}
           position="bottom"
         >
-          <InfoIcon className={styles.icon} />
+          <span className={styles.icon}><InfoIcon /></span>
         </Tooltip>
       </span>
     </div>

diff --git a/src/components/layer-toggle/layers-tools/component.jsx b/src/components/layer-toggle/layers-tools/component.jsx
@@ -67,7 +67,7 @@ function LayersTools({
           animation="none"
           placement="top"
         >
-          <InfoIcon className={styles.icon} />
+          <span className={styles.icon}><InfoIcon /></span>
         </Tooltip>
       </span>
     </div>

diff --git a/src/containers/nrc-content/nrc-challenges/nrc-challenges-component.jsx b/src/containers/nrc-content/nrc-challenges/nrc-challenges-component.jsx
@@ -123,7 +123,7 @@ function Challenges({
             delay={100}
             placement="top"
           >
-            <InfoIcon className={styles.icon} />
+            <span className={styles.icon}><InfoIcon /></span>
           </Tooltip>
         </span>
       </div>

diff --git a/src/containers/nrc-content/nrc-indicators/indicator-card/indicator-card-component.jsx b/src/containers/nrc-content/nrc-indicators/indicator-card/indicator-card-component.jsx
@@ -21,12 +21,11 @@ function IndicatorCard({
       <div className={styles.description}>{description}</div>
       <div className={styles.children}>{children}</div>
       {tooltipInfo && (
-        <span className={styles.iconWrapper}>
+        <span onClick={() => console.log('hey')} className={styles.iconWrapper}>
           <Tooltip
             content={<div className={styles.tooltip}>{tooltipInfo}</div>}
-            position="top"
-          >
-            <InfoIcon className={styles.icon} />
+            >
+            <span className={styles.icon}><InfoIcon /></span>
           </Tooltip>
         </span>
       )}

diff --git a/src/containers/nrc-content/nrc-indicators/indicator-card/indicator-card-styles.module.scss b/src/containers/nrc-content/nrc-indicators/indicator-card/indicator-card-styles.module.scss
@@ -36,13 +36,11 @@
     position: absolute;
     top: 17px;
     right: 24px;
+
     .icon {
       height: 15px;
       width: 15px;
     }
-    .tooltip {
-      color: $white;
-    }
   }
 }
 

diff --git a/src/containers/nrc-content/nrc-trend/nrc-trend-component.jsx b/src/containers/nrc-content/nrc-trend/nrc-trend-component.jsx
@@ -49,7 +49,7 @@ function Trend({
             delay={100}
             placement="top"
           >
-            <InfoIcon className={styles.icon} />
+            <span className={styles.icon}><InfoIcon /></span>
           </Tooltip>
         </span>
       </div>

diff --git a/src/containers/sidebars/aoi-sidebar/sidebar-card-content/component.jsx b/src/containers/sidebars/aoi-sidebar/sidebar-card-content/component.jsx
@@ -221,7 +221,7 @@ function SidebarCard({
                       delay={100}
                       position="bottom"
                     >
-                      <InfoIcon className={styles.icon} />
+                      <span className={styles.icon}><InfoIcon /></span>
                     </Tooltip>
                   </span>
                 </div>

diff --git a/src/containers/sidebars/aoi-sidebar/species-card/component.jsx b/src/containers/sidebars/aoi-sidebar/species-card/component.jsx
@@ -218,7 +218,7 @@ function Component(props) {
                         delay={100}
                         position="bottom"
                       >
-                        <InfoIcon className={styles.icon} />
+                        <span className={styles.icon}><InfoIcon /></span>
                       </Tooltip>
                     </span>
                   </div>
@@ -269,7 +269,7 @@ function Component(props) {
                         delay={100}
                         position="bottom"
                       >
-                        <InfoIcon className={styles.icon} />
+                        <span className={styles.icon}><InfoIcon /></span>
                       </Tooltip>
                     </span>
                   </div>
@@ -296,7 +296,7 @@ function Component(props) {
                         delay={100}
                         position="bottom"
                       >
-                        <InfoIcon className={styles.icon} />
+                        <span className={styles.icon}><InfoIcon /></span>
                       </Tooltip>
                     </span>
                   </div>