Bug 20668: Update two-column templates with Bootstrap grid: Acquisitions part 2

This patch modifies several acquisitions templates to use the Bootstrap
grid instead of YUI.

This patch also removes obsolete "text/javascript" attributes from
<script> tags in the modified templates.

Staff client CSS is modified in this patch so that elements which were
styled based on the sidebar's "yui-b" class will work with <aside>.

To test, apply the patch and view the following pages, confirming that
they look correct at various browser widths:

- I don't have EDI set up, so to test acqui/edi_ean.tt I navigate
  directly to /cgi-bin/koha/acqui/edi_ean.pl. It's only the page
  structure we're worried about.
- Acquisitions -> Orders search
- Acquisitions -> Vendor -> Invoices -> Invoice search
  - View an invoice
  - Manage invoice files (Preference AcqEnableFiles must be enabled).
- Acquisitions -> Late orders

Patch applies and operates as described.
Signed-off-by: Dilan Johnpullé <dilan@calyx.net.au>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>

Signed-off-by: Nick Clemens <nick@bywatersolutions.com>

koha-tmpl/intranet-tmpl/prog/css/staff-global.css

@@ -473,7 +473,8 @@ div#reserves,div#checkouts {
 }
 
 
-div.yui-b h5 {
+div.yui-b h5,
+aside h5 {
 	font-size : 100%;
 	margin : .5em 0;
 }
@@ -622,47 +623,64 @@ fieldset.rows div.hint {
     margin-left : 7.5em;
 }
 
-div.yui-b fieldset.brief {
-	padding : .4em .7em;
+div.yui-b fieldset.brief,
+aside fieldset.brief {
+    margin: 0;
+    padding : .4em .7em;
 }
 
-div.yui-b fieldset.brief ol {
+div.yui-b fieldset.brief ol,
+aside fieldset.brief ol {
 	font-size : 85%;
 	margin : 0;
 	padding : 0;
 }
 
 div.yui-b fieldset.brief select,
-div.yui-b fieldset.brief input[type=text] {
+div.yui-b fieldset.brief input[type=text],
+aside fieldset.brief select,
+aside fieldset.brief input[type=text] {
     width: 100%;
 }
 
-div.yui-b fieldset.brief li.radio {
+div.yui-b fieldset.brief li.radio,
+aside fieldset.brief li.radio {
 	padding : .7em 0;
 }
+
 div.yui-b fieldset.brief li.radio label,
 div.yui-b fieldset.brief li.checkbox label,
 div.yui-b fieldset.brief li.dateinsert label,
 div.yui-b fieldset.brief li.dateinsert span.label,
-div.yui-b fieldset.brief li.radio span.label {
+div.yui-b fieldset.brief li.radio span.label,
+aside fieldset.brief li.radio label,
+aside fieldset.brief li.checkbox label,
+aside fieldset.brief li.dateinsert label,
+aside fieldset.brief li.dateinsert span.label,
+aside fieldset.brief li.radio span.label {
 	display : inline;
 }
 
-div.yui-b fieldset.brief li.radio input {
+div.yui-b fieldset.brief li.radio input,
+aside fieldset.brief li.radio input {
 	padding:0.3em 0;
 }
 
-div.yui-b fieldset.brief fieldset {
-	margin : 0 .3em;
-	padding : .5em;
+div.yui-b fieldset.brief fieldset,
+aside fieldset.brief fieldset {
+    margin : 0;
+    padding : .5em 0;
 }
 
-div.yui-b fieldset.brief fieldset legend {
+div.yui-b fieldset.brief fieldset legend,
+aside fieldset.brief fieldset legend {
 	font-size : 85%;
 }
 
 #yui-main div.yui-b fieldset.brief select,
-#yui-main div.yui-b fieldset.brief input[type=text] {
+#yui-main div.yui-b fieldset.brief input[type=text],
+main div.yui-b fieldset.brief select,
+main div.yui-b fieldset.brief input[type=text] {
     width: auto;
 }
 

koha-tmpl/intranet-tmpl/prog/en/modules/acqui/edi_ean.tt

@@ -9,11 +9,10 @@
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/acqui/acqui-home.pl">Acquisitions</a> &rsaquo; Basket ([% basketno %])</div>
 
-<div id="doc3" class="yui-t2">
-
-<div id="bd">
-    <div id="yui-main">
-    <div class="yui-b">
+<div class="main container-fluid">
+    <div class="row">
+        <div class="col-sm-10 col-sm-push-2">
+            <main>
 
     <h2>Select the library account submitting the EDI order</h2>
     <br />
@@ -30,10 +29,14 @@
             <input type="submit" value="Send EDI order" />
         </p>
     </form>
+</main>
+</div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+<div class="col-sm-2 col-sm-pull-10">
+    <aside>
+        [% INCLUDE 'acquisitions-menu.inc' %]
+    </aside>
+</div> <!-- /.col-sm-2.col-sm-pull-10 -->
 </div>
-</div>
-<div class="yui-b">
-[% INCLUDE 'acquisitions-menu.inc' %]
-</div>
-</div>
+
 [% INCLUDE 'intranet-bottom.inc' %]

koha-tmpl/intranet-tmpl/prog/en/modules/acqui/histsearch.tt

@@ -14,12 +14,11 @@
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/acqui/acqui-home.pl">Acquisitions</a> &rsaquo; [% IF ( order_loop ) %]<a href="/cgi-bin/koha/acqui/histsearch.pl">Orders search</a> &rsaquo; Search results[% ELSE %]Order search[% END %]</div>
 
-<div id="doc3" class="yui-t2">
-   
-   <div id="bd">
-	<div id="yui-main">
-	<div class="yui-b">
-	
+<div class="main container-fluid">
+    <div class="row">
+        <div class="col-sm-10 col-sm-push-2">
+            <main>
+
 [% UNLESS ( order_loop ) %]<form action="/cgi-bin/koha/acqui/histsearch.pl" method="post">
 <fieldset class="rows">
     <legend>Search orders</legend>
@@ -200,11 +199,14 @@
       There is no order for this search.
     [% END %]
 
-</div>
-</div>
-<div class="yui-b">
-[% INCLUDE 'acquisitions-menu.inc' %]
-</div>
+</main>
+</div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+<div class="col-sm-2 col-sm-pull-10">
+    <aside>
+        [% INCLUDE 'acquisitions-menu.inc' %]
+    </aside>
+</div> <!-- /.col-sm-2.col-sm-pull-10 -->
 </div>
 
 [% MACRO jsinclude BLOCK %]
@@ -213,7 +215,7 @@
     [% INCLUDE 'datatables.inc' %]
     [% INCLUDE 'columns_settings.inc' %]
     [% Asset.js("js/autocomplete/patrons.js") %]
-    <script type="text/javascript">
+    <script>
         var MSG_REMOVE_PATRON = _("Remove");
         $(document).ready(function() {
             var columns_settings = [% ColumnsSettings.GetColumns( 'acqui', 'histsearch', 'histsearcht', 'json' ) %];

koha-tmpl/intranet-tmpl/prog/en/modules/acqui/invoice-files.tt

@@ -13,11 +13,11 @@
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/acqui/acqui-home.pl">Acquisitions</a> &rsaquo; <a href="/cgi-bin/koha/acqui/invoices.pl">Invoices</a> &rsaquo; <a href="/cgi-bin/koha/acqui/invoice.pl?invoiceid=[% invoiceid %]">[% invoicenumber %]</a> &rsaquo; Files</div>
 
-<div id="doc3" class="yui-t2">
+<div class="main container-fluid">
+    <div class="row">
+        <div class="col-sm-10 col-sm-push-2">
+            <main>
 
-<div id="bd">
-  <div id="yui-main">
-    <div class="yui-b">
       <h2>Files for invoice: [% invoicenumber | html %]</h2>
       <p><b>Vendor: </b><a href="/cgi-bin/koha/acqui/supplier.pl?booksellerid=[% booksellerid %]">[% suppliername %]</a></p>
       <br />
@@ -78,17 +78,20 @@
               </fieldset>
           </form>
       [% END %]
-    </div>
-  </div>
-  <div class="yui-b">
-    [% INCLUDE 'acquisitions-menu.inc' %]
-  </div>
-</div>
+    </main>
+  </div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+<div class="col-sm-2 col-sm-pull-10">
+    <aside>
+        [% INCLUDE 'acquisitions-menu.inc' %]
+    </aside>
+</div> <!-- /.col-sm-2.col-sm-pull-10 -->
+</div> <!-- /.row -->
 
 [% MACRO jsinclude BLOCK %]
     [% Asset.js("js/acquisitions-menu.js") %]
     [% INCLUDE 'datatables.inc' %]
-    <script type="text/javascript">
+    <script>
         $(document).ready(function() {
             $("#invoice_files_details_table").dataTable($.extend(true, {}, dataTablesDefaults, {
                 "aoColumnDefs": [

koha-tmpl/intranet-tmpl/prog/en/modules/acqui/invoice.tt

@@ -15,11 +15,11 @@
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/acqui/acqui-home.pl">Acquisitions</a> &rsaquo; <a href="/cgi-bin/koha/acqui/invoices.pl">Invoices</a> &rsaquo; <a href="/cgi-bin/koha/acqui/invoice.pl?invoiceid=[% invoiceid %]">[% invoicenumber %]</a></div>
 
-<div id="doc3" class="yui-t2">
+<div class="main container-fluid">
+    <div class="row">
+        <div class="col-sm-10 col-sm-push-2">
+            <main>
 
-<div id="bd">
-  <div id="yui-main">
-    <div class="yui-b">
       [% IF ( modified ) %]
         <div class="dialog message">
           <p>Invoice has been modified</p>
@@ -142,7 +142,8 @@
               [% FOR tf IN foot_loop %]
                 <tr>
                     <th colspan="2">Total (GST [% tf.tax_rate * 100 %] %)</th>
-                    <th class="tax_excluded"/><th class="tax_included"/>
+                    <th class="tax_excluded"></th>
+                    <th class="tax_included"></th>
                     <th>[% tf.quantity %]</th>
                     <th class="tax_excluded">[% tf.total_tax_excluded | $Price %]</th>
                     <th class="tax_included">[% tf.total_tax_included | $Price %]</th>
@@ -152,8 +153,9 @@
                 </tr>
               [% END %]
               <tr>
-                <th colspan='2'>Total ([% currency.symbol %])</th>
-                <th class="tax_excluded"/><th class="tax_included"/>
+                <th colspan="2">Total ([% currency.symbol %])</th>
+                <th class="tax_excluded"></th>
+                <th class="tax_included"></th>
                 <th>[% total_quantity %]</th>
                 <th class="tax_excluded">[% total_tax_excluded | $Price %]</th>
                 <th class="tax_included">[% total_tax_included | $Price %]</th>
@@ -203,18 +205,21 @@
                 </tbody>
             </table>
         [% END %]
-    </div>
-  </div>
-  <div class="yui-b">
-    [% INCLUDE 'acquisitions-menu.inc' %]
-  </div>
-</div>
+    </main>
+  </div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+    <aside>
+        <div class="col-sm-2 col-sm-pull-10">
+            [% INCLUDE 'acquisitions-menu.inc' %]
+        </div>
+    </aside>
+</div> <!-- /.row -->
 
 [% MACRO jsinclude BLOCK %]
     [% Asset.js("js/acquisitions-menu.js") %]
     [% INCLUDE 'calendar.inc' %]
     [% INCLUDE 'datatables.inc' %]
-    <script type="text/javascript">
+    <script>
         function updateColumnsVisibility(visible) {
             if ( visible ) {
                 $("table .tax_excluded, .tax_included").show();

koha-tmpl/intranet-tmpl/prog/en/modules/acqui/invoices.tt

@@ -15,11 +15,11 @@
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/acqui/acqui-home.pl">Acquisitions</a> &rsaquo; Invoices</div>
 
-<div id="doc3" class="yui-t2">
+<div class="main container-fluid">
+    <div class="row">
+        <div class="col-sm-10 col-sm-push-2">
+            <main>
 
-<div id="bd">
-  <div id="yui-main">
-    <div class="yui-b">
       <h1>Invoices</h1>
       [% IF ( do_search ) %]
         [% IF invoices %]
@@ -201,11 +201,13 @@
       [% ELSE %]
         <p>Use the search form on the left to find invoices.</p>
       [% END %]<!-- do_search -->
-    </div>
-  </div>
-  <div class="yui-b">
+    </main>
+</div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+<div class="col-sm-2 col-sm-pull-10">
+<aside>
     <form action="" method="get">
-      <fieldset class="brief">
+      <fieldset class="sidebar brief">
         <h3>Search filters</h3>
         <ol>
           <li>
@@ -291,14 +293,15 @@
       <input type="hidden" name="op" id="op" value="do_search" />
     </form>
     [% INCLUDE 'acquisitions-menu.inc' %]
-  </div>
-</div>
+  </aside>
+</div> <!-- /.col-sm-2.col-sm-pull-10 -->
+</div> <!-- /.row -->
 
 [% MACRO jsinclude BLOCK %]
     [% Asset.js("js/acquisitions-menu.js") %]
     [% INCLUDE 'datatables.inc' %]
     [% INCLUDE 'calendar.inc' %]
-    <script type="text/javascript">
+    <script>
         $(document).ready(function() {
             $(".delete_invoice").click(function(){
                 return confirmDelete(_("Are you sure you want to delete this invoice?"));

koha-tmpl/intranet-tmpl/prog/en/modules/acqui/lateorders.tt

@@ -15,12 +15,11 @@
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/acqui/acqui-home.pl">Acquisitions</a> &rsaquo; <a href="lateorders.pl">Late orders</a></div>
 
-<div id="doc3" class="yui-t2">
-   
-   <div id="bd">
-	<div id="yui-main">
-	<div class="yui-b">
-	
+<div class="main container-fluid">
+    <div class="row">
+        <div class="col-sm-10 col-sm-push-2">
+            <main>
+
 <h1>[% IF ( Supplier ) %][% Supplier %] : [% END %]Late orders</h1>
 <div id="acqui_lateorders">
 
@@ -154,10 +153,12 @@
 </form>
 [% ELSE %]<p>There are no late orders.</p>
 [% END %]
-</div>
-</div>
-</div>
-<div class="yui-b">
+</div> <!-- /#acqui_lateorders -->
+</main>
+</div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+<div class="col-sm-2 col-sm-pull-10">
+    <aside>
 <form action="lateorders.pl" method="get">
 <fieldset class="brief">
 <h4>Filter results:</h4>
@@ -188,7 +189,8 @@
 </fieldset>
     </form>
 [% INCLUDE 'acquisitions-menu.inc' %]
-</div>
+</aside>
+</div> <!-- /.col-sm-2.col-sm-pull-10 -->
 </div>
 
 [% MACRO jsinclude BLOCK %]
@@ -197,7 +199,7 @@
     [% INCLUDE 'columns_settings.inc' %]
     [% Asset.js("lib/jquery/plugins/jquery.checkboxes.min.js") %]
     [% INCLUDE 'calendar.inc' %]
-    <script type="text/javascript">
+    <script>
         var late_orderst;
         function check_uncheck() {
             var all_nodes = $(late_orderst.fnGetNodes());