diff --git a/frontend/src/container/MetricsExplorer/MetricDetails/MetricDetails.tsx b/frontend/src/container/MetricsExplorer/MetricDetails/MetricDetails.tsx
index 97670b5061..b0c18ab64b 100644
--- a/frontend/src/container/MetricsExplorer/MetricDetails/MetricDetails.tsx
+++ b/frontend/src/container/MetricsExplorer/MetricDetails/MetricDetails.tsx
@@ -75,7 +75,7 @@ function MetricDetails({
 					hour."
 				placement="top"
 			>
-				<span>{`${timeSeriesTotal} ⎯ ${timeSeriesActive} active`}</span>
+				<span>{`${timeSeriesTotal} total ⎯ ${timeSeriesActive} active`}</span>
 			</Tooltip>
 		);
 	}, [metric]);
diff --git a/frontend/src/container/MetricsExplorer/Summary/MetricsTreemap.tsx b/frontend/src/container/MetricsExplorer/Summary/MetricsTreemap.tsx
index f9f81fa92c..ef9649be1d 100644
--- a/frontend/src/container/MetricsExplorer/Summary/MetricsTreemap.tsx
+++ b/frontend/src/container/MetricsExplorer/Summary/MetricsTreemap.tsx
@@ -154,10 +154,14 @@ function MetricsTreemap({
 													<foreignObject
 														width={nodeWidth}
 														height={nodeHeight}
-														style={getTreemapTileStyle(node.data)}
 														onClick={(): void => openMetricDetails(node.data.id)}
 													>
-														<div style={getTreemapTileTextStyle()}>
+														<div
+															style={{
+																...getTreemapTileStyle(node.data),
+																...getTreemapTileTextStyle(),
+															}}
+														>
 															{`${node.data.displayValue}%`}
 														</div>
 													</foreignObject>