https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=41151

Martin Renvoize (ashimema) <[email protected]> changed:

           What    |Removed                     |Added
----------------------------------------------------------------------------
 Attachment #188880|0                           |1
        is obsolete|                            |

--- Comment #22 from Martin Renvoize (ashimema) 
<[email protected]> ---
Created attachment 188922
  -->
https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=188922&action=edit
Bug 41151: Replace FontAwesome icons with SVG and improve input styling

This patch updates all clear buttons with two improvements:

1. Replaced FontAwesome icons with cleaner SVG X icon from vue-select
2. Updated input padding to match Select2/vue-select styling

Changes:
- Replaced <i class="fa fa-times"></i> with SVG in InputText
- Replaced <i class="fa fa-times"></i> with SVG in InputNumber
- Replaced <i class="fa fa-times"></i> with SVG in TextArea
- Replaced <i class="fa fa-times"></i> with SVG in AdditionalFieldsEntry
- Updated CSS from .clear-button i to .clear-button svg
- Added title attribute for better tooltip support
- Updated input padding from just "padding-right: 2rem" to full padding
  specification: "padding: 0.375rem 2rem 0.375rem 0.75rem"
- Added line-height: 1.5 to match Select2 styling

The SVG icon:
- Is the same 10x10 SVG used in vue-select components
- Uses currentColor via fill for proper color inheritance
- Maintains the same hover/focus color transitions (#999 → #333)
- Provides a cleaner, more professional appearance

The improved padding:
- Matches the vertical and horizontal spacing of Select2 dropdowns
- Makes text inputs less "squashed" and more spacious
- Creates visual consistency across all form controls
- Uses Bootstrap's standard input padding (0.375rem vertical, 0.75rem
horizontal)

This creates visual consistency between clear buttons and padding across
all input types and the existing Select2/vue-select components.

-- 
You are receiving this mail because:
You are watching all bug changes.
_______________________________________________
Koha-bugs mailing list
[email protected]
https://lists.koha-community.org/cgi-bin/mailman/listinfo/koha-bugs
website : http://www.koha-community.org/
git : http://git.koha-community.org/
bugs : http://bugs.koha-community.org/

Reply via email to