Bug Fix/CSS cleanup: add some more specific css to fix conflicts with NED

Author: robyww

src/firefly/html/css/global.css

@@ -36,6 +36,9 @@ div.rootStyle>img, div.rootStyle > html {
     border:0 none;
 }
 
+div.rootStyle img {
+    max-width: unset;
+}
 
 #App {
     position: absolute;

src/firefly/js/ui/ButtonGroup.css

@@ -1,11 +1,14 @@
 
 .buttonGroupButton {
     background-color: #aaa;
+    background-image: none;
+    border-radius: 0;
+    padding: 1px 7px 2px 7px;
+
     border: 1px solid #ccc;
     border-left: 0;
     cursor: pointer;
     margin: 0;
-    /*padding: 5px 10px;*/
     position: relative;
 }
 
@@ -21,15 +24,27 @@
 
 .buttonGroupButton.On:focus {
     outline-width: 0;
+    background-image: none;
+    border-radius: 0;
 }
 
 .buttonGroupButton.Off:focus {
     outline-width: 0;
+    background-image: none;
+    border-radius: 0;
 }
 
 .buttonGroupButton.Off:hover {
-    background-color: #999;
+    background-color: #ddd;
+    background-image: none;
+    border-radius: 0;
 }
 .buttonGroupButton.On:hover {
-    background-color: #999;
+    background-color: #aaa;
+    background-image: none;
+    border-radius: 0;
 }
+
+.buttonGroupButton.Off:ACTIVE {
+    background-color: #bbb;
+}

src/firefly/js/visualize/ui/VisCtxToolbarView.jsx

@@ -423,8 +423,9 @@ function makeConvertButton(pv) {
 
     const {autoConvertOnZoom:auto}= pv.plotViewCtx.hipsImageConversion;
     return (
-            <div style={{display: 'flex', marginLeft: 5, marginRight: 5, marginTop: -6, padding: '1px 2px 1px 2px',
-                         border: '1px solid rgba(60,60,60,.2', borderRadius: '5px'}}>
+            <div style={{display: 'flex', alignItems: 'center',
+                         padding: '1px 2px 1px 2px', margin: '0 5px 0 5px',
+                         border: '1px solid rgba(60,60,60,.2)', borderRadius: '5px'}}>
                 <RadioGroupInputFieldView options={options}  value={value}
                                           buttonGroup={true}
                                           onChange={(ev) => doConvert(pv,ev.target.value)} />
@@ -443,7 +444,7 @@ function makeHiPSImageTable(pv, surveysId) {
 
     const inputEntry = () => {
         return (
-            <div style={{margin: '0 5px 7px 4px'}}>
+            <div style={{margin: '0 5px 0 4px'}}>
                 <input  type='button'
                         value='Change HiPS'
                         title={'Choose a different HiPS Survey'}
@@ -478,7 +479,7 @@ function makeHiPSCoordSelect(pv) {
 
 
     return (
-        <div style={{marginBottom:7}}>
+        <div>
             <ListBoxInputFieldView
 
                 inline={true}