Cursor indications

2 files changed, 11 insertions, 1 deletions

diff --git a/synapse_topology/webui/src/js/components/AccordionToggle.jsx b/synapse_topology/webui/src/js/components/AccordionToggle.jsx
index d0c913675c..87ba085eac 100644
--- a/synapse_topology/webui/src/js/components/AccordionToggle.jsx
+++ b/synapse_topology/webui/src/js/components/AccordionToggle.jsx
@@ -16,6 +16,8 @@ export default ({ active, children, eventKey, as, reset }) => {
 
     }
     const As = as;
-    return <As onClick={decoratedOnClick} active={active}> {children}</As>
+    return <div className={active ? "active-card-header" : "inactive-card-header"}>
+        <As onClick={decoratedOnClick} active={active}> {children}</As>
+    </div>
 
 }
diff --git a/synapse_topology/webui/src/scss/main.scss b/synapse_topology/webui/src/scss/main.scss
index 9d14e789ea..292fac6b1c 100644
--- a/synapse_topology/webui/src/scss/main.scss
+++ b/synapse_topology/webui/src/scss/main.scss
@@ -196,6 +196,14 @@ input[type=checkbox] {
   border-style: none;
 }
 
+.active-card-header {
+    cursor: pointer;
+}
+
+.inactive-card-header {
+    cursor: not-allowed;
+}
+
 .blockwrapper {
   display: block;
 }