fix: "Network Navigator" button overflowing on small screens

react-snap did not play nice with the responsive layout, so it is disabled for now.
mapequation · Mar 26, 2020 · 207a9e7 · 207a9e7
1 parent 6f239d0
commit 207a9e7
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 3 deletions.
diff --git a/package.json b/package.json
@@ -7,7 +7,6 @@
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
-    "postbuild": "react-snap",
     "deploy": "scp -r build/* icelab-mapequation:/var/www/infomap"
   },
   "eslintConfig": {

diff --git a/src/components/Infomap/Infomap.js b/src/components/Infomap/Infomap.js
@@ -284,8 +284,12 @@ export default observer(class InfomapOnline extends React.Component {
               rel="noopener noreferrer"
               href={`//www.mapequation.org/navigator?infomap=${network.name}.ftree`}
               disabled={!output.ftree || running}
-              content="Open in Network Navigator"
-            />
+            >
+              <Responsive minWidth={1200} as={React.Fragment}>Open in Network Navigator</Responsive>
+              <Responsive maxWidth={1199} minWidth={992} as={React.Fragment}>Open in Navigator</Responsive>
+              <Responsive maxWidth={991} minWidth={768} as={React.Fragment}>Navigator&#8230;</Responsive>
+              <Responsive maxWidth={767} as={React.Fragment}>Open in Network Navigator</Responsive>
+            </Button>
             <DownloadMenu disabled={running}/>
           </Button.Group>