Bug 21434: Update two-column templates with Bootstrap grid: Tools part 2
authorOwen Leonard <oleonard@myacpl.org>
Thu, 3 May 2018 16:48:34 +0000 (16:48 +0000)
committerNick Clemens <nick@bywatersolutions.com>
Sat, 27 Oct 2018 14:20:58 +0000 (14:20 +0000)
This patch modifies several tools templates to use the
Bootstrap grid instead of YUI.

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

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

 - Tools -> Export data
 - Tools -> Calendar
 - Tools -> Import patrons
 - Tools -> Inventory
 - Tools -> Staged MARC management
   - View batches and batch details

Signed-off-by: Claire Gravely <claire.gravely@bsz-bw.de>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Nick Clemens <nick@bywatersolutions.com>
koha-tmpl/intranet-tmpl/prog/en/modules/tools/export.tt
koha-tmpl/intranet-tmpl/prog/en/modules/tools/holidays.tt
koha-tmpl/intranet-tmpl/prog/en/modules/tools/import_borrowers.tt
koha-tmpl/intranet-tmpl/prog/en/modules/tools/inventory.tt
koha-tmpl/intranet-tmpl/prog/en/modules/tools/manage-marc-import.tt

index 5878d40..5df6fb1 100644 (file)
@@ -5,7 +5,7 @@
 [% INCLUDE 'doc-head-open.inc' %]
 <title>Koha &rsaquo; Tools &rsaquo; Export data</title>
 [% INCLUDE 'doc-head-close.inc' %]
-<style type="text/css">
+<style>
     fieldset.rows fieldset.rows {
         width: 90%;
     }
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a> &rsaquo; Export data</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>
 
 [% FOR m IN messages %]
     <div class="dialog [% m.type | html %]">
 
 </div>
 
-</div>
-</div>
-<div class="yui-b noprint">
-[% INCLUDE 'tools-menu.inc' %]
-</div>
-</div>
+            </main>
+        </div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+        <div class="col-sm-2 col-sm-pull-10">
+            <aside>
+                [% INCLUDE 'tools-menu.inc' %]
+            </aside>
+        </div> <!-- .col-sm-2.col-sm-pull-10 -->
+     </div> <!-- /.row -->
 
 [% MACRO jsinclude BLOCK %]
     [% Asset.js("js/tools-menu.js") | $raw %]
     [% INCLUDE 'calendar.inc' %]
