use plain titles instead of table captions

resources/css/renater.css

@@ -310,7 +310,7 @@ td.label {
 .wizard > .content {
     border: 2px solid #d90d12;
 }
-div.account table caption {
+div.account h3 {
     background-color: #41494c;
 }
 div.account table tbody {

resources/css/style.css

@@ -165,18 +165,18 @@ div.account {
     box-shadow: 0 3px 5px #333;
     padding:0.5rem;
 }
-div.account table {
-    table-layout: fixed;
-    word-wrap: break-word;
-    margin-bottom: 0;
-}
-div.account table caption {
+div.account h3 {
     background-color: #f1893b;
     color: #FFFFFF;
     border-radius: 3px 3px 0 0;
     text-align: center;
     font-weight: bold;
 }
+div.account table {
+    table-layout: fixed;
+    word-wrap: break-word;
+    margin-bottom: 0;
+}
 div.account table tbody {
     border:1px solid #f1893b;
 }

templates/web/edugain/create_accounts.tt2.html

@@ -20,8 +20,8 @@
         [% template = account.profile() _ '.tt2' %]
         [% PROCESS $template scope=account.scope() id=account.id() | trim %]
     <div class="account small-12 medium-6 large-4 columns">
+        <h3>[% lh.maketext("Account profile: [_1]", account.profile()) %]</h3>
         <table>
-            <caption>[% lh.maketext("Account profile: [_1]", account.profile()) %]</caption>
             <tr>
                 <td><strong>[% lh.maketext("user name:") %]</strong></td>
                 <td>user[% account.id() %]</td>
@@ -41,7 +41,7 @@
             <button data-open="account_details_[% account.id() %]" id="show_account_details_[% account.id() %]">[% lh.maketext("show details") %]</button>
         </div>
     </div>
-    <div class="reveal" data-reveal id="account_details_[% account.id() %]">
+    <div class="account reveal" data-reveal id="account_details_[% account.id() %]">
         <button class="close-button" data-close aria-label="Close modal" type="button">
             <span aria-hidden="true">&times;</span>
         </button>
@@ -52,7 +52,6 @@
         </p>
         <div>
             <table>
-                <caption>[% lh.maketext("List of user attributes") %]</caption>
     [% FOREACH pair IN attributes.pairs %]
                 <tr>
                     <th>[% pair.key %]</th><td>[% pair.value.join(', ') %]</td>

templates/web/renater/create_accounts.tt2.html

@@ -22,8 +22,8 @@
         [% template = account.profile() _ '.tt2' %]
         [% PROCESS $template scope=account.scope() id=account.id() | trim %]
     <div class="account small-12 medium-6 large-4 columns">
+        <h3>[% lh.maketext("Account profile: [_1]", account.profile()) %]</h3>
         <table>
-            <caption>[% lh.maketext("Account profile: [_1]", account.profile()) %]</caption>
             <tr>
                 <td><strong>[% lh.maketext("user name:") %]</strong></td>
                 <td>user[% account.id() %]</td>
@@ -43,7 +43,7 @@
             <button data-open="account_details_[% account.id() %]" id="show_account_details_[% account.id() %]">[% lh.maketext("show details") %]</button>
         </div>
     </div>
-    <div class="reveal" data-reveal id="account_details_[% account.id() %]">
+    <div class="account reveal" data-reveal id="account_details_[% account.id() %]">
         <button class="close-button" data-close aria-label="Close modal" type="button">
             <span aria-hidden="true">&times;</span>
         </button>
@@ -54,7 +54,6 @@
         </p>
         <div>
             <table>
-                <caption>[% lh.maketext("List of user attributes") %]</caption>
     [% FOREACH pair IN attributes.pairs %]
                 <tr>
                     <th>[% pair.key %]</th><td>[% pair.value.join(', ') %]</td>