From c06afb991965a6b38e62e9ee42fe55745fd5978d Mon Sep 17 00:00:00 2001
From: efarooqui <efarooqui@pandora.com>
Date: Mon, 10 May 2021 16:07:12 -0700
Subject: [PATCH] Fixing extraneous errors with html attrs

---
 src/components/atoms/ColoredMarkers.js       | 2 +-
 src/components/space/carto/atoms/Clusters.js | 6 +++---
 src/components/space/carto/atoms/Events.js   | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/atoms/ColoredMarkers.js b/src/components/atoms/ColoredMarkers.js
index b3cce88..bcd738f 100644
--- a/src/components/atoms/ColoredMarkers.js
+++ b/src/components/atoms/ColoredMarkers.js
@@ -39,7 +39,7 @@ function ColoredMarkers({ radius, colorPercentMap, styles, className }) {
 
         return (
           <path
-            class={className}
+            className={className}
             id={`arc_${idx}`}
             d={arc}
             style={extraStyles}
diff --git a/src/components/space/carto/atoms/Clusters.js b/src/components/space/carto/atoms/Clusters.js
index e204241..49fcdbb 100644
--- a/src/components/space/carto/atoms/Clusters.js
+++ b/src/components/space/carto/atoms/Clusters.js
@@ -110,19 +110,19 @@ function ClusterEvents({
     return (
       <>
         <text
-          text-anchor="middle"
+          textAnchor="middle"
           y="3px"
           style={{ fontWeight: "bold", fill: "black", zIndex: 10000 }}
         >
           {txt}
         </text>
         <circle
-          class="event-hover"
+          className="event-hover"
           cx="0"
           cy="0"
           r={circleSize + 2}
           stroke={colors.primaryHighlight}
-          fill-opacity="0.0"
+          fillOpacity="0.0"
         />
       </>
     );
diff --git a/src/components/space/carto/atoms/Events.js b/src/components/space/carto/atoms/Events.js
index bfd7b1e..08b2e5d 100644
--- a/src/components/space/carto/atoms/Events.js
+++ b/src/components/space/carto/atoms/Events.js
@@ -35,12 +35,12 @@ function MapEvents({
     return (
       <>
         <circle
-          class="event-hover"
+          className="event-hover"
           cx="0"
           cy="0"
           r="10"
           stroke={colors.primaryHighlight}
-          fill-opacity="0.0"
+          fillOpacity="0.0"
         />
       </>
     );