-    <script type="text/javascript">
+    <script>
         $(document).ready(function() {
             $('#exporttype').tabs();
 
index 9e57bd5..4ad136e 100644 (file)
@@ -6,7 +6,7 @@
 <title>Koha &rsaquo; Tools &rsaquo; [% Branches.GetName( branch ) | html %] calendar</title>
 [% INCLUDE 'doc-head-close.inc' %]
 [% Asset.css("css/datatables.css") | $raw %]
-<style type="text/css"> .key { padding : 3px; white-space:nowrap; line-height:230%; }
+<style> .key { padding : 3px; white-space:nowrap; line-height:230%; }
 .ui-datepicker { font-size : 150%; }
 .ui-datepicker th, .ui-datepicker .ui-datepicker-title select { font-size : 80%; }
 .ui-datepicker td a { padding : .5em; }
@@ -23,7 +23,7 @@ td.repeatableweekly a.ui-state-default {  background:  #FFFF99 none; color :  Bl
 td.repeatableyearly a.ui-state-default {  background:  #FFCC66 none; color :  Black;  border : 1px solid #BCBCBC; }
 .information { z-index : 1; background-color :  #DCD2F1; width : 300px; display : none; border : 1px solid #000000; color :  #000000; font-size :  8pt; font-weight :  bold; background-color :  #FFD700; cursor :  pointer; padding : 2px; }
 .panel { z-index : 1; display : none; border : 3px solid #CCC; padding : 3px; margin-top: .3em;  background-color: #FEFEFE; } fieldset.brief { border : 0; margin-top: 0; }
-#showHoliday { margin : .5em 0; } h1 select { width: 20em; } div.yui-b fieldset.brief ol { font-size:100%; } div.yui-b fieldset.brief li, div.yui-b fieldset.brief li.radio  { padding:0.2em 0; } .help { margin:.3em 0;border:1px solid #EEE;padding:.3em .7em; font-size : 90%; } #holidayweeklyrepeatable, #holidaysyearlyrepeatable, #holidaysunique, #holidayexceptions { font-size : 90%; margin-bottom : 1em;} .calendar td, .calendar th, .calendar .button, .calendar tbody .day { padding : .7em; font-size: 110%; } .calendar { width: auto; border : 0; }
+#showHoliday { margin : .5em 0; } h1 select { width: 20em; } fieldset.brief ol { font-size:100%; } fieldset.brief li, fieldset.brief li.radio  { padding:0.2em 0; } .help { margin:.3em 0;border:1px solid #EEE;padding:.3em .7em; font-size : 90%; } #holidayweeklyrepeatable, #holidaysyearlyrepeatable, #holidaysunique, #holidayexceptions { font-size : 90%; margin-bottom : 1em;} .calendar td, .calendar th, .calendar .button, .calendar tbody .day { padding : .7em; font-size: 110%; } .calendar { width: auto; border : 0; }
 </style>
 </head>
 <body id="tools_holidays" class="tools">
@@ -32,14 +32,15 @@ td.repeatableyearly a.ui-state-default {  background:  #FFCC66 none; color :  Bl
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a> &rsaquo; [% Branches.GetName( branch ) | html %] calendar</div>
 
-<div id="doc3" class="yui-t1">
-   
-   <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>[% Branches.GetName( branch ) | html %] calendar</h2>
-    <div class="yui-g">
-    <div class="yui-u first">
+
+    <div class="row">
+    <div class="col-sm-6">
         <label for="branch">Define the holidays for:</label>
             <select id="branch" name="branch">
                 [% PROCESS options_for_libraries libraries => Branches.all( selected => branch ) %]
@@ -215,7 +216,7 @@ td.repeatableyearly a.ui-state-default {  background:  #FFCC66 none; color :  Bl
 </div>
 
 </div>
-<div class="yui-u">
+<div class="col-sm-6">
 <div class="help">
 <h4>Hints</h4>
     <ul>
@@ -331,19 +332,22 @@ td.repeatableyearly a.ui-state-default {  background:  #FFCC66 none; color :  Bl
 </div>
 </div>
 </div>
-</div>
-</div>
 
-<div class="yui-b noprint">
-[% INCLUDE 'tools-menu.inc' %]
-</div>
-</div>
+            </main>
+        </div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+        <div class="col-sm-2 col-sm-pull-10">
+            <aside>
+                [% INCLUDE 'tools-menu.inc' %]
+            </aside>
+        </div> <!-- .col-sm-2.col-sm-pull-10 -->
+     </div> <!-- /.row -->
 
 [% MACRO jsinclude BLOCK %]
     [% INCLUDE 'calendar.inc' %]
     [% INCLUDE 'datatables.inc' %]
     [% Asset.js("js/tools-menu.js") | $raw %]
-    <script type="text/javascript">
+    <script>
         var weekdays = new Array(_("Sundays"),_("Mondays"),_("Tuesdays"),_("Wednesdays"),_("Thursdays"),_("Fridays"),_("Saturdays"));
 
         /* Creates all the structures to deal with all different kinds of holidays */
index 8165027..1ced2d5 100644 (file)
@@ -6,7 +6,7 @@
 [% INCLUDE 'doc-head-open.inc' %]
 <title>Koha &rsaquo; Tools &rsaquo; Import patrons [% IF ( uploadborrowers ) %]&rsaquo; Results[% END %]</title>
 [% INCLUDE 'doc-head-close.inc' %]
-<style type="text/css">
+<style>
     .yui-u fieldset.rows .widelabel { width: 12em; }
     label.description { width: 20em; }
     .line_error { width: 100%; }
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a> &rsaquo; <a href="/cgi-bin/koha/tools/import_borrowers.pl">Import patrons</a>[% IF ( uploadborrowers ) %] &rsaquo; Results[% END %]</div>
 
-<div id="doc3" class="yui-t2">
- <div id="bd">
-  <div id="yui-main">
-   <div class="yui-b">
-    <div class="yui-g">
-     <div class="yui-u first">
+<div class="main container-fluid">
+    <div class="row">
+        <div class="col-sm-10 col-sm-push-2">
+            <main>
+
+    <div class="row">
+     <div class="col-sm-6">
 <h1>Import patrons</h1>
 [% IF ( uploadborrowers ) %]
     <h5>Import results :</h5>
 
 </div>
 
-<div class="yui-u">
+<div class="col-sm-6">
     <h2>Notes:</h2>
     <ul>
         <li>The first line in the file must be a header row defining which columns you are supplying in the import file.</li>
@@ -281,20 +282,23 @@ you can supply dates in ISO format (e.g., '2010-10-28').
     </ul>
 </div>
 </div>
-</div>
-</div>
 
-<div class="yui-b noprint">
-    [% INCLUDE 'tools-menu.inc' %]
-</div>
-</div>
+            </main>
+        </div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+        <div class="col-sm-2 col-sm-pull-10">
+            <aside>
+                [% INCLUDE 'tools-menu.inc' %]
+            </aside>
+        </div> <!-- .col-sm-2.col-sm-pull-10 -->
+     </div> <!-- /.row -->
 
 [% MACRO jsinclude BLOCK %]
     [% INCLUDE 'calendar.inc' %]
     [% Asset.js("js/tools-menu.js") | $raw %]
     [% INCLUDE 'str/members-menu.inc' %]
     [% Asset.js("js/members-menu.js") | $raw %]
-    <script type="text/javascript">
+    <script>
         $(document).ready(function() {
             [%# Make date fields have the datepicker %]
             $("#dateenrolled, #dateexpiry, #dateofbirth").datepicker();
index 6ec9579..a8a6863 100644 (file)
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a> &rsaquo; [% IF (loop) %]<a href="/cgi-bin/koha/tools/inventory.pl">Inventory</a> &rsaquo; Results[% ELSE %]Inventory[% END %]</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>Inventory</h1>
     [% IF (moddatecount) %]<div class="dialog message">[% moddatecount | html %] items modified : datelastseen set to [% date | $KohaDates %]</div>
     <div class="dialog alert">Number of potential barcodes read: [% LinesRead | html %]</div>[% END %]
@@ -38,7 +38,7 @@
         </div>
     [% END %]
        [% UNLESS op %]
-    <div class="yui-g">
+
     <form method="post" id="inventory_form" action="/cgi-bin/koha/tools/inventory.pl" enctype="multipart/form-data">
         <fieldset class="rows">
           <legend>Use a barcode file</legend>
 
             <fieldset class="action"><input type="submit" value="Submit" class="button" /></fieldset>
     </form>
-    </div>
-    </div>
+
     [% END %]
     [% IF (op) %]
     <form method="post" action="/cgi-bin/koha/tools/inventory.pl" class="checkboxed">
     [% END %]
     </form>
 
-    </div>
 
     [% END %]
-</div>
-<div class="yui-b">
-[% INCLUDE 'tools-menu.inc' %]
-</div>
-</div>
+
+            </main>
+        </div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+        <div class="col-sm-2 col-sm-pull-10">
+            <aside>
+                [% INCLUDE 'tools-menu.inc' %]
+            </aside>
+        </div> <!-- .col-sm-2.col-sm-pull-10 -->
+     </div> <!-- /.row -->
 
 [% MACRO jsinclude BLOCK %]
     [% Asset.js("js/tools-menu.js") | $raw %]
index f98a35e..3f6184b 100644 (file)
@@ -9,7 +9,7 @@
 </title>
 [% INCLUDE 'doc-head-close.inc' %]
 [% Asset.css("css/datatables.css") | $raw %]
-<style type="text/css">
+<style>
     #jobpanel,#jobstatus,#jobfailed { display : none; }
     span.change-status { font-style:italic; color:#666; display:none; }
 </style>
 [% 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>
 
 <h1>Manage staged MARC records
 [% IF ( import_batch_id ) %]
     </div>
 [% END %]
 
-</div>
-</div>
-<div class="yui-b">
-[% INCLUDE 'tools-menu.inc' %]
-</div>
-</div>
+            </main>
+        </div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+        <div class="col-sm-2 col-sm-pull-10">
+            <aside>
+                [% INCLUDE 'tools-menu.inc' %]
+            </aside>
+        </div> <!-- .col-sm-2.col-sm-pull-10 -->
+     </div> <!-- /.row -->
 
 [% MACRO jsinclude BLOCK %]
     [% Asset.js("js/tools-menu.js") | $raw %]
-[% Asset.js("js/background-job-progressbar.js") | $raw %]
+    [% Asset.js("js/background-job-progressbar.js") | $raw %]
     [% INCLUDE 'datatables.inc' %]
-    <script type="text/javascript">
+    <script>
         $(document).ready(function(){
             $("#staged-record-matching-rules select").change(function(){
                 var str = $(this).attr("id");