From 961037561d3fe7b70fbe9d7a196502527374d8f6 Mon Sep 17 00:00:00 2001
From: Dan Scott <dscott@laurentian.ca>
Date: Tue, 17 Jul 2012 12:39:37 -0400
Subject: [PATCH] TPAC: Slightly more accessible user-visible account notes
 display

Rather than a table layout that resembles an unordered list, use a real
table with table header so that screen readers will know what to
associate each column with.

Also, move the table display into its own class so that we don't pick up
the uppercase transform, and move it out of the div box so that we can
use whatever screen real estate is given to us, rather than forcing
notes into the hard-coded 662px box.

Signed-off-by: Dan Scott <dscott@laurentian.ca>
Signed-off-by: Bill Erickson <berick@esilibrary.com>
---
 .../src/templates/opac/parts/myopac/main_base.tt2   | 21 ++++++++++++---------
 Open-ILS/web/css/skin/default/opac/style.css        | 14 ++++++++++++++
 2 files changed, 26 insertions(+), 9 deletions(-)

diff --git a/Open-ILS/src/templates/opac/parts/myopac/main_base.tt2 b/Open-ILS/src/templates/opac/parts/myopac/main_base.tt2
index 922b783b83..02c1509101 100644
--- a/Open-ILS/src/templates/opac/parts/myopac/main_base.tt2
+++ b/Open-ILS/src/templates/opac/parts/myopac/main_base.tt2
@@ -82,18 +82,21 @@
                 </table>
             </div>
 
-            [% IF ctx.user.notes.0 %]
-            <div class="acct_sum_row">
-                <table>
-                [% FOR note IN ctx.user.notes %]
-                    <tr><td class='public-note-title'>[% l('* [_1]: ', note.title) | html %]</td><td>[% note.value | html %]</td></tr>
-                [% END %]
-                </table>
-            </div>
-            [% END %]
         </div>
     </div>
     <div class="clear-both"></div>
+
+    [% IF ctx.user.notes.0 %]
+    <table class="acct_notes">
+        <thead><th>[% l('Note title') %]</th><th>[% l('Content') %]</th></thead>
+        <tbody>
+        [% FOR note IN ctx.user.notes %]
+            <tr><td class='public-note-title'>[% note.title | html %]</td><td>[% note.value | html %]</td></tr>
+        [% END %]
+        </tbody>
+    </table>
+    [% END %]
+
     <div id='fines_payments_wrapper'>
         <div id='acct_fines_tabs'>
             [% IF myopac_main_page == 'main' %]
diff --git a/Open-ILS/web/css/skin/default/opac/style.css b/Open-ILS/web/css/skin/default/opac/style.css
index b9faf63013..f68a101a44 100644
--- a/Open-ILS/web/css/skin/default/opac/style.css
+++ b/Open-ILS/web/css/skin/default/opac/style.css
@@ -878,6 +878,20 @@ div.result_place_hold {
 	font-size:12px;
 }
 
+table.acct_notes {
+    border-collapse: collapse;
+    margin: -1em 0 0.5em 0;
+}
+
+table.acct_notes * {
+    border: solid thin;
+    padding: 0.5em; 
+}
+
+table.acct_notes th {
+    font-weight: bold;
+}
+
 #myopac_sum_fines {
 	float:right;
 	padding: 15px 0px 0px 23px;
-- 
2.11.0