Merge pull request #4736 from seotts/world-map-fix

World map fixes - Border thickness, Eswatini, remove unused css

src/components/world-map/world-map.jsx

@@ -20,10 +20,7 @@ const WorldMap = props => (
                 locations: props.countryNames,
                 z: props.colorIndex,
                 text: props.countryData,
-                hovertemplate: '<b>  %{location}  </b>' +
-                               '<br>' +
-                               '  %{text:,.0f}  ' +
-                               '<extra></extra>',
+                hovertemplate: '%{text}<extra></extra>',
                 hoverlabel: {
                     bgcolor: '#FFF',
                     bordercolor: '#5B6671',
@@ -38,7 +35,7 @@ const WorldMap = props => (
                 marker: {
                     line: {
                         color: '#FFFF',
-                        width: 1
+                        width: .4
                     }
                 }
             }

src/views/annual-report/annual-report.jsx

@@ -52,10 +52,11 @@ const SECTION_NAMES = {
 };
 
 // Constants used for world map data processing/formatting for use with Plotly
-const countryKeys = Object.keys(CountryUsage);
-const countryNames = countryKeys.map(key => CountryUsage[key].display);
-const countryData = countryKeys.map(key => CountryUsage[key].count);
-const colorIndex = countryKeys.map(key => CountryUsage[key]['log count']);
+const countryNames = Object.keys(CountryUsage);
+const countryData = countryNames.map(key =>
+    `<b>${CountryUsage[key].display}</b><br>${CountryUsage[key].count.toLocaleString('en')}`
+);
+const colorIndex = countryNames.map(key => CountryUsage[key]['log count']);
 
 // Create the div given a list of supporter names,
 // this will contain two columns of names either of equal size

src/views/annual-report/annual-report.scss

@@ -2681,12 +2681,6 @@ p {
                 background-color: $box-shadow-light-gray;
             }
         }
-
-        // Would be good to see if this works in RTL...
-        [dir="rtl"] a {
-            margin-left: 10px;
-            margin-right: 0px;
-        }
     }
 
 }