From a6d445818f58fb626f90de3610bc9ffdbea22aca Mon Sep 17 00:00:00 2001
From: gorkem-bwl <gorkem.cetin@bluewavelabs.ca>
Date: Thu, 14 Aug 2025 20:15:56 -0400
Subject: [PATCH] fix: improve vertical alignment of text and plus icons in
 filter headers

Added flex alignment styles to MuiSelect-select class to ensure proper vertical
alignment between text labels and plus icons in Type, Status, and State filter
buttons on the Uptime page.
---
 client/src/Components/FilterHeader/index.jsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/client/src/Components/FilterHeader/index.jsx b/client/src/Components/FilterHeader/index.jsx
index 36dd04081..5327dcd02 100644
--- a/client/src/Components/FilterHeader/index.jsx
+++ b/client/src/Components/FilterHeader/index.jsx
@@ -37,6 +37,12 @@ const FilterHeader = ({ header, options, value, onChange, multiple = true }) =>
 				displayEmpty
 				value={controlledValue}
 				onChange={onChange}
+				sx={{
+					"& .MuiSelect-select": {
+						display: "flex",
+						alignItems: "center",
+					},
+				}}
 				renderValue={(selected) => {
 					if (!selected?.length) {
 						return header;