Attachment 85666 Details for Bug 22399 – Bug 22399: Improve responsive behavior of the basic marc editor

[patch] Bug 22399: Improve responsive behavior of the basic marc editor

Bug-22399-Improve-responsive-behavior-of-the-basic.patch (text/plain), 9.49 KB, created by Katrin Fischer on 2019-02-25 18:50:29 UTC

(hide)

Description:

Filename:

MIME Type:

Creator: Katrin Fischer

Created: 2019-02-25 18:50:29 UTC

Size: 9.49 KB

patch

obsolete

>From 0642504d3413ad5aae950bc434c2bac8b1493895 Mon Sep 17 00:00:00 2001
>From: Owen Leonard <oleonard@myacpl.org>
>Date: Fri, 22 Feb 2019 17:29:36 +0000
>Subject: [PATCH] Bug 22399: Improve responsive behavior of the basic marc
> editor
>
>This patch makes markup and style changes to the basic MARC editor in
>order to improve the page's handling of smaller browser widths. It adds
>Bootstrap grid markup to the form to help accomplish this.
>
>To test, apply the patch and load a record for editing in the basic MARC
>editor. Adjust your browser width and confirm that the form adjusts well
>to various widths.
>
>Signed-off-by: Josef Moravec <josef.moravec@gmail.com>
>
>Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
>---
> koha-tmpl/intranet-tmpl/prog/css/addbiblio.css     | 48 ++++------------------
> .../prog/en/modules/cataloguing/addbiblio.tt       | 38 ++++++++++-------
> 2 files changed, 30 insertions(+), 56 deletions(-)
>
>diff --git a/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css b/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css
>index 03dd04bb8f..15169afdb4 100644
>--- a/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css
>+++ b/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css
>@@ -40,24 +40,21 @@ a.expandfield {
> 
> .tag {
>     border-bottom: 2px solid #D5E6E9;
>-    clear: both;
>     padding: .7em 0;
> }
> 
>+.tag .row {
>+    margin-left: 0;
>+    margin-right: 0;
>+}
>+
> div.subfield_line {
>     padding-bottom: .3em;
>-    float: left;
>-    clear: left;
>-    width: 100%;
> }
> 
> div.subfield_line label {
>     font-size:89%;
>-    float: left;
>-	 padding-right : .4em;
>-    width: 16em;
>     text-align: left;
>-    clear:left;
> }
> 
> .subfieldcode img {
>@@ -86,23 +83,12 @@ a.tagnum {
> 
> .subfield {
> 	color : #00698a;
>-	float: left;
>-	width: 10em;
> 	text-align:right;
> }
> 
>-.subfieldcode {
>-	display: block;
>-	float: left;
>-}
>-
>-.labelsubfield {
>-	float:left;
>-}
>-
> .input_marceditor {
>-	float:left;
>-	width:30em;
>+    float:left;
>+    width: 70%;
> }
> 
> .indicator {
>@@ -263,29 +249,9 @@ tbody tr.active td {
> }
> 
> @media (min-width: 768px) {
>-    div.subfield_line label {
>-        width: 20em;
>-    }
> 
>-    .input_marceditor {
>-        width: 50em;
>-    }
>-
>-    .subfield {
>-        width: 14em;
>-    }
> }
> 
> @media (min-width: 1200px) {
>-    div.subfield_line label {
>-        width: 25em;
>-    }
>-
>-    .input_marceditor {
>-        width: 60em;
>-    }
> 
>-    .subfield {
>-        width: 16em;
>-    }
> }
>diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt
>index b62328dd43..4ce6d61106 100644
>--- a/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt
>+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt
>@@ -422,7 +422,9 @@ function Changefwk() {
> [% INCLUDE 'select2.inc' %]
> <script>
>   $(document).ready(function() {
>-    $('.subfield_line select').select2();
>+    $('.subfield_line select').select2({
>+        width: "70%"
>+    });
>   });
> </script>
> 
>@@ -630,8 +632,9 @@ function Changefwk() {
>     [% END %]
>     [% FOREACH innerloo IN BIG_LOO.innerloop %]
>     [% IF ( innerloo.tag ) %]
>-    <div class="tag clearfix" id="tag_[% innerloo.tag | html %]_[% innerloo.index | html %][% innerloo.random | html %]">
>-        <div class="tag_title" id="div_indicator_tag_[% innerloo.tag | html %]_[% innerloo.index | html %][% innerloo.random | html %]">
>+    <div class="tag" id="tag_[% innerloo.tag | html %]_[% innerloo.index | html %][% innerloo.random | html %]">
>+        <div class="row">
>+        <div class="tag_title col-sm-12" id="div_indicator_tag_[% innerloo.tag | html %]_[% innerloo.index | html %][% innerloo.random | html %]">
>             [% IF advancedMARCEditor %]
>                 <a href="#" tabindex="1" class="tagnum" title="[% innerloo.tag_lib | html %] - Click to Expand this Tag" onclick="ExpandField('tag_[% innerloo.tag | html %]_[% innerloo.index | html %][% innerloo.random | html %]'); return false;">[% innerloo.tag | html %]</a>
>             [% ELSE %]
>@@ -686,18 +689,22 @@ function Changefwk() {
>                     </a>
>                 </span>
> 
>-        </div>
>-
>+        </div> 
>+        </div> 
>         [% FOREACH subfield_loo IN innerloo.subfield_loop %]
>             
>+            <div class="row">
>             <div class="subfield_line" style="[% subfield_loo.visibility | html %]" id="subfield[% subfield_loo.tag | html %][% subfield_loo.subfield | html %][% subfield_loo.random | html %]">
> 
>-                [% UNLESS advancedMARCEditor %]
>+                <div class="col-sm-4">
>+                [% UNLESS advasmedMARCEditor %]
>                     [% IF ( subfield_loo.fixedfield ) %]<label for="tag_[% subfield_loo.tag | html %]_subfield_[% subfield_loo.subfield | html %]_[% subfield_loo.index | html %]_[% subfield_loo.index_subfield | html %]" style="display:none;" class="labelsubfield">
>                     [% ELSE %]<label for="tag_[% subfield_loo.tag | html %]_subfield_[% subfield_loo.subfield | html %]_[% subfield_loo.index | html %]_[% subfield_loo.index_subfield | html %]" class="labelsubfield">
>                     [% END %]
>                 [% END %]
> 
>+                    </label>
>+
>                 <span class="subfieldcode">
>                     [% IF ( subfield_loo.fixedfield ) %]
>                         <img class="buttonUp" style="display:none;" src="[% interface | html %]/[% theme | html %]/img/up.png" onclick="upSubfield('subfield[% subfield_loo.tag | html %][% subfield_loo.subfield | html %][% subfield_loo.random | html %]')" alt="Move Up" title="Move Up" />
>@@ -720,21 +727,21 @@ function Changefwk() {
>                         [% subfield_loo.marc_lib | $raw %]
>                         [% IF ( subfield_loo.mandatory ) %]<span class="mandatory_marker" title="This field is mandatory">*</span>[% END %]
>                     </span>
>-                    </label>
>                 [% END %]
>-                
>+                </div> 
>+                <div class="col-sm-8">
>                 [% SET mv = subfield_loo.marc_value %]
>                 [% IF ( mv.type == 'text' ) %]
>                     [% IF ( mv.readonly == 1 ) %]
>-                    <input type="text" id="[%- mv.id | html -%]" name="[%- mv.name | html -%]" value="[%- mv.value | html -%]" class="input_marceditor readonly" tabindex="1" size="[%- mv.size | html -%]" maxlength="[%- mv.maxlength | html -%]" readonly="readonly" />
>+                    <input type="text" id="[%- mv.id | html -%]" name="[%- mv.name | html -%]" value="[%- mv.value | html -%]" class="input_marceditor readonly" tabindex="1" maxlength="[%- mv.maxlength | html -%]" readonly="readonly" />
>                     [% ELSE %]
>-                    <input type="text" id="[%- mv.id | html -%]" name="[%- mv.name | html -%]" value="[%- mv.value | html -%]" class="input_marceditor" tabindex="1" size="[%- mv.size | html -%]" maxlength="[%- mv.maxlength | html -%]" />
>+                    <input type="text" id="[%- mv.id | html -%]" name="[%- mv.name | html -%]" value="[%- mv.value | html -%]" class="input_marceditor" tabindex="1" maxlength="[%- mv.maxlength | html -%]" />
>                     [% END %]
>                     [% IF ( mv.authtype ) %]
>                     <span class="subfield_controls"><a href="#" class="buttonDot tag_editor" onclick="openAuth(this.parentNode.parentNode.getElementsByTagName('input')[1].id,'[%- mv.authtype | html -%]','biblio'); return false;" tabindex="1" title="Tag editor">Tag editor</a></span>
>                     [% END %]
>                 [% ELSIF ( mv.type == 'text_complex' ) %]
>-                    <input type="text" id="[%- mv.id | html -%]" name="[%- mv.name | html -%]" value="[%- mv.value | html -%]" class="input_marceditor framework_plugin" tabindex="1" size="[%- mv.size | html -%]" maxlength="[%- mv.maxlength | html -%]" />
>+                    <input type="text" id="[%- mv.id | html -%]" name="[%- mv.name | html -%]" value="[%- mv.value | html -%]" class="input_marceditor framework_plugin" tabindex="1" maxlength="[%- mv.maxlength | html -%]" />
>                     <span class="subfield_controls">
>                         [% IF mv.noclick %]
>                             <a href="#" class="buttonDot tag_editor disabled" tabindex="-1" title="No popup"></a>
>@@ -744,7 +751,7 @@ function Changefwk() {
>                     </span>
>                     [% mv.javascript | $raw %]
>                 [% ELSIF ( mv.type == 'hidden' ) %]
>-                    <input tabindex="1" type="hidden" id="[%- mv.id | html -%]" name="[%- mv.name | html -%]" size="[%- mv.size | html -%]" maxlength="[%- mv.maxlength | html -%]" value="[%- mv.value | html -%]" />
>+                    <input tabindex="1" type="hidden" id="[%- mv.id | html -%]" name="[%- mv.name | html -%]" maxlength="[%- mv.maxlength | html -%]" value="[%- mv.value | html -%]" />
>                 [% ELSIF ( mv.type == 'textarea' ) %]
>                     <textarea cols="70" rows="4" id="[%- mv.id | html -%]" name="[%- mv.name | html -%]" class="input_marceditor" tabindex="1">[%- mv.value | html -%]</textarea>
>                 [% ELSIF ( mv.type == 'select' ) %]
>@@ -769,12 +776,13 @@ function Changefwk() {
>                     </a>
>                 [% END %]
>                 </span>
>-                
>-            </div>
>+                </div> 
>+            </div> 
>+            </div> 
>             
>         [% END %]
> 
>-    </div>
>+    </div> 
>     [% END %]
>     [% END %]
>     </div>
>-- 
>2.11.0

Actions: View | Diff | Splinter Review

Attachments on bug 22399: 85569 | 85570 | 85572 | 85621 | 85666 | 106877 | 106878 | 109855 | 112045 | 112390 | 112446