LP#1980142: adjust styling of patron message body in Bootstrap OPAC

This patch resolves an issue where the text of the message body
could be rendered very small due to default styles applied to the <pre>
element. In particular, it converts the <pre> to a <p> and restores
a TPAC-era style that ensures that

* long lines in the message wrap
* but line breaks are also preserved (see LP#1927990)

This patch also ensures that the message body is not displayed with
label but no contents if the body is empty.

To test
-------
[1] Create a public patron note that contains line breaks and
    long lines.
[2] Note that in the Bootstrap OPAC message view, the message
    displays with fixed-width text (that may use a smaller font
    than the rest of the page) and has a horizontal scrollbar
    (due to the long line).
[3] Apply the patch and look at the message again in the OPAC.
    This time, the long line should wrap, but line breaks are
    also preserved.

This patch includes a portion of a patch by Garry Collum.

Signed-off-by: Galen Charlton <gmc@equinoxOLI.org>
Signed-off-by: Mary Llewelln <mllewell@biblio.org>
Signed-off-by: Terran McCanna <tmccanna@georgialibraries.org>

diff --git a/Open-ILS/src/templates-bootstrap/opac/myopac/messages/single_message.tt2 b/Open-ILS/src/templates-bootstrap/opac/myopac/messages/single_message.tt2
index c12475c..016d2f5 100755 (executable)
--- a/Open-ILS/src/templates-bootstrap/opac/myopac/messages/single_message.tt2
+++ b/Open-ILS/src/templates-bootstrap/opac/myopac/messages/single_message.tt2
@@ -35,10 +35,12 @@
             <b>[% l("Subject") %]</b>
             <span class="mx-2">[% ctx.patron_messages.0.title | html %]</span>
         </div>
+        [% IF ctx.patron_messages.0.message %]
         <div class="my-2 col-12">
             <b>[% l("Message") %]</b>
-            <pre>[% ctx.patron_messages.0.message | html %]</pre>
+            <p class="myopac_message_message">[% ctx.patron_messages.0.message | html %]</p>
         </div>
+        [% END %]
         </div>
     </div>
 </div>