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

Special:Ask/Browse add flex (responsive) mode to div table #2891

Merged
merged 1 commit into from Dec 16, 2017

Conversation

Projects
None yet
2 participants
@mwjames
Copy link
Contributor

mwjames commented Dec 16, 2017

This PR is made in reference to: #

This PR addresses or contains:

  • Uses display: flex; on DIV tables so they can be transformed to create a responsive representation of content (Special:Ask and Special:Browse)
  • Adds .smwb-factbox .group-link:before and .smwb-ifactbox .group-link:after to add a group icon ()
  • During the responsive mode, group sections become distinguishable by colour when switching to a one-column representation

image

This PR includes:

  • Tests (unit/integration)
  • CI build passed

Fixes #

@mwjames mwjames added the feature label Dec 16, 2017

@mwjames mwjames added this to the SMW 3.0.0 milestone Dec 16, 2017

@mwjames

This comment has been minimized.

Copy link
Contributor

mwjames commented Dec 16, 2017

@kghbln @s7eph4n Access via a mobile (small screen) device should get easier with this.

It might be worthwhile to investigate [0] whether the TableResultPrinter could be transformed in a way so that behaviour becomes similar.

[0] https://css-tricks.com/accessible-simple-responsive-tables/

@mwjames mwjames merged commit 7f1ad49 into master Dec 16, 2017

2 checks passed

continuous-integration/travis-ci/pr The Travis CI build passed
Details
continuous-integration/travis-ci/push The Travis CI build passed
Details

@mwjames mwjames deleted the flex-mode branch Dec 16, 2017

@kghbln

This comment has been minimized.

Copy link
Member

kghbln commented Dec 16, 2017

It might be worthwhile to investigate [0] whether the TableResultPrinter could be transformed in a way so that behaviour becomes similar.
[0] https://css-tricks.com/accessible-simple-responsive-tables/

I very much favour the vertical scroll approach described.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment