Bug 9420

Summary: Work on Bootstrap for Koha
Product: Koha Reporter: Corey <agent.075>
Component: TemplatesAssignee: Owen Leonard <oleonard>
Status: CLOSED FIXED QA Contact: Jonathan Druart <jonathan.druart+koha>
Severity: new feature    
Priority: P5 - low CC: bgkriegel, elliott, gmcharlt, jonathan.druart+koha, katrin.fischer, liz
Version: master   
Hardware: All   
OS: All   
Change sponsored?: --- Patch complexity: Medium patch
Documentation contact: Documentation submission:
Text to go in the release notes:
Version(s) released in:
Bug Depends on:    
Bug Blocks: 9572    
Attachments: First Commit Patch
Bug 9420 - Work on Bootstrap for Koha
Bug 9420 - Work on Bootstrap for Koha
[Passed QA] Bug 9420 - Work on Bootstrap for Koha
Bug 9420 [Revised] Work on Bootstrap for Koha
[SIGNED-OFF] Bug 9420 [Revised] Work on Bootstrap for Koha
Bug 9420 - Work on Bootstrap for Koha: Circ toolbar
Bug 9420 [Revised] Work on Bootstrap for Koha: Circ toolbar
[SIGNED-OFF] Bug 9420 [Revised] Work on Bootstrap for Koha: Circ toolbar
Bug 9420 [Revised] Work on Bootstrap for Koha
Bug 9420 [Revised] Work on Bootstrap for Koha: Circ toolbar
Bug 9420 [Revised] Work on Bootstrap for Koha
Bug 9420 [Revised] Work on Bootstrap for Koha: Circ toolbar

Description Corey 2013-01-17 22:35:40 UTC Comment hidden (obsolete)
Comment 1 Owen Leonard 2013-01-25 20:39:57 UTC
I pushed a version of this to my Gitorious repo at http://gitorious.org/koha-dev/koha-dev in a branch called ip-bug-9420-bootstrap-header-2012-01-25. The differences are mostly cosmetic, with the main menu changes from the branch I was working on before along with the user menu changes introduced by Corey's patch.

TODO: Incorporate usage of Bootstrap's Tooltip feature to implement the Cart popup which is shown during Cart operations.
Comment 2 Owen Leonard 2013-01-28 19:46:52 UTC Comment hidden (obsolete)
Comment 3 Liz Rea 2013-01-28 21:18:57 UTC Comment hidden (obsolete)
Comment 4 Liz Rea 2013-01-28 21:21:02 UTC
Corey -

Get in touch with me for how to get this patch and apply it to your development environment, once you get that set up.

- Liz
Comment 5 Elliott Davis 2013-01-29 09:11:26 UTC Comment hidden (obsolete)
Comment 6 Jared Camins-Esakov 2013-01-29 14:50:07 UTC
Bootstrap is so cool that I am taking a break from my vacation to look at it!

I have only one objection: Bootstrap is under the themelanguage directory. I think we are trying to move this sort of library outside of theme and language directories. (unfortunately this will require a revised patch instead of a follow-up)

Otherwise, looks great! (there is space missing between the menu bar and the breadcrumbs on the advanced search page, but that could be dealt with later)
Comment 7 Owen Leonard 2013-01-29 15:14:42 UTC Comment hidden (obsolete)
Comment 8 Bernardo Gonzalez Kriegel 2013-01-29 19:47:03 UTC Comment hidden (obsolete)
Comment 9 Owen Leonard 2013-01-30 01:17:35 UTC Comment hidden (obsolete)
Comment 10 Liz Rea 2013-01-30 03:04:57 UTC
I prefer the bootstrap icons. I would sign off on that - I think the styling is fine.

Comment 11 Owen Leonard 2013-01-31 19:21:27 UTC Comment hidden (obsolete)
Comment 12 Bernardo Gonzalez Kriegel 2013-01-31 21:01:20 UTC Comment hidden (obsolete)
Comment 13 Owen Leonard 2013-02-08 19:01:49 UTC Comment hidden (obsolete)
Comment 14 Owen Leonard 2013-02-08 19:07:05 UTC Comment hidden (obsolete)
Comment 15 Owen Leonard 2013-02-08 19:07:55 UTC
New patches are rebased against current master, fixing minor conflicts.
Comment 16 Jonathan Druart 2013-02-14 15:41:43 UTC
QA comment:

I am a little bit embarrassed, I did not find anything to say about this big patch :)
It is a great patch !
According to the many modifications a side effect is possible, but I think it is in the interest of everyone to have this patch in master asap.
In this way there will be many testers and side effects will be easier to catch.

Marked as Passed QA.
Comment 17 Jonathan Druart 2013-02-14 15:42:08 UTC
Created attachment 15323 [details] [review]
Bug 9420 [Revised] Work on Bootstrap for Koha

YUI JS is deprecated as far as Koha is concerned, and jQueryUI menus
don't seem to be as robust as they should be. This makes Twitter
Bootstrap very attrative for its menus features as well as other

This patch revises the staff client header menu to include features from
Bootstrap, including replacement of the YUI-driven "More..." menu with a
Bootstrap version, and a new user menu taken from Corey Fuimaono's
similar patch.

To test, be sure to clear your cache after applying the patch. Load any
page in the staff client and confirm that the menu at the top of the
screen looks correct and works as normal, including functionality of the
"more" menu. Confirm that the username/logged-in branch triggers a menu
with "set library" and "log out" options. Confirm that Cart operations
trigger the correct confirmation popup.

Revision moves the Bootstrap assets out of the prog template into

Signed-off-by: Bernardo Gonzalez Kriegel <bgkriegel@gmail.com>

Works great. No errors.

Signed-off-by: Jonathan Druart <jonathan.druart@biblibre.com>
Comment 18 Jonathan Druart 2013-02-14 15:42:16 UTC
Created attachment 15324 [details] [review]
Bug 9420 [Revised] Work on Bootstrap for Koha: Circ toolbar

This patch converts the toolbar include file used by Circ and
Patron pages to Bootstrap, replacing YUI button and menu code
with Bootstrap markup.

To test, view any page in circ/ or members/ which uses
members-toolbar.inc (circulation.pl, moremember.pl, etc).
Buttons and menus should look correct and work correctly.

This version adds icons to the toolbar from the icon sprite included
with Bootstrap and revises the sprite to include two new ones, for
"copy" and "place hold" (for use in later patch). This customized
version is left in intranet-tmpl/img in order to keep
koha-tmpl/lib/bootstrap free of customized files.

Also added in this patch, a CSS tweak to override a style in the default
Bootstrap CSS for a class "close" which is already in use by Koha. To
replicate the Boostrap "close" class use "closebtn"

Signed-off-by: Bernardo Gonzalez Kriegel <bgkriegel@gmail.com>

Comment: All buttons works, and they look good.
Tested with Chrome and Firefox. In Chrome I see the buttons with
drop-down a little (1px) below the others.
In Firefox the alignment is ok.
No errors.

Signed-off-by: Jonathan Druart <jonathan.druart@biblibre.com>
Comment 19 Jared Camins-Esakov 2013-02-15 14:04:32 UTC
This patch has been pushed to master.
Comment 20 Bernardo Gonzalez Kriegel 2013-02-17 13:03:14 UTC
Bug 9653 seems to be related with this one pushed to master.