Bootstrap

From Koha Wiki
Jump to navigation Jump to search

Bootstrap is a Web-Kit that is built by personnel at Twitter that focuses on the GUI (Graphical User Interface) of a website, that allows users to access HTML and CSS design templates, while having the opportunity to use optional JavaScript extensions.

It is one of the most popular projects on GitHub and is used by many various sites found throughout the internet.


The implementation of Bootstrap on Koha is currently premature, however, work on re-designing components on the Koha Intranet was started by Corey Fuimaono (MrAgent075) at Catalyst IT (Wellington), during the Open Source Academy Workshop that has run every year since 2011.

On Janurary 17th, work started when the goal of first implimenting Bootstrap to Koha, was to simply make the Top Navigation Bar more User-Friendly and Accessible to Administrators and Librarians etc. whom might need to use a Screen Reader.

This is because the links that were originally found on the Navigation Bar were hard to go, back and forth. Also, the "More" button left Visually Impaired Users to Query what "More" actually men't, in other words, context was a huge issue.

Another issue, which needed improvement, were the links that were considered to be poorly formatted on the Right Side of the Navigation Bar. [Screenshot ] To fix these problems, the following below discuss (in summery) on how the problems were solved.


  1. Bar is formatted in stylish manner.
  2. Set Library and Log Out links were included in a menu, which was headed by the username of the current user logged in [@] the library branch they were currently located at.
  3. Help was changed from "[ ? ]" due to Contextual Issues. This was filed as a bug by Corey Fuimaono, before work on implimenting Bootstrap began.

Corey and the team noticed that there were a couple errors after downloading & coding the full version of Bootstrap and implementing it on Koha. For example, there was an issue where CSS files from Bootstrap were conflicting style attribute instructions with default values, set by the staff-global CSS file. This was discovered when boxes had appeared too large and tables had been applied with a different style.