|
Description
Michael Hafen
2025-07-02 00:17:20 UTC
Created attachment 183680 [details] [review] ug 40288 - constrain patron brief info in patron sidebar to parent width The patron info in the patron / circ-menu sidebar is not constrained to it's parent's width. I found this with a very long email address, where the ul grew to match the email address length, and the patron image container also grew. Both overflowed the sidebar. Test plan: 1. find or make a patron with a very long email address (more tha 50 characters). 2. open the patron details page for that patron. Observe the patron image and patron details overflows the patron sidebar (the email address will be hidden under the contact information panel. 3. Apply patch and rebuild css files 4. open the patron details page for that patron again. Observe the patron image and details does not overflow the patron sidebar. Created attachment 183681 [details]
screenshot
Png screenshot showing patron image and email address overflowing sidebar
The flex-related properties on .patroninfo-container don't seem to be useful, and I think if you just remove them it gets you what you want:
.patroninfo-container {
- display: flex;
- flex-direction: row;
- flex-wrap: wrap;
- justify-content: left;
margin-left: 1rem;
}
Created attachment 183770 [details] [review] Bug 40288 - constrain patron brief info in patron sidebar to parent width [ Alternate patch based on comment #3 from Owen Leonard. This way looks better ] The patron info in the patron / circ-menu sidebar is not constrained to it's parent's width. I found this with a very long email address, where the ul grew to match the email address length, and the patron image container also grew. Both overflowed the sidebar. Test plan: 1. find or make a patron with a very long email address (more tha 50 characters). 2. open the patron details page for that patron. Observe the patron image and patron details overflows the patron sidebar (the email address will be hidden under the contact information panel. 3. Apply patch and rebuild css files. It may be necessary to clear the browser cache. 4. open the patron details page for that patron again. Observe the patron image and details does not overflow the patron sidebar. Created attachment 183799 [details] [review] Bug 40288 - constrain patron brief info in patron sidebar to parent width The patron info in the patron / circ-menu sidebar is not constrained to it's parent's width. I found this with a very long email address, where the ul grew to match the email address length, and the patron image container also grew. Both overflowed the sidebar. Test plan: 1. find or make a patron with a very long email address (more tha 50 characters). 2. open the patron details page for that patron. Observe the patron image and patron details overflows the patron sidebar (the email address will be hidden under the contact information panel. 3. Apply patch and rebuild css files. It may be necessary to clear the browser cache. 4. open the patron details page for that patron again. Observe the patron image and details does not overflow the patron sidebar. Signed-off-by: George <george@nekls.org> Test plan works as written. As an additional observation, though, it appears that any value in any field that appears in .patroninfo will do the same thing if it doesn't have any spaces in it. If you put a 100 character long word in a patron's address2, for example, it will do the exact same thing that a 100 character long e-mail address will. If this fix could be applied to all fields that appear in .patroninfo, that would be a better fix. Created attachment 183874 [details] [review] Apply overflow css to all of patronbriefinfo li's, and patroninfo-section li's too. QA tool complains about your commit messages: Processing additional checks * Commit title does not start with 'Bug XXXXX: ' - eaedad358cb * Commit title does not contain 'follow-up' correctly spelt - eaedad358cb * Commit title does not start with 'Bug XXXXX: ' - b9e95d52ff1 Created attachment 189135 [details] [review] Bug 40288: constrain patron brief info in patron sidebar to parent width The patron info in the patron / circ-menu sidebar is not constrained to it's parent's width. I found this with a very long email address, where the ul grew to match the email address length, and the patron image container also grew. Both overflowed the sidebar. Test plan: 1. find or make a patron with a very long email address (more tha 50 characters). 2. open the patron details page for that patron. Observe the patron image and patron details overflows the patron sidebar (the email address will be hidden under the contact information panel. 3. Apply patch and rebuild css files. It may be necessary to clear the browser cache. 4. open the patron details page for that patron again. Observe the patron image and details does not overflow the patron sidebar. Signed-off-by: George <george@nekls.org> Created attachment 189136 [details] [review] Bug 40288: Apply overflow css to all of patronbriefinfo li's Apply overflow css to all of patronbriefinfo li's and patroninfo-section li's too. Created attachment 189195 [details] [review] Bug 40288: constrain patron brief info in patron sidebar to parent width The patron info in the patron / circ-menu sidebar is not constrained to it's parent's width. I found this with a very long email address, where the ul grew to match the email address length, and the patron image container also grew. Both overflowed the sidebar. Test plan: 1. find or make a patron with a very long email address (more tha 50 characters). 2. open the patron details page for that patron. Observe the patron image and patron details overflows the patron sidebar (the email address will be hidden under the contact information panel. 3. Apply patch and rebuild css files. It may be necessary to clear the browser cache. 4. open the patron details page for that patron again. Observe the patron image and details does not overflow the patron sidebar. Signed-off-by: George <george@nekls.org> Signed-off-by: Owen Leonard <oleonard@myacpl.org> Created attachment 189196 [details] [review] Bug 40288: Apply overflow css to all of patronbriefinfo li's and patroninfo-section li's too. Signed-off-by: Owen Leonard <oleonard@myacpl.org> Created attachment 189323 [details] [review] Bug 40288: constrain patron brief info in patron sidebar to parent width The patron info in the patron / circ-menu sidebar is not constrained to it's parent's width. I found this with a very long email address, where the ul grew to match the email address length, and the patron image container also grew. Both overflowed the sidebar. Test plan: 1. find or make a patron with a very long email address (more tha 50 characters). 2. open the patron details page for that patron. Observe the patron image and patron details overflows the patron sidebar (the email address will be hidden under the contact information panel. 3. Apply patch and rebuild css files. It may be necessary to clear the browser cache. 4. open the patron details page for that patron again. Observe the patron image and details does not overflow the patron sidebar. Signed-off-by: George <george@nekls.org> Signed-off-by: Owen Leonard <oleonard@myacpl.org> Signed-off-by: Laura_Escamilla <laura.escamilla@bywatersolutions.com> Created attachment 189324 [details] [review] Bug 40288: Apply overflow css to all of patronbriefinfo li's and patroninfo-section li's too. Signed-off-by: Owen Leonard <oleonard@myacpl.org> Signed-off-by: Laura_Escamilla <laura.escamilla@bywatersolutions.com> Nice work everyone! Pushed to main for 25.11 |