search

intermine / bluegenes

A friendly next-generation interface for Genomic data discovery powered by InterMine
http://bluegenes.apps.intermine.org
Other
76 stars 56 forks source link

List results: add option to collapse left and right columns #261

Open yochannah opened 6 years ago

yochannah commented 6 years ago

for narrow screens, it might be nice to hide the recent queries and/or enrichment sections in order to display more result columns.

joshkh commented 6 years ago

Bootstrap provides break point specific classes to toggle the visibility of elements (such as hiding side menus on smaller screens), but ReactJS will still go through the process of instantiating a component if it's hidden via CSS.

There are ReactJS libraries that watch the screen size and this lets you make decisions about what to actually render:

https://www.npmjs.com/package/react-breakpoints

Someone recently released a re-frame plugin that lets you subscribe to the viewport (and I think it defaults to bootstrap's break points). It also returns other useful information such as whether the device is a tablet, if it's in landscape or portrait mode etc:

https://github.com/gadfly361/breaking-point