From 6cbfb4e29a73061735c27dde9373f28519d85f5b Mon Sep 17 00:00:00 2001
From: "Daniel S. Hansen" <dshansen@contractor.usgs.gov>
Date: Mon, 14 Jul 2025 13:31:11 -0700
Subject: [PATCH] Edit sidebar close symbol from 'X' to 'RxHamburgerMenu' and
 aligned to the right

---
 client/src/components/sidebar.jsx | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/client/src/components/sidebar.jsx b/client/src/components/sidebar.jsx
index 9a32fce..2f40b1f 100644
--- a/client/src/components/sidebar.jsx
+++ b/client/src/components/sidebar.jsx
@@ -74,7 +74,19 @@ export default function Sidebar () {
             gap={4} paddingTop={4}
             paddingLeft={14} paddingRight={3}
         >
-          <CloseButton color="secondary"  _hover={{bg: "#EDF1F1"}} size="sm" variant="ghost" left="-10" onClick={() => setIsOpen(!isOpen)}></CloseButton>
+          {/* <CloseButton color="secondary"  _hover={{bg: "#EDF1F1"}} size="sm" variant="ghost" left="-10" onClick={() => setIsOpen(!isOpen)}></CloseButton> */}
+          {/* <RxHamburgerMenu color="secondary"  _hover={{bg: "#EDF1F1"}} size="sm" variant="ghost" left="-10" onClick={() => setIsOpen(!isOpen)}></RxHamburgerMenu> */}
+          <Button 
+            aria-lable="Toggle Sidebar"
+            color="secondary"  
+            _hover={{bg: "#EDF1F1"}} 
+            size="md" variant="ghost" 
+            // left="-10"
+            ml="auto" // Margin-left: auto, pushes hamburger menu to right side 
+            onClick={() => setIsOpen(!isOpen)}
+          >
+            <RxHamburgerMenu />
+          </Button>
           <Button color="#19332D" _hover={activeButton === "Dashboard" ? {bg: "#A4B6B6"}:{bg:"#EDF1F1"}} fontSize="xl" variant="ghost" onClick={() => setActiveButton("Dashboard")} bg={activeButton === "Dashboard" ? "#A4B6B6" : "transparent"}>
             <PushPin fill="white" /> Dashboard
           </Button>
@@ -104,7 +116,7 @@ export default function Sidebar () {
               alignItems="start" 
               gap={4} padding={4}
         >
-          <IconButton color="#19332D" _hover={{bg: "#EDF1F1"}} size="sm" variant="ghost" onClick={() => setIsOpen(!isOpen)}>
+          <IconButton color="#19332D" _hover={{bg: "#EDF1F1"}} size="md" variant="ghost" onClick={() => setIsOpen(!isOpen)}>
             <RxHamburgerMenu />
           </IconButton>
           <IconButton color="#19332D" _hover={activeButton === "Dashboard" ? {bg: "#A4B6B6"}:{bg:"#EDF1F1"}} variant="ghost" onClick={() => setActiveButton("Dashboard")} bg={activeButton === "Dashboard" ? "#A4B6B6" : "transparent"}>