From 7fb5a9c5782eeff3df361742eb1a037e9d832f34 Mon Sep 17 00:00:00 2001
From: Shreyas Devalapurkar <shreyasdevalapurkar@gmail.com>
Date: Tue, 28 Sep 2021 15:15:07 -0700
Subject: [PATCH] Add bold to popup

---
 .../components/map/OccurrenceFeaturePopup.tsx | 28 +++++++++++++------
 1 file changed, 20 insertions(+), 8 deletions(-)

diff --git a/app/src/components/map/OccurrenceFeaturePopup.tsx b/app/src/components/map/OccurrenceFeaturePopup.tsx
index ff9e879b55..6a82ecc278 100644
--- a/app/src/components/map/OccurrenceFeaturePopup.tsx
+++ b/app/src/components/map/OccurrenceFeaturePopup.tsx
@@ -8,14 +8,26 @@ export const OccurrenceFeaturePopup: React.FC<{ featureData: any }> = (props) =>
 
   return (
     <Popup key={featureData.id} keepInView={false} autoPan={false}>
-      <div>{`Species: ${featureData.taxonId}`}</div>
-      <div>{`Lifestage: ${featureData.lifeStage}`}</div>
-      <div>{`Count: ${
-        featureData.organismQuantity
-          ? `${featureData.organismQuantity} ${featureData.organismQuantityType}`
-          : `${featureData.individualCount} Individuals`
-      }`}</div>
-      <div>{`Date: ${getFormattedDate(DATE_FORMAT.ShortMediumDateTimeFormat, featureData.eventDate)}`}</div>
+      <div>
+        <b>Species</b>
+        {`: ${featureData.taxonId}`}
+      </div>
+      <div>
+        <b>Lifestage</b>
+        {`: ${featureData.lifeStage}`}
+      </div>
+      <div>
+        <b>Count</b>
+        {`: ${
+          featureData.organismQuantity
+            ? `${featureData.organismQuantity} ${featureData.organismQuantityType}`
+            : `${featureData.individualCount} Individuals`
+        }`}
+      </div>
+      <div>
+        <b>Date</b>
+        {`: ${getFormattedDate(DATE_FORMAT.ShortMediumDateTimeFormat, featureData.eventDate)}`}
+      </div>
     </Popup>
   );
 };