| Summary: | Toolbar containing text links lacks spacing | ||
|---|---|---|---|
| Product: | Koha | Reporter: | Owen Leonard <oleonard> |
| Component: | Templates | Assignee: | Owen Leonard <oleonard> |
| Status: | CLOSED FIXED | QA Contact: | Martin Renvoize (ashimema) <martin.renvoize> |
| Severity: | normal | ||
| Priority: | P5 - low | CC: | martin.renvoize, tomascohen |
| Version: | Main | ||
| Hardware: | All | ||
| OS: | All | ||
| Change sponsored?: | --- | Patch complexity: | Small patch |
| Documentation contact: | Documentation submission: | ||
| Text to go in the release notes: | Version(s) released in: |
22.11.00
|
|
| Circulation function: | |||
| Bug Depends on: | 30952 | ||
| Bug Blocks: | |||
| Attachments: |
Screenshot showing the crowded links
Bug 32109: Fix spacing in toolbars containing text links Bug 32109: Fix spacing in toolbars containing text links Bug 32109: Fix spacing in toolbars containing text links Bug 32109: Fix spacing in toolbars containing text links Bug 32109: Fix spacing in toolbars containing text links Bug 32109: Fix spacing in toolbars containing text links |
||
Created attachment 143178 [details] [review] Bug 32109: Fix spacing in toolbars containing text links This patch adds a new class to toolbars in certain contexts: Where the toolbar contains only text links (as opposed to Bootstrap-styled controls). This lets us set some comfortable padding on the links. To test, apply the patch and rebuild the staff interface CSS. Test the following pages to confirm that the toolbar of selection links ("Select all," "Clear all," etc.) has legible spacing. - Cataloging -> Batch item modification -> List of submitted barcodes - Cataloging -> Batch item deletion -> List of submitted barcodes - Cataloging -> Batch record modification -> List of submitted records - Cataloging -> Batch record deletion -> List of submitted records - Tools -> Batch extend due dates -> Preview results - Tools -> Batch patron modification -> List of submitted patrons I see.. this is another place we're a little inconsistent with how we mark up a 'toolbar'. On 'Opac problem reports' and 'checkout notes' there are similar "toolbars" for filtering the datatable... they have the following marking <fieldset class="action" style="cursor:pointer;"> Should we try to synchronize the markup of those two 'filter bars' too here? Challenge with this is that on those two pages there are also already <div id="toolbar"> blocks on the page too. I feel like an id of toolbar is wrong.. it should likely be a class instead.? Created attachment 143374 [details] [review] Bug 32109: Fix spacing in toolbars containing text links This patch adds a new class to toolbars in certain contexts: Where the toolbar contains only text links (as opposed to Bootstrap-styled controls). This lets us set some comfortable padding on the links. To test, apply the patch and rebuild the staff interface CSS. Test the following pages to confirm that the toolbar of selection links ("Select all," "Clear all," etc.) has legible spacing. - Cataloging -> Batch item modification -> List of submitted barcodes - Cataloging -> Batch item deletion -> List of submitted barcodes - Cataloging -> Batch record modification -> List of submitted records - Cataloging -> Batch record deletion -> List of submitted records - Tools -> Batch extend due dates -> Preview results - Tools -> Batch patron modification -> List of submitted patrons Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> Signing off.. happy to see a follow-up here to make the other two cases I identified match the markup.. or we could submit another bug for that.. I'll defer that decision to the RM/QA Created attachment 143837 [details] [review] Bug 32109: Fix spacing in toolbars containing text links This patch adds a new class to toolbars in certain contexts: Where the toolbar contains only text links (as opposed to Bootstrap-styled controls). This lets us set some comfortable padding on the links. To test, apply the patch and rebuild the staff interface CSS. Test the following pages to confirm that the toolbar of selection links ("Select all," "Clear all," etc.) has legible spacing. - Cataloging -> Batch item modification -> List of submitted barcodes - Cataloging -> Batch item deletion -> List of submitted barcodes - Cataloging -> Batch record modification -> List of submitted records - Cataloging -> Batch record deletion -> List of submitted records - Circulation -> Checkout notes - Tools -> Batch extend due dates -> Preview results - Tools -> Batch patron modification -> List of submitted patrons - Tools -> OPAC problem reports I reworked this so that all instances of the "selections-toolbar" class also have the "btn-toolbar" class, and the "toolbar" ID is removed. The intention of this is to reserve the "toolbar" ID for the "main" toolbar on the page, the one containing the action buttons. Created attachment 143858 [details] [review] Bug 32109: Fix spacing in toolbars containing text links This patch adds a new class to toolbars in certain contexts: Where the toolbar contains only text links (as opposed to Bootstrap-styled controls). This lets us set some comfortable padding on the links. To test, apply the patch and rebuild the staff interface CSS. Test the following pages to confirm that the toolbar of selection links ("Select all," "Clear all," etc.) has legible spacing. - Cataloging -> Batch item modification -> List of submitted barcodes - Cataloging -> Batch item deletion -> List of submitted barcodes - Cataloging -> Batch record modification -> List of submitted records - Cataloging -> Batch record deletion -> List of submitted records - Circulation -> Checkout notes - Tools -> Batch extend due dates -> Preview results - Tools -> Batch patron modification -> List of submitted patrons - Tools -> OPAC problem reports Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Great fix, thx! Created attachment 143890 [details] [review] Bug 32109: Fix spacing in toolbars containing text links This patch adds a new class to toolbars in certain contexts: Where the toolbar contains only text links (as opposed to Bootstrap-styled controls). This lets us set some comfortable padding on the links. To test, apply the patch and rebuild the staff interface CSS. Test the following pages to confirm that the toolbar of selection links ("Select all," "Clear all," etc.) has legible spacing. - Cataloging -> Batch item modification -> List of submitted barcodes - Cataloging -> Batch item deletion -> List of submitted barcodes - Cataloging -> Batch record modification -> List of submitted records - Cataloging -> Batch record deletion -> List of submitted records - Circulation -> Checkout notes - Tools -> Batch extend due dates -> Preview results - Tools -> Batch patron modification -> List of submitted patrons - Tools -> OPAC problem reports Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> Thanks Owen :) Created attachment 143957 [details] [review] Bug 32109: Fix spacing in toolbars containing text links This patch adds a new class to toolbars in certain contexts: Where the toolbar contains only text links (as opposed to Bootstrap-styled controls). This lets us set some comfortable padding on the links. To test, apply the patch and rebuild the staff interface CSS. Test the following pages to confirm that the toolbar of selection links ("Select all," "Clear all," etc.) has legible spacing. - Cataloging -> Batch item modification -> List of submitted barcodes - Cataloging -> Batch item deletion -> List of submitted barcodes - Cataloging -> Batch record modification -> List of submitted records - Cataloging -> Batch record deletion -> List of submitted records - Circulation -> Checkout notes - Tools -> Batch extend due dates -> Preview results - Tools -> Batch patron modification -> List of submitted patrons - Tools -> OPAC problem reports Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> Pushed to master for 22.11. Nice work everyone, thanks! |
Created attachment 143177 [details] Screenshot showing the crowded links In the redesign, <div id="toolbar"> has "display:flex," which works well for Bootstrap-styled buttons but creates a problem if the toolbar has only text links.