Bug 19851 - Improve responsive layout handling of staff client menu bar
Summary: Improve responsive layout handling of staff client menu bar
Status: CLOSED FIXED
Alias: None
Product: Koha
Classification: Unclassified
Component: Templates (show other bugs)
Version: Main
Hardware: All All
: P5 - low minor
Assignee: Owen Leonard
QA Contact: Josef Moravec
URL:
Keywords:
Depends on:
Blocks: 14546 20051 20135
  Show dependency treegraph
 
Reported: 2017-12-20 16:50 UTC by Owen Leonard
Modified: 2020-01-06 20:17 UTC (History)
5 users (show)

See Also:
Change sponsored?: ---
Patch complexity: Small patch
Documentation contact:
Documentation submission:
Text to go in the release notes:
Version(s) released in:
Circulation function:


Attachments
Screenshot showing broken layout below 768 pixels wide (58.38 KB, image/png)
2017-12-20 16:50 UTC, Owen Leonard
Details
Screenshot of the proposed updated interface (84.56 KB, image/png)
2017-12-20 17:04 UTC, Owen Leonard
Details
Bug 19851: Improve responsive layout handling of staff client menu bar (10.64 KB, patch)
2017-12-21 13:51 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 19851: Improve responsive layout handling of staff client menu bar (10.69 KB, patch)
2017-12-22 21:36 UTC, Dominic Pichette
Details | Diff | Splinter Review
Bug 19851: Improve responsive layout handling of staff client menu bar (10.74 KB, patch)
2017-12-23 08:08 UTC, Josef Moravec
Details | Diff | Splinter Review

Note You need to log in before you can comment on or make changes to this bug.
Description Owen Leonard 2017-12-20 16:50:13 UTC
Created attachment 69952 [details]
Screenshot showing broken layout below 768 pixels wide

The built-in Bootstrap responsive layout makes the staff client's menu bar behave badly at browser widths smaller than 768 pixels. I propose to add some CSS to make it work somewhat better.
Comment 1 Owen Leonard 2017-12-20 17:04:06 UTC
Created attachment 69957 [details]
Screenshot of the proposed updated interface

In the proposed revision, the logged-in user's name and branch would move to the dropdown menu at lower screen widths.
Comment 2 Jon Knight 2017-12-20 17:20:53 UTC
That looks much better to me!
Comment 3 Owen Leonard 2017-12-21 13:51:16 UTC Comment hidden (obsolete)
Comment 4 Dominic Pichette 2017-12-22 21:36:10 UTC Comment hidden (obsolete)
Comment 5 Josef Moravec 2017-12-23 08:08:17 UTC
Created attachment 70149 [details] [review]
Bug 19851: Improve responsive layout handling of staff client menu bar

This patch modifies CSS and markup in the staff client header to
override the default responsive style of the menu bar. The changed
layout will keep the menu bar items in a horizontal line at lower screen
widths.

To test, apply the patch and clear your browser cache if necessary.

 - Log in to the staff client and confirm that the appearance of the
   menu bar at the top of the screen looks correct at various browser
   widths.
 - Confirm that the logged-in user menu label and help link expand and
   collapse according to browser width.

Signed-off-by: dom <dominic.pichette@inlibro.com>

Signed-off-by: Josef Moravec <josef.moravec@gmail.com>
Comment 6 Josef Moravec 2017-12-23 08:09:07 UTC
Nice job Owen ;)
Comment 7 Jonathan Druart 2017-12-26 15:54:03 UTC
Pushed to master for 18.05, thanks to everybody involved!
Comment 8 Nick Clemens (kidclamp) 2018-01-15 16:46:26 UTC
Awesome work all, pushed to stable for 17.11.02
Comment 9 Fridolin Somers 2018-01-25 09:36:22 UTC
This looks more like enhancement to me.
BTW I will wait for Bug 20051 to decide if I backport to 17.05.x