Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Things look a bit squishy on mobile & small screens #29

Closed
yochannah opened this Issue May 30, 2018 · 9 comments

Comments

Projects
None yet
2 participants
@yochannah
Copy link
Collaborator

yochannah commented May 30, 2018

Screenshot attached - the header shrinks nicely for small screens but could use a little bit of improvement where things overlap, and the pie chart seems to be missing entirely (maybe covered by the header?)

Don't worry about imtables overspilling the screen - it's not terribly mobile friendly, but that's not the data browser's fault! so long as users can scroll sideways to see all of the imtable everything should be fine.

screenshot_20180530-134923

AdrianBZG added a commit that referenced this issue Jun 14, 2018

@AdrianBZG

This comment has been minimized.

Copy link
Owner

AdrianBZG commented Jun 14, 2018

@yochannah It looks nice now in small and mobile screen (0978bba), some examples:

My phone:

photo_2018-06-15_01-00-50

Other devices:

image

image

image

image

@AdrianBZG AdrianBZG closed this Jun 14, 2018

@AdrianBZG AdrianBZG added this to the Milestone 2 (July 9) milestone Jun 14, 2018

@yochannah

This comment has been minimized.

Copy link
Collaborator Author

yochannah commented Jun 15, 2018

@AdrianBZG That is much better but the InterMine logo still gets covered by the dropdown a lot of the time in those screenshots. One option could be to just use a square logo (available here https://intermineorg.wordpress.com/logos/)

The navbar also sometimes covers the graph, like this, between screen widths of around 800px to 992px.

image

@AdrianBZG AdrianBZG reopened this Jun 15, 2018

AdrianBZG added a commit that referenced this issue Jun 15, 2018

@AdrianBZG

This comment has been minimized.

Copy link
Owner

AdrianBZG commented Jun 15, 2018

@yochannah I think it's good now (f5c69c7):

image

What do you think?

@yochannah

This comment has been minimized.

Copy link
Collaborator Author

yochannah commented Jun 15, 2018

that does look better - although could you double-check the aspect ratio of the logo is correct? it looks a little bit like it's being squished a bit, or it could be my eyes. I'm not sure ;)

AdrianBZG added a commit that referenced this issue Jun 15, 2018

@AdrianBZG

This comment has been minimized.

Copy link
Owner

AdrianBZG commented Jun 15, 2018

@yochannah Probably you are right, since the height needs to be 37px... and maybe with 50px width is not correct, now it's 40px so it's almost a square... what do you think?

@yochannah

This comment has been minimized.

Copy link
Collaborator Author

yochannah commented Jun 15, 2018

For a height of 37 I think it probably needs a width of 36 - try that?

AdrianBZG added a commit that referenced this issue Jun 15, 2018

AdrianBZG added a commit that referenced this issue Jun 15, 2018

AdrianBZG added a commit that referenced this issue Jun 15, 2018

@AdrianBZG

This comment has been minimized.

Copy link
Owner

AdrianBZG commented Jun 15, 2018

@yochannah What about now? 😄

@AdrianBZG

This comment has been minimized.

Copy link
Owner

AdrianBZG commented Jun 15, 2018

@yochannah PS: For some reason Travis network is 💀

PS2: 👍 now

@yochannah

This comment has been minimized.

Copy link
Collaborator Author

yochannah commented Jun 15, 2018

looks good!

@yochannah yochannah closed this Jun 15, 2018

AdrianBZG added a commit that referenced this issue Feb 4, 2019

Merge pull request #29 from himanshuc3/select
Select Views initial draft
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.