From 87a4bfd852fa25e2e4dc2d947bf5835f398fadf6 Mon Sep 17 00:00:00 2001 From: Owen Leonard 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 --- .../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 @@
  • - [% IF filters.search_children_too %] - - [% ELSE %] - - [% END %] - +
  • @@ -77,12 +79,14 @@ [% END %] - [% IF filters.is_standing %] - - [% ELSE %] - - [% END %] - +
  • -- 2.30.2