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

web: remove max-width; make responsive #48

Merged
merged 1 commit into from
May 21, 2019
Merged

web: remove max-width; make responsive #48

merged 1 commit into from
May 21, 2019

Conversation

jmank88
Copy link
Contributor

@jmank88 jmank88 commented May 17, 2019

This PR removes the max-width: 1000px limit and adapts the interface to lower resolutions. The biggest change is that the table collapses gracefully, but there are many other small tweaks as well.
Screenshot from 2019-05-21 09-34-57

@brockmcblockchain
Copy link

brockmcblockchain commented May 17, 2019

If you want some mobile style:

@media only screen and (max-width: 992px)
  .nodeBody>.nodeRow {
    padding: 2rem 1rem 4rem;
  }
  .big-info.chart {
    display: none;
  }
  .nodeBody>.nodeRow:nth-child(odd) {
    background: #232323b3;
  }
}

take it or leave it -- just gives the rows of nodes a bit more breathing room/difference in background to make them more readable. Also removes the big bars of blue that don't really mean anything on mobile as they rely on hover to show their data.

@jmank88
Copy link
Contributor Author

jmank88 commented May 21, 2019

Updated with row padding and odd backgrounds. I don't want to hide the charts just yet, since I think they can be improved and the tooltips are still accessible right now - created #49 to follow up since this may be a more JS heavy change.
Edit: Was breaking on block numbers in the millions - tweaked to fit up to hundreds of millions.

@jmank88 jmank88 marked this pull request as ready for review May 21, 2019 14:34
@jmank88 jmank88 requested review from treeder and r-gochain May 21, 2019 14:35
@jmank88 jmank88 mentioned this pull request May 21, 2019
4 tasks
@jmank88 jmank88 merged commit b70f9a6 into master May 21, 2019
@jmank88 jmank88 deleted the responsive branch May 21, 2019 17:59
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants