search

openproblems-bio / website

Website hosted at https://openproblems.bio
Creative Commons Attribution 4.0 International
3 stars 7 forks source link

[results figure] figure overflow #145

Open rcannood opened 1 year ago

rcannood commented 1 year ago 
          Well, the problem with overflow is this:
  1. funkyheatmap-js renders its dimensions based on the content (so in this case because of long method names the content is wider than available space)
  2. the cell rendering css does not have (currently) any overflow handling

I see 2 ways to deal with this:

  1. add overflow-x: auto to cell css, then figure will stay the same, but will display cropped, available for scrolling
  2. make funkyheatmap scale to certain width, or be constrained by it, and pass this as a parameter (it does not know its parent's width when rendering—ojs ways)
  3. shorten method names (and/or add code to shorten method names automatically)

what do y'all think?

Originally posted by @mxposed in https://github.com/openproblems-bio/website-experimental/issues/76#issuecomment-1460516578

rcannood commented 1 year ago

shorten method names (and/or add code to shorten method names automatically

This is only a temporary solution as more metrics and more datasets will result in the same problem :)

mxposed commented 1 year ago

I wonder why did you remove column: page from results figure? Was it ugly for non-overflowing figures?

rcannood commented 1 year ago

Yes but it also accentuates the highlights the issue more :)

mxposed commented 1 year ago

Basic fix with overflow-x in https://github.com/openproblems-bio/website-experimental/pull/76/commits/2af31288930dc847aeb4c6b4ae54a8fbfe4eaa7a

Result here: https://6409081f065ae51749b0d5da--openproblems-experimental.netlify.app/results/batch_integration_feature/

// not sure why the commit didn't trigger the build