Bug 33121

Summary: Form labels not large enough
Product: Koha Reporter: Fridolin Somers <fridolin.somers>
Component: TemplatesAssignee: Owen Leonard <oleonard>
Status: NEW --- QA Contact: Testopia <testopia>
Severity: enhancement    
Priority: P5 - low CC: caroline.cyr-la-rose
Version: Main   
Hardware: All   
OS: All   
GIT URL: Change sponsored?: ---
Patch complexity: --- Documentation contact:
Documentation submission: Text to go in the release notes:
Version(s) released in:
Circulation function:
Attachments: Screenshot of patron add form on main in fr-CA

Description Fridolin Somers 2023-03-02 21:14:44 UTC
In forms like OPAC personal details, the label may be bigger than the dedicated place.
The label then overlaps the field.

This happens for example in Dutch where 'Library card number' is  'Bibliotheekkaartnummer'.
I see German translation on purpose uses shorter labels like 'Sekundäre Telefonnr.:'.

Currently the CSS rule defines 9rem for labels.

I've managed to rise, for OPAC personal details, to 14rem with the following rules :

body#opac-patron-update fieldset.rows .label, fieldset.rows label {
  width: 14rem;
}
body#opac-patron-update fieldset.rows div.required_label.required {
  margin-left: 15rem;
}
body#opac-patron-update fieldset.rows div.label {
  width: 14rem;
}

I'm not sure it is enough to propose a patch on CSS rules.

Waiting for feedbacks please.
Comment 1 Katrin Fischer 2023-03-03 13:35:39 UTC
We have problems in several parts of Koha because of the longer names in German. I think what we subconsciously do in development is to make things look pretty for English, but that sometimes means that things get too narrow or too inflexible for other languages. 

We use a set of CSS rules in OpacUserCSS and IntranetUserCSS to fix some of those spots, but it means that Koha doesn't look nice out of the box.

I'd love if there was a solution to have the forms reshape for different label lengths.
Comment 2 Caroline Cyr La Rose 2025-02-13 15:54:22 UTC
Created attachment 178032 [details]
Screenshot of patron add form on main in fr-CA

Could we consider making the forms larger (and responsive for smaller screens)?On my screen, the patron add form takes up 1/5 of the width of the screen, and 1/3 of the space allocated to the form. (see attached screenshot)

I feel like the space could be put to use better