From d4688c092d14af71c19e8f90a7ca936ea099ea45 Mon Sep 17 00:00:00 2001
From: John SJ Anderson <janders4@fredhutch.org>
Date: Tue, 19 Nov 2024 16:27:47 -0800
Subject: [PATCH] Make icons change layout too [#1911]

---
 src/components/controls/panel-layout.js | 24 ++++++++++++++----------
 1 file changed, 14 insertions(+), 10 deletions(-)

diff --git a/src/components/controls/panel-layout.js b/src/components/controls/panel-layout.js
index c2cf1ead5..532a23aec 100644
--- a/src/components/controls/panel-layout.js
+++ b/src/components/controls/panel-layout.js
@@ -27,27 +27,31 @@ class PanelLayouts extends React.Component {
 
     return (
       <div style={{marginTop: 0, marginBottom: 10}}>
-        <PanelsFullIcon width={22} selected={this.props.panelLayout === "full"}/>
-        <SidebarButton
-          selected={this.props.panelLayout === "full"}
+        <span
+          style={{cursor: "pointer"}}
           onClick={() => {
             analyticsControlsEvent("change-layout-full");
             this.props.dispatch({ type: CHANGE_PANEL_LAYOUT, data: "full" });
           }}
         >
-          <ButtonText>{t("sidebar:full")}</ButtonText>
-        </SidebarButton>
+          <PanelsFullIcon width={22} selected={this.props.panelLayout === "full"}/>
+          <SidebarButton selected={this.props.panelLayout === "full"}>
+            <ButtonText>{t("sidebar:full")}</ButtonText>
+          </SidebarButton>
+        </span>
 
-        <PanelsGridIcon width={22} selected={this.props.panelLayout === "grid"}/>
-        <SidebarButton
-          selected={this.props.panelLayout === "grid"}
+        <span
+          style={{cursor: "pointer"}}
           onClick={() => {
             analyticsControlsEvent("change-layout-grid");
             this.props.dispatch({ type: CHANGE_PANEL_LAYOUT, data: "grid" });
           }}
         >
-          <ButtonText>{t("sidebar:grid")}</ButtonText>
-        </SidebarButton>
+          <PanelsGridIcon width={22} selected={this.props.panelLayout === "grid"}/>
+          <SidebarButton selected={this.props.panelLayout === "grid"} >
+            <ButtonText>{t("sidebar:grid")}</ButtonText>
+          </SidebarButton>
+        </span>
 
       </div>
     );