Bugzilla – Attachment 142684 Details for
Bug 31991
Restore style of sidebar forms
Home
|
New
|
Browse
|
Search
|
[?]
|
Reports
|
Help
|
New Account
|
Log In
[x]
|
Forgot Password
Login:
[x]
[patch]
Bug 31991: Restore style of sidebar forms
Bug-31991-Restore-style-of-sidebar-forms.patch (text/plain), 9.62 KB, created by
David Nind
on 2022-10-26 20:30:13 UTC
(
hide
)
Description:
Bug 31991: Restore style of sidebar forms
Filename:
MIME Type:
Creator:
David Nind
Created:
2022-10-26 20:30:13 UTC
Size:
9.62 KB
patch
obsolete
>From c040ac290e82513be31e9e86512f183facfbee39 Mon Sep 17 00:00:00 2001 >From: Owen Leonard <oleonard@myacpl.org> >Date: Wed, 26 Oct 2022 14:17:23 +0000 >Subject: [PATCH] Bug 31991: Restore style of sidebar forms > >This patch restores the aside{} section of staff-global.scss from before >the staff redesign and makes some tweaks to make it consisten with the >redesign. The goal is to make the spacing of the form more compact but >still readable, and to correct some layout inconsistencies. > >The patch also modifies the order filter form to fix the layout of some >checkboxes. > >To test, apply the patch and rebuild the staff interface CSS. > >Test various pages with sidebar forms to confirm that the form looks >readable and usable. For example: > >- Patrons >- Acquisitions -> Invoices >- Tools -> Tags >- Serials -> Subscription search results >- Overdues >- Holds to pull > >Signed-off-by: David Nind <david@davidnind.com> >--- > .../prog/css/src/staff-global.scss | 189 ++++++------------ > .../prog/en/includes/filter-orders.inc | 28 +-- > 2 files changed, 75 insertions(+), 142 deletions(-) > >diff --git a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss >index 19596681bf..97666a18da 100644 >--- a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss >+++ b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss >@@ -196,110 +196,52 @@ a { > > > aside { >- fieldset { >- @include card; >- padding: .9em; >- >- button + button, >- input + input { >- margin-left: 5px; >- } >+ h5 { >+ font-size: 100%; >+ margin: .5em 0; >+ } > >- fieldset.brief { >- width: 100%; >+ fieldset { >+ &.brief { >+ padding: .4em .7em; > >- legend { >- color: #696969; >- font-weight: bold; >- font-size: 13px; >- margin: 0; >- border-bottom: 0; >+ button + button, >+ input + input { >+ margin-left: 5px; > } > >- li { >- margin-top: 0; >- padding: 0; >+ fieldset { >+ border-left: 2px solid #CCC; >+ border-radius: 0; >+ margin: .5em 0; >+ padding: .5em; > >- &.radio { >- padding: 0; >- } >- >- label { >- color: #696969; >- font-size: 13px; >- padding: .5em .3em 0 0; >+ legend { >+ font-size: 95%; > margin: 0; >- font-weight: normal; > } > >- input, select { >- height: calc(1.5em + .75rem + 2px); >- width: calc(100% - 20px); >+ &.action { >+ border: 0; >+ margin-left: 0; >+ padding: .5em 0; > } > } >- } >- >- ol { >- padding: 0; >- li { >- list-style: none; >- left: 0; >- flex-direction: row; >- width: 100%; >- >- fieldset { >- width: 100%; >- >- legend { >- color: #696969; >- font-weight: bold; >- font-size: 13px; >- margin: 0; >- border-bottom: 0; >- } >- >- li { >- margin-top: 0; >- padding: 0; >- >- label { >- color: #696969; >- font-size: 13px; >- padding: .5em .3em 0 0; >- margin: 0; >- font-weight: normal; >- } >- >- input, >- select { >- height: calc(1.5em + .75rem + 2px); >- width: calc(100% - 20px); >- } >- } >- >- } >- >- label { >- color: #696969; >- padding: .5em .3em 0 0; >- margin: 0; >- } >- >- input, >- select { >- height: calc(1.5em + .75rem + 2px); >- width: calc(100% - 20px); >- > >- &[type="checkbox"], >- &[type="radio"] { >- width: auto; >- margin: 0; >- vertical-align: middle; >- } >- } >+ input[type="text"], >+ select { >+ height: calc(1.5em + .75rem + 2px); >+ } > >+ label { >+ color: #696969; >+ display: block; >+ margin: .5em 0 0 0; >+ } > >+ li { >+ margin-top: 0; >+ padding: 0; > > &.checkbox { > label { >@@ -321,6 +263,8 @@ aside { > } > > &.radio { >+ padding: .7em 0; >+ > input { > padding: .3em 0; > } >@@ -334,41 +278,27 @@ aside { > display: inline; > } > } >+ } >+ } > >- select, >- [type="text"] { >- width: 100%; >- } >- >- .flatpickr-input { >- margin-right: 3px; >- width: calc(100% - 20px); >- } >- >- &+.action { >- margin-left: 0; >- padding: 0; >- } >- >- .radio, .checkbox { >- margin: 0; >- } >+ ol { >+ margin: 0; >+ padding: 0; >+ } > >- select, >- [type="text"] { >- width: 100%; >- } >+ select, >+ [type="text"] { >+ width: 100%; >+ } > >- .flatpickr-input { >- margin-right: 3px; >- width: calc(100% - 20px); >- } >+ .flatpickr-input { >+ margin-right: 3px; >+ width: calc(100% - 20px); >+ } > >- &.action { >- margin-left: 0; >- padding: 0; >- } >- } >+ &+.action { >+ margin-left: 0; >+ padding: 0; > } > } > } >@@ -638,12 +568,6 @@ textarea { > } > > input { >- &[type="checkbox"], >- &[type="radio"] { >- margin: 0; >- vertical-align: middle; >- } >- > &[type="submit"], > &[type="reset"], > &[type="button"] { >@@ -654,6 +578,13 @@ input { > } > } > >+ &[type="checkbox"], >+ &[type="radio"] { >+ height: unset; >+ margin: 0; >+ vertical-align: middle; >+ } >+ > &.submit { > @include default-button; > >@@ -689,8 +620,6 @@ label, > white-space: normal; > > input { >- &[type="checkbox"], >- &[type="radio"], > &[type="checkbox"], > &[type="radio"] { > margin-top: 0; >diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/filter-orders.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/filter-orders.inc >index e6451add24..f23c42fbea 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/includes/filter-orders.inc >+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/filter-orders.inc >@@ -35,12 +35,14 @@ > <li> > <label for="ordernumber">Order line:</label> > <input type="text" name="ordernumber" id="ordernumber" value="[% filters.ordernumber | html %]" /> >- [% IF filters.search_children_too %] >- <input type="checkbox" name="search_children_too" id="search_children_too" value="1" checked="checked" /> >- [% ELSE %] >- <input type="checkbox" name="search_children_too" id="search_children_too" value="1" /> >- [% END %] >- <label class="yesno" for="search_children_too">Display children too.</label> >+ <label class="yesno" for="search_children_too"> >+ [% IF filters.search_children_too %] >+ <input type="checkbox" name="search_children_too" id="search_children_too" value="1" checked="checked" /> >+ [% ELSE %] >+ <input type="checkbox" name="search_children_too" id="search_children_too" value="1" /> >+ [% END %] >+ Display children too >+ </label> > </li> > > <li> >@@ -77,12 +79,14 @@ > <option value="cancelled">Cancelled</option> > [% END %] > </select> >- [% IF filters.is_standing %] >- <input type="checkbox" name="is_standing" id="is_standing" value="1" checked="checked" /> >- [% ELSE %] >- <input type="checkbox" name="is_standing" id="is_standing" value="1" /> >- [% END %] >- <label class="yesno" for="search_children_too">Standing order</label> >+ <label class="yesno" for="search_children_too"> >+ [% IF filters.is_standing %] >+ <input type="checkbox" name="is_standing" id="is_standing" value="1" checked="checked" /> >+ [% ELSE %] >+ <input type="checkbox" name="is_standing" id="is_standing" value="1" /> >+ [% END %] >+ Standing order >+ </label> > </li> > <li> > <label for="fund">Fund: </label> >-- >2.30.2
You cannot view the attachment while viewing its details because your browser does not support IFRAMEs.
View the attachment on a separate page
.
View Attachment As Diff
View Attachment As Raw
Actions:
View
|
Diff
|
Splinter Review
Attachments on
bug 31991
:
142673
|
142684
|
142685
|
142686