Attachment 153926 Details for Bug 34392 – Bug 34392: Run automated Stylelint fixes on staff CSS

[patch] Bug 34392: Run automated Stylelint fixes on staff CSS

Bug-34392-Run-automated-Stylelint-fixes-on-staff-C.patch (text/plain), 50.29 KB, created by Owen Leonard on 2023-07-26 14:37:45 UTC

(hide)

Description:

Filename:

MIME Type:

Creator: Owen Leonard

Created: 2023-07-26 14:37:45 UTC

Size: 50.29 KB

patch

obsolete

>From e897a13c10655273f90b0dc64f0b8ad10301d07d Mon Sep 17 00:00:00 2001
>From: Owen Leonard <oleonard@myacpl.org>
>Date: Tue, 25 Jul 2023 18:29:49 +0000
>Subject: [PATCH] Bug 34392: Run automated Stylelint fixes on staff CSS
>
>This patch corrects errors raised by the new stylelint configuration in
>staff-global.scss. Many of the fixes were made automatically by using
>the "--fix" option:
>
>npx stylelint koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss --fix
>
>Some examples of errors found:
>
>    - Expected single space after ":"
>    - Expected single space after "("
>    - Expected single space before ")"
>    - Expected empty line before comment
>    - Expected no more than 1 empty line
>    - Expected a trailing semicolon
>
>Manual fixes include replacing named colors with hex codes, combining
>duplicate selectors, removing empty blocks, etc.
>
>Some warnings remain: "Unexpected !important" requires more than a
>quick fix, if we should choose to address them.
>
>To test, apply the patch and rebuild the staff interface CSS:
>https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client
>
>The changes affect CSS all around the staff interface, but there should
>be no visible results of the patch. Everything should look correct.
>
>The stylelint check should return only warnings about "!important"
>
>npx stylelint koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
>---
> .../intranet-tmpl/prog/css/src/_mixins.scss   |   8 +-
> .../prog/css/src/staff-global.scss            | 995 +++++++++---------
> 2 files changed, 498 insertions(+), 505 deletions(-)
>
>diff --git a/koha-tmpl/intranet-tmpl/prog/css/src/_mixins.scss b/koha-tmpl/intranet-tmpl/prog/css/src/_mixins.scss
>index 68354bd282..663ef33cd2 100644
>--- a/koha-tmpl/intranet-tmpl/prog/css/src/_mixins.scss
>+++ b/koha-tmpl/intranet-tmpl/prog/css/src/_mixins.scss
>@@ -79,9 +79,13 @@ $nav-menu-bullet: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/s
> 
> /* Copied from Bootstrap 5 */
> @mixin clearfix() {
>+    &::after,
>+    &::before {
>+        content: " ";
>+        display: table;
>+    }
>+
>     &::after {
>         clear: both;
>-        content: "";
>-        display: block;
>     }
> }
>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 abbc4a82b7..8fba7a3f01 100644
>--- a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
>+++ b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
>@@ -43,21 +43,21 @@ a {
>     }
> 
>     &.authlink {
>-        background-color: #e3f1df;
>+        background-color: #E3F1DF;
>         border-radius: 5px;
>         display: inline-block;
>         padding: 2px 4px;
>     }
> 
>     &.edit-patronimage {
>+        background-color: #E6E6E6;
>+        border-color: #ADADAD;
>         color: #333;
>-        background-color: #e6e6e6;
>-        border-color: #adadad;
> 
>-        &:hover{
>-            text-decoration: none;
>+        &:hover {
>+            background-color: #DADADA;
>             color: #333;
>-            background-color: #dadada;
>+            text-decoration: none;
>         }
>     }
> 
>@@ -80,47 +80,52 @@ a {
>     }
> 
>     &.settings {
>-        i, img {
>-            text-align: center;
>-            color: $green-text-color;
>+        i,
>+        img {
>+            align-items: center;
>+            background-color: transparent;
>             border: solid 3px $background-color-secondary;
>             border-radius: 50%;
>-            background-color: transparent;
>-            width: 40px;
>+            box-sizing: content-box;
>+            color: $green-text-color;
>+            display: flex;
>             height: 40px;
>+            justify-content: center;
>             margin-bottom: 5px;
>             margin-left: auto;
>             margin-right: auto;
>             padding: 5px;
>-            align-items: center;
>-            justify-content: center;
>-            box-sizing: content-box;
>-            display: flex;
>-
>+            text-align: center;
>+            width: 40px;
>         }
> 
>         &:hover {
>             color: $green-text-color;
>-            text-decoration: none;
>             font-weight: bold;
>+            text-decoration: none;
> 
>-            i, img {
>-                border-color: $background-color-primary;
>+            i,
>+            img {
>                 background-color: transparent;
>+                border-color: $background-color-primary;
>                 color: $green-text-color;
>             }
>-
>         }
> 
>         img {
>-            max-width: 30px;
>             height: auto;
>+            max-width: 30px;
>             padding: 10px;
>         }
>     }
> 
>     &.csv {
>-        background-image: url("../img/famfamfam/silk/page_white_excel.png");
>+        background-image: url( "../img/famfamfam/silk/page_white_excel.png" );
>+    }
>+
>+    .ctrl_link {
>+        display: inline-block;
>+        padding-right: 1rem;
>     }
> 
>     &.dropdown-toggle {
>@@ -156,11 +161,12 @@ a {
>     }
> 
>     &.pdf {
>-        background-image: url("../img/famfamfam/silk/page_white_acrobat.png");
>+        background-image: url( "../img/famfamfam/silk/page_white_acrobat.png" );
>     }
> 
>     &.submit {
>         @include default-button;
>+
>         display: inline-block;
> 
>         &:active {
>@@ -177,24 +183,15 @@ a {
>     }
> 
>     &.xml {
>-        background-image: url("../img/famfamfam/silk/page_white_code.png");
>+        background-image: url( "../img/famfamfam/silk/page_white_code.png" );
>     }
> }
> 
>-
> #resetZ3950Search {
>-    font-size: 110%;
>     color: $green-text-color;
>+    font-size: 110%;
> }
> 
>-a {
>-    .ctrl_link {
>-        display: inline-block;
>-        padding-right: 1rem;
>-    }
>-}
>-
>-
> aside {
>     h5 {
>         font-size: 100%;
>@@ -230,7 +227,7 @@ aside {
> 
>             input[type="text"],
>             select {
>-                height: calc(1.5em + .75rem + 2px);
>+                height: calc( 1.5em + .75rem + 2px );
>             }
> 
>             label {
>@@ -293,16 +290,18 @@ aside {
> 
>             .flatpickr-input {
>                 margin-right: 3px;
>-                width: calc(100% - 20px);
>+                width: calc( 100% - 20px );
>             }
> 
>-            &+.action {
>+            & + .action {
>                 background-color: #FFF;
>                 display: flex;
>                 margin-left: 0;
>                 padding: 1rem;
> 
>-                input, button, a {
>+                input,
>+                button,
>+                a {
>                     display: block;
>                     flex-grow: 1;
>                 }
>@@ -311,17 +310,19 @@ aside {
>     }
> }
> 
>-#menu, #navmenulist, #serialmenu {
>-    background-color: #e6e6e6;
>+#menu,
>+#navmenulist,
>+#serialmenu {
>+    background-color: #E6E6E6;
>     display: block;
>     padding: 1em 0 1em 0;
> 
>     h5 {
>-        padding-left: .5em;
>         color: #666;
>-        font-weight: bold;
>         font-size: 1.3em;
>+        font-weight: bold;
>         margin-top: 0;
>+        padding-left: .5em;
>     }
> 
>     ul {
>@@ -339,21 +340,21 @@ aside {
>                 border-left: 5px solid #E6E6E6;
>                 color: #000;
>                 display: block;
>-                text-decoration: none;
>                 padding: .7em .3em .7em 1.2em;
>+                text-decoration: none;
>             }
> 
>             &.active > a,
>             a:hover,
>             a.current {
>                 background-color: #F3F4F4;
>-                text-decoration: none;
>-                color: $green-text-color;
>                 border-left: solid 5px $background-color-primary;
>+                color: $green-text-color;
>                 font-weight: bold;
>+                text-decoration: none;
>             }
> 
>-            a:hover:not(.current) {
>+            a:hover:not( .current ) {
>                 border-left: solid 5px $background-color-secondary;
>                 font-weight: normal;
>             }
>@@ -366,12 +367,10 @@ aside {
>     }
> }
> 
>-#admin_preferences #menu{
>-
>+#admin_preferences #menu {
>     ul {
>-
>         ul {
>-            background-color: #f3f4f4;
>+            background-color: #F3F4F4;
>             font-size: 85%;
>         }
>     }
>@@ -384,10 +383,9 @@ div {
>         display: inline;
>     }
> 
>-
>     &.koha-mainpage {
>-        display: flex;
>         align-items: center;
>+        display: flex;
>         justify-content: center;
>     }
> 
>@@ -398,11 +396,11 @@ div {
>             float: right;
> 
>             li {
>+                height: auto;
>                 list-style-type: none;
>                 margin-bottom: 0;
>-                height: auto;
>-                width: 150px;
>                 padding: 5px 10px;
>+                width: 150px;
> 
>                 a,
>                 a:visited,
>@@ -412,6 +410,199 @@ div {
>             }
>         }
>     }
>+
>+    &.action {
>+        background-color: transparent;
>+        border: 0;
>+        clear: both;
>+        float: none;
>+        margin: .9em 0 0;
>+        padding: .4em;
>+        width: auto;
>+    }
>+
>+    .renew_formfield {
>+        margin-bottom: 1em;
>+    }
>+
>+    .circmessage {
>+        padding: .4em;
>+
>+        .circmessage {
>+            margin-bottom: .3em;
>+        }
>+    }
>+
>+    &.first {
>+        fieldset {
>+            margin-right: 0;
>+        }
>+    }
>+
>+    &.help {
>+        margin: .9em 0 0;
>+    }
>+
>+    &.justify {
>+        text-align: justify;
>+    }
>+
>+    &.note {
>+        background-color: #CFE2FF;
>+        margin: .5em 0;
>+        padding: .5em;
>+
>+        i {
>+            &.fa-exclamation {
>+                color: $warning-text-color;
>+                font-style: italic;
>+                padding: 0 .3em;
>+            }
>+        }
>+    }
>+
>+    // Tools > automatic_item_modification_by_age
>+    &.rules {
>+        display: block;
>+    }
>+
>+    &[class$="_table_controls"] {
>+        padding: .7em 0;
>+    }
>+
>+    &.results {
>+        padding: .7em 0;
>+    }
>+
>+    &.rule {
>+        background-color: #F4F8F9;
>+        border: 2px solid #BFD9B9;
>+        border-radius: 5px;
>+        margin: .3em;
>+        padding: .3em;
>+    }
>+
>+    &.lastchecked {
>+        background-color: #FFF;
>+        border: 2px solid #BCDB89;
>+        padding: .2em 1em;
>+    }
>+
>+    &.listgroup {
>+        clear: left;
>+
>+        h4 {
>+            font-style: italic;
>+
>+            a {
>+                font-size: 80%;
>+            }
>+        }
>+    }
>+
>+    &.sysprefs {
>+        h3 {
>+            margin: .2em 0 .2em .4em;
>+        }
>+
>+        dl {
>+            margin-left: 1.5em;
>+        }
>+
>+        &.hint {
>+            float: right;
>+            margin: .7em;
>+            padding: .5em;
>+            width: 25%;
>+        }
>+    }
>+
>+    &.rows {
>+        margin: 0;
>+        padding: 0;
>+        width: 100%;
>+
>+        + div {
>+            &.rows {
>+                margin-top: .6em;
>+            }
>+        }
>+
>+        li {
>+            border-bottom: 1px solid #EEE;
>+            list-style-type: none;
>+            padding: .275em;
>+            width: 100%;
>+        }
>+
>+        ol {
>+            list-style-type: none;
>+            padding: .5em 1em 0 0;
>+
>+            li {
>+                li {
>+                    border-bottom: 0;
>+                }
>+            }
>+        }
>+
>+        p {
>+            margin-left: 10em;
>+        }
>+
>+        span {
>+            &.label {
>+                display: inline-block;
>+                font-weight: bold;
>+                margin-right: 1em;
>+                padding-top: 0;
>+                text-align: left;
>+                vertical-align: top;
>+                white-space: normal;
>+                width: 9em;
>+            }
>+        }
>+    }
>+
>+    &.pages {
>+        margin: .5em 0;
>+
>+        a {
>+            font-weight: bold;
>+            padding: 1px 5px;
>+            text-decoration: none;
>+
>+            &:link,
>+            &:visited {
>+                background-color: #EEEEEE;
>+                color: #3366CC;
>+            }
>+
>+            &:hover,
>+            &:active {
>+                background-color: #FFC;
>+            }
>+        }
>+
>+        .current,
>+        .currentPage {
>+            background-color: #E6FCB7;
>+            color: #666;
>+            font-weight: bold;
>+            padding: 1px 5px;
>+        }
>+
>+        .inactive {
>+            background-color: #F3F3F3;
>+            color: #BCBCBC;
>+            font-weight: bold;
>+            padding: 1px 5px;
>+        }
>+    }
>+
>+    .browse {
>+        margin: .5em 0;
>+    }
> }
> 
> button {
>@@ -446,12 +637,12 @@ main {
> }
> 
> body {
>+    background-color: #F3F4F4;
>     font-family: $font-family-sans-serif;
>     font-size: 13px;
>     line-height: 1.22;
>     padding: 0 0 4em;
>     text-align: left;
>-    background-color: #F3F4F4;
> 
>     &.nobackdrop {
>         .modal-backdrop {
>@@ -484,7 +675,7 @@ form {
>         }
> 
>         .notification_method,
>-        #main_contact_method    {
>+        #main_contact_method {
>             background-color: #FFE;
>             border: 1px solid #CCC;
>             border-radius: 5px;
>@@ -510,15 +701,15 @@ h1 {
> }
> 
> h2 {
>+    color: #696969;
>     font-size: 150%;
>     font-weight: bold;
>-    color: #696969;
> }
> 
> h3 {
>+    color: #696969;
>     font-size: 131%;
>     font-weight: bold;
>-    color: #696969;
> }
> 
> h4 {
>@@ -589,12 +780,14 @@ textarea {
> input {
>     &[type="submit"] {
>         @include primary-button;
>+
>         padding: .5em 1em;
>     }
> 
>     &[type="reset"],
>     &[type="button"] {
>         @include default-button;
>+
>         padding: .5em 1em;
> 
>         &:disabled {
>@@ -610,6 +803,7 @@ input {
> 
>     &.submit {
>         @include primary-button;
>+
>         padding: .5em 1em;
> 
>         &:disabled {
>@@ -672,7 +866,8 @@ label,
>     margin-top: 1em;
> }
> 
>-.main, main {
>+.main,
>+main {
>     & > .row > div > aside {
>         margin-left: -15px;
>     }
>@@ -788,11 +983,11 @@ fieldset {
>     }
> 
>     &.standard {
>-        background-color:#F4F8F9 !important;
>+        background-color: #F4F8F9 !important;
>     }
> 
>     &.contrast {
>-        background-color:#F3F3F3 !important;
>+        background-color: #F3F3F3 !important;
>     }
> 
>     &.action {
>@@ -871,7 +1066,6 @@ fieldset {
>         }
>     }
> 
>-
>     ol {
>         li {
>             list-style-type: none;
>@@ -881,14 +1075,14 @@ fieldset {
> 
>     div {
>         &.help-block {
>+            color: #737373;
>             display: block;
>-            margin-top: 5px;
>             margin-bottom: 10px;
>-            color: #737373;
>+            margin-top: 5px;
> 
>             li {
>-                list-style-type: unset;
>                 list-style-position: inside;
>+                list-style-type: unset;
>             }
>         }
>     }
>@@ -921,9 +1115,8 @@ details[open] {
>     }
> }
> 
>-
> #floating-save {
>-    background-color: rgba(185, 216, 217, .6);
>+    background-color: rgba( 185, 216, 217, .6 );
>     bottom: 3%;
>     position: fixed;
>     right: 1%;
>@@ -935,7 +1128,8 @@ details[open] {
>     justify-content: space-between;
> }
> 
>-#breadcrumbs, #shortcut {
>+#breadcrumbs,
>+#shortcut {
>     background-color: transparent;
>     clear: both;
>     margin: 0;
>@@ -950,15 +1144,15 @@ details[open] {
> 
> #breadcrumbs a[href="/cgi-bin/koha/mainpage.pl"] {
>     color: $green-text-color;
>-    visibility: hidden;
>     font-size: 1px;
>     letter-spacing: -1px;
>+    visibility: hidden;
> 
>     &::before {
>         content: "\f015";
>         font-family: "Font Awesome 6 Free";
>-        font-style: normal;
>         font-size: 12px;
>+        font-style: normal;
>         padding-right: .3em;
>         visibility: visible;
>     }
>@@ -968,208 +1162,13 @@ details[open] {
>     }
> }
> 
>-#header {
>-    + #breadcrumbs {
>-        margin-top: 1em;
>-    }
>-
>-    > .container-fluid {
>-        padding: 0;
>-    }
>-}
>-
>-div {
>-    &.action {
>-        background-color: transparent;
>-        border: 0;
>-        clear: both;
>-        float: none;
>-        margin: .9em 0 0;
>-        padding: .4em;
>-        width: auto;
>-    }
>-
>-    .renew_formfield {
>-        margin-bottom: 1em;
>-    }
>-
>-    .circmessage {
>-        padding: .4em;
>-
>-        .circmessage {
>-            margin-bottom: .3em;
>-        }
>-    }
>-
>-    &.first {
>-        fieldset {
>-            margin-right: 0;
>-        }
>-    }
>-
>-    &.help {
>-        margin: .9em 0 0;
>-    }
>-
>-    &.justify {
>-        text-align: justify;
>-    }
>-
>-    &.note {
>-        background-color: #CFE2FF;
>-        margin: .5em 0;
>-        padding: .5em;
>-
>-        i {
>-            &.fa-exclamation {
>-                color: $warning-text-color;
>-                font-style: italic;
>-                padding: 0 .3em;
>-            }
>-        }
>-    }
>-
>-    // Tools > automatic_item_modification_by_age
>-    &.rules {
>-        display: block;
>-    }
>-
>-    &[class$="_table_controls"] {
>-        padding: .7em 0;
>-    }
>-
>-    &.results {
>-        padding: .7em 0;
>-    }
>-
>-    &.rule {
>-        background-color: #F4F8F9;
>-        border: 2px solid #bfd9b9;
>-        border-radius: 5px;
>-        margin: .3em;
>-        padding: .3em;
>-    }
>-
>-    &.lastchecked {
>-        background-color: #FFF;
>-        border: 2px solid #BCDB89;
>-        padding: .2em 1em;
>-    }
>-
>-    &.listgroup {
>-        clear: left;
>-
>-        h4 {
>-            font-style: italic;
>-
>-            a {
>-                font-size: 80%;
>-            }
>-        }
>-    }
>-
>-    &.sysprefs {
>-        h3 {
>-            margin: .2em 0 .2em .4em;
>-        }
>-
>-        dl {
>-            margin-left: 1.5em;
>-        }
>-
>-        &.hint {
>-            float: right;
>-            margin: .7em;
>-            padding: .5em;
>-            width: 25%;
>-        }
>-    }
>-
>-    &.rows {
>-        margin: 0;
>-        padding: 0;
>-        width: 100%;
>-
>-        + div {
>-            &.rows {
>-                margin-top: .6em;
>-            }
>-        }
>-
>-        li {
>-            border-bottom: 1px solid #EEE;
>-            list-style-type: none;
>-            padding: .275em;
>-            width: 100%;
>-        }
>-
>-        ol {
>-            list-style-type: none;
>-            padding: .5em 1em 0 0;
>-
>-            li {
>-                li {
>-                    border-bottom: 0;
>-                }
>-            }
>-        }
>-
>-        p {
>-            margin-left: 10em;
>-        }
>-
>-        span {
>-            &.label {
>-                display: inline-block;
>-                font-weight: bold;
>-                margin-right: 1em;
>-                padding-top: 0;
>-                text-align: left;
>-                vertical-align: top;
>-                width: 9em;
>-                white-space: normal;
>-            }
>-        }
>-    }
>-
>-    &.pages {
>-        margin: .5em 0;
>-
>-        a {
>-            font-weight: bold;
>-            padding: 1px 5px;
>-            text-decoration: none;
>-
>-            &:link,
>-            &:visited {
>-                background-color: #EEEEEE;
>-                color: #3366CC;
>-            }
>-
>-            &:hover,
>-            &:active {
>-                background-color: #FFC;
>-            }
>-        }
>-
>-        .current,
>-        .currentPage {
>-            background-color: #E6FCB7;
>-            color: #666;
>-            font-weight: bold;
>-            padding: 1px 5px;
>-        }
>-
>-        .inactive {
>-            background-color: #F3F3F3;
>-            color: #BCBCBC;
>-            font-weight: bold;
>-            padding: 1px 5px;
>-        }
>+#header {
>+    + #breadcrumbs {
>+        margin-top: 1em;
>     }
> 
>-    .browse {
>-        margin: .5em 0;
>+    > .container-fluid {
>+        padding: 0;
>     }
> }
> 
>@@ -1216,21 +1215,20 @@ dd {
>     }
> }
> 
>-
> .patroninfo {
>-    margin-right: .5em;
>-    padding-top: 1em;
>-    background-color: #e6e6e6;
>+    background-color: #E6E6E6;
>     color: #000;
>     left: -10px;
>-    width: 100%;
>+    margin-right: .5em;
>     padding-bottom: 25px;
>+    padding-top: 1em;
>+    width: 100%;
> 
>     h5 {
>+        color: #000;
>+        font-weight: bold;
>         margin-bottom: 0;
>         padding: .5em .9em;
>-        font-weight: bold;
>-        color: #000;
> 
>         &:empty {
>             border-right: 0;
>@@ -1254,7 +1252,6 @@ dd {
>         li {
>             list-style-type: none;
>             margin: 0;
>-
>         }
>     }
> 
>@@ -1268,9 +1265,9 @@ dd {
> }
> 
> .patroninfo-heading {
>-    padding: .5em;
>-    margin-bottom: .3em;
>     clear: both;
>+    margin-bottom: .3em;
>+    padding: .5em;
> 
>     h3 {
>         display: inline-block;
>@@ -1301,8 +1298,8 @@ dd {
> .patronimage {
>     border: 1px solid #EEE;
>     display: block;
>-    max-width: 160px;
>     margin: auto;
>+    max-width: 160px;
>     opacity: 1;
>     transition: .2s ease;
> 
>@@ -1326,21 +1323,22 @@ dd {
> 
> .patronimage-control {
>     padding: 1em 2em;
>- }
>+}
> 
>-#patronImageEdit input[type="file" ] {
>+#patronImageEdit input[type="file"] {
>     display: inline-block;
> }
> 
>-#addColumn, #delColumn{
>-    color: $green-text-color;
>-    padding: .3em;
>-    border: none;
>+#addColumn,
>+#delColumn {
>     background-color: transparent;
>+    border: none;
>     box-shadow: none;
>+    color: $green-text-color;
>     font-size: 100%;
>+    padding: .3em;
> 
>-    &:hover{
>+    &:hover {
>         text-decoration: underline;
>     }
> }
>@@ -1379,12 +1377,11 @@ dd {
>             }
>         }
>     }
>-
> }
> 
> .readonly,
>-input[type='text']:read-only {
>-    background: #EEE url("../img/locked.png") center left no-repeat;
>+input[type="text"]:read-only {
>+    background: #EEE url( "../img/locked.png" ) center left no-repeat;
>     border-style: inset;
>     border-width: 1px;
>     cursor: default;
>@@ -1392,7 +1389,7 @@ input[type='text']:read-only {
> }
> 
> .readonly:focus,
>-input[type='text']:read-only:focus {
>+input[type="text"]:read-only:focus {
>     border-color: unset;
>     border-radius: unset;
> }
>@@ -1407,7 +1404,7 @@ input[type='text']:read-only:focus {
> }
> 
> .important_subfield_not_filled {
>-    background-color : #FFFFCC;
>+    background-color: #FFFFCC;
> }
> 
> .content_hidden {
>@@ -1480,8 +1477,8 @@ i {
> }
> 
> .circ-settings {
>-    border-top: 2px solid #EEE;
>     border-radius: 0;
>+    border-top: 2px solid #EEE;
>     display: none;
>     margin-left: -1em;
>     margin-right: -1em;
>@@ -1491,16 +1488,16 @@ i {
> 
> #show-circ-settings {
>     display: inline;
>+    opacity: .5;
>     position: relative;
>     right: 25px;
>-    opacity: .5;
> 
>     &:hover {
>         opacity: 1;
>     }
> 
>     a {
>-        color: rgb(105, 105, 105);
>+        color: rgb( 105, 105, 105 );
> 
>         &:hover {
>             text-decoration: none;
>@@ -1511,7 +1508,7 @@ i {
> .checkin-active-setting {
>     background-color: #FFC;
>     border-radius: 3px;
>-    box-shadow: 1px 1px 2px 0 rgba(102, 102, 102, .5);
>+    box-shadow: 1px 1px 2px 0 rgba( 102, 102, 102, .5 );
>     margin: .5em;
>     padding: .5em;
> }
>@@ -1521,8 +1518,11 @@ i {
> }
> 
> .form-group {
>+    margin-bottom: 10px;
>+
>     label {
>         display: block;
>+        font-weight: bold;
>         margin-bottom: 5px;
>     }
> 
>@@ -1552,10 +1552,10 @@ i {
> 
> .dialog {
>     margin: 1em auto;
>+    max-width: 600px;
>     padding: .5em;
>     text-align: center;
>     width: 65%;
>-    max-width: 600px;
> 
>     a {
>         &.approve {
>@@ -1601,44 +1601,43 @@ i {
> 
>             &.approve {
>                 background-color: #FEC32C;
>-                color: #000;
>-                border: 0;
>                 background-image: none;
>+                border: 0;
>+                color: #000;
>                 margin-top: 5px;
> 
>                 &:hover,
>                 &:active,
>                 &:focus {
>-                    background-color: #fec22c9f;
>+                    background-color: #FEC22C9F;
>                 }
>             }
> 
>             &.deny {
>                 background-color: transparent;
>-                color: #696969;
>+                background-image: none;
>                 border: #696969 double 1px;
>-                margin-top: 5px;
>-                margin-left: 5px;
>-
>+                border-radius: 4px;
>+                color: #696969;
>+                cursor: pointer;
>                 display: inline-block;
>-                margin-bottom: 0;
>+                font-size: 12px;
>                 font-weight: normal;
>+                line-height: 1.4286;
>+                margin-bottom: 0;
>+                margin-left: 5px;
>+                margin-top: 5px;
>+                padding: 6px 12px;
>                 text-align: center;
>-                white-space: nowrap;
>-                vertical-align: middle;
>                 touch-action: manipulation;
>-                cursor: pointer;
>-                background-image: none;
>-                padding: 6px 12px;
>-                font-size: 12px;
>-                line-height: 1.42857143;
>-                border-radius: 4px;
>                 user-select: none;
>+                vertical-align: middle;
>+                white-space: nowrap;
> 
>                 &:hover {
>-                    font-weight: bold;
>                     background-color: #F1F1F1;
>                     border: #696969 double 1px;
>+                    font-weight: bold;
>                     text-decoration: none;
>                 }
>             }
>@@ -1655,7 +1654,8 @@ i {
> 
>     p {
>         margin-top: 0;
>-        &+p {
>+
>+        & + p {
>             margin-top: 5px;
>         }
>     }
>@@ -1711,10 +1711,10 @@ i {
>     }
> }
> 
>-
> .approve,
> .success {
>     background-color: #FEC32C;
>+
>     i {
>         &.fa {
>             color: $green-text-color;
>@@ -1742,7 +1742,7 @@ i {
>     i {
>         &.fa-exclamation-triangle {
>             color: #FFD700;
>-            text-shadow: 0 -1px 0 rgba( 0, 0, 0, .3);
>+            text-shadow: 0 -1px 0 rgba( 0, 0, 0, .3 );
>         }
>     }
> }
>@@ -1782,14 +1782,14 @@ i {
> }
> 
> .barcode {
>+    border-radius: 0;
>     font-size: 100%;
>-    vertical-align: middle;
>     font-style: italic;
>-    width: 250px;
>     height: 30px;
>     padding-left: 5px;
>     padding-right: 30px;
>-    border-radius: 0;
>+    vertical-align: middle;
>+    width: 250px;
> }
> 
> li {
>@@ -1854,16 +1854,19 @@ li {
>     }
> 
>     & + p {
>-        border-top: 1px solid #eee;
>+        border-top: 1px solid #EEE;
>         margin-top: 1em;
>         padding-top: 1em;
>     }
> }
> 
>-#catalogue_stats_wrapper, #tbl_cash_register_stats_wrapper, #resulttable_wrapper, #numberpatternst_wrapper {
>+#catalogue_stats_wrapper,
>+#tbl_cash_register_stats_wrapper,
>+#resulttable_wrapper,
>+#numberpatternst_wrapper {
>     background-color: #FFFFFF;
>+    box-shadow: 8px 8px 12px rgba( 170, 170, 170, .356 );
>     margin-top: 20px;
>-    box-shadow: 8px 8px 12px rgba(170, 170, 170, .356);
>     padding: 20px;
> }
> 
>@@ -1871,27 +1874,27 @@ li {
>     background-color: #FFFFFF;
>     margin-top: 20px;
>     min-width: 100%;
>-    width: fit-content;
>     padding: 20px;
>+    width: fit-content;
> 
>     fieldset {
>         box-shadow: none;
>     }
> 
>-    h3{
>-        padding-bottom: .7em;
>-        margin: 0;
>+    h3 {
>         color: #696969;
>+        margin: 0;
>+        padding-bottom: .7em;
>     }
> 
>     td {
>         ul {
>             li {
>                 clear: left;
>+                color: #000;
>                 font-size: 90%;
>-                list-style: url("../img/item-bullet.svg");
>+                list-style: url( "../img/item-bullet.svg" );
>                 padding: .2em 0;
>-                color: #000;
>                 top: 100%;
> 
>                 &.result_itype_image {
>@@ -1942,6 +1945,7 @@ li {
>         ul {
>             margin: 0;
>             padding-left: 0;
>+
>             li {
>                 clear: none;
>                 float: left;
>@@ -1962,31 +1966,31 @@ li {
>             color: #000;
> 
>             &:hover {
>+                background-color: #FFFFFF;
>                 background-image: none;
>                 color: #000;
>                 text-decoration: underline;
>-                background-color: #FFFFFF;
>             }
>         }
>     }
> }
> 
> .searchheader {
>-    background-color: #f3f4f4;
>-    box-shadow: 0 0 2px 1px rgba(0,0,0,.2);
>+    background-color: #F3F4F4;
>+    box-shadow: 0 0 2px 1px rgba( 0, 0, 0, .2 );
>+    color: #696969;
>+    display: block;
>     font-size: 80%;
>-    margin-top: .5em;
>     margin-bottom: .5em;
>+    margin-top: .5em;
>     padding: 5px;
>     width: 100%;
>-    color: #696969;
>-    display: block;
> 
>     &.floating {
>         border-radius: 0;
>-        box-shadow: 0 0 2px 1px rgba(0,0,0,.4);
>-        margin-top: 0;
>+        box-shadow: 0 0 2px 1px rgba( 0, 0, 0, .4 );
>         margin-bottom: 0;
>+        margin-top: 0;
>         z-index: 100;
>     }
> 
>@@ -2046,10 +2050,8 @@ li {
>     width: 30px;
> }
> 
>-
>-
> #search-facets {
>-    background-color: #e6e6e6;
>+    background-color: #E6E6E6;
> 
>     h4 {
>         background-color: $background-color-primary;
>@@ -2095,15 +2097,15 @@ li {
> }
> 
> #biblio-cover-slider {
>-    border: 1px solid #bfd9b9;
>+    border: 1px solid #BFD9B9;
>     border-radius: 3px;
>     margin: 5px;
>-    padding: 10px 5px 5px 5px;
>     min-height: 175px;
>+    padding: 10px 5px 5px 5px;
> }
> 
> .cover-slides {
>-    background: #FFF url("../img/spinner-small.gif") center center no-repeat;
>+    background: #FFF url( "../img/spinner-small.gif" ) center center no-repeat;
> 
>     .hint {
>         font-size: 90%;
>@@ -2114,7 +2116,7 @@ li {
>         &.nav-active {
>             &:link,
>             &:visited {
>-                color: #85ca11;
>+                color: #85CA11;
>             }
>         }
>     }
>@@ -2124,8 +2126,9 @@ td {
>     &.actions {
>         white-space: nowrap;
>     }
>+
>     &.bookcoverimg {
>-        background: #FFF url("../img/spinner-small.gif") center center no-repeat;
>+        background: #FFF url( "../img/spinner-small.gif" ) center center no-repeat;
>         min-width: 120px;
>         text-align: center;
>     }
>@@ -2150,20 +2153,18 @@ td {
> }
> 
> .highlight_toggle {
>-    color: $green-text-color;
>-    padding: .3em;
>-    border: 0;
>     background-color: transparent;
>     border: 0;
>     box-shadow: none;
>+    color: $green-text-color;
>     font-size: 100%;
>+    padding: .3em;
> 
>     &:hover {
>         text-decoration: underline;
>     }
> }
> 
>-
> .cover-image {
>     display: none;
> 
>@@ -2196,9 +2197,9 @@ td {
> #CheckAll,
> #CheckNone,
> #CheckPending {
>+    color: $green-text-color;
>     font-weight: normal;
>     margin: 0 .5em 0 0;
>-    color: $green-text-color;
> }
> 
> .lost,
>@@ -2208,10 +2209,6 @@ td {
>     display: block;
> }
> 
>-.bundled {
>-    display: block;
>-}
>-
> td.bundle {
>     background-color: #FFC !important;
> }
>@@ -2262,7 +2259,7 @@ td.bundle {
> 
>     tbody {
>         tr {
>-            &:nth-child(2n+1) {
>+            &:nth-child( 2n+1 ) {
>                 td {
>                     background-color: #FFFFFF;
>                 }
>@@ -2334,8 +2331,8 @@ td.bundle {
> }
> 
> #cartmenulink {
>-    position: relative;
>     left: 0;
>+    position: relative;
>     top: 0;
> }
> 
>@@ -2388,7 +2385,7 @@ td.bundle {
>         text-decoration: none;
> 
>         &:hover {
>-            background-color: lighten( $background-color-secondary, 40 )
>+            background-color: lighten( $background-color-secondary, 40 );
>         }
>     }
> }
>@@ -2555,7 +2552,7 @@ td.bundle {
> 
> #acqui_order_supplierlist {
>     .supplier {
>-        &+.supplier {
>+        & + .supplier {
>             border-top: 1px solid #EEEEEE;
>             margin-top: 1em;
>         }
>@@ -2588,14 +2585,14 @@ td.bundle {
> // Override core jQueryUI widgets
> .ui-widget-content {
>     background: #FFFFFF none;
>-    border-radius: 4px;
>     border: 3px solid $background-color-primary;
>+    border-radius: 4px;
>     color: #222222;
> }
> 
> .ui-widget-header {
>-    background: #b5dbad none;
>-    border: 1px solid #bfd9b9;
>+    background: #B5DBAD none;
>+    border: 1px solid #BFD9B9;
>     color: #222222;
>     font-weight: bold;
> }
>@@ -2603,7 +2600,7 @@ td.bundle {
> .ui-state-default,
> .ui-widget-content .ui-state-default,
> .ui-widget-header .ui-state-default {
>-    border: 1px solid #bfd9b9;
>+    border: 1px solid #BFD9B9;
>     color: #555555;
>     font-weight: normal;
> }
>@@ -2614,8 +2611,8 @@ td.bundle {
> .ui-state-focus,
> .ui-widget-content .ui-state-focus,
> .ui-widget-header .ui-state-focus {
>-    background: #cad8c6 none;
>-    border: 1px solid #bfd9b9;
>+    background: #CAD8C6 none;
>+    border: 1px solid #BFD9B9;
>     color: #212121;
>     font-weight: normal;
> }
>@@ -2638,7 +2635,7 @@ td.bundle {
> 
> // Override jQuery Autocomplete
> .ui-autocomplete {
>-    box-shadow: 2px 2px 2px rgba(0, 0, 0, .3);
>+    box-shadow: 2px 2px 2px rgba( 0, 0, 0, .3 );
>     cursor: default;
>     position: absolute;
>     z-index: 2000;
>@@ -2649,7 +2646,7 @@ td.bundle {
>                 padding: 3px 1em 3px .4em;
> 
>                 &:hover {
>-                    background: #e3f1df none;
>+                    background: #E3F1DF none;
>                     color: #212121;
>                     font-weight: normal;
>                 }
>@@ -2665,7 +2662,7 @@ td.bundle {
> 
>                 .ui-state-active,
>                 .ui-state-focus {
>-                    background: #e3f1df none;
>+                    background: #E3F1DF none;
>                     color: #212121;
>                     font-weight: normal;
>                     margin: 0;
>@@ -2676,7 +2673,7 @@ td.bundle {
> }
> 
> .ui-autocomplete-loading {
>-    background: #FFF url("../img/spinner-small.gif") right center no-repeat;
>+    background: #FFF url( "../img/spinner-small.gif" ) right center no-repeat;
> }
> 
> .ui-widget {
>@@ -2728,7 +2725,6 @@ fieldset > .toptabs {
>     font-style: italic;
> }
> 
>-
> .contents {
>     width: 75%;
> 
>@@ -2738,8 +2734,8 @@ fieldset > .toptabs {
>     }
> 
>     .t {
>-        font-weight: bold;
>         display: inline;
>+        font-weight: bold;
>     }
> 
>     .r {
>@@ -2747,7 +2743,6 @@ fieldset > .toptabs {
>     }
> }
> 
>-
> .contentblock {
>     font-size: 95%;
>     line-height: 135%;
>@@ -2776,8 +2771,8 @@ fieldset > .toptabs {
> 
>             &.jstree-clicked {
>                 background: transparent none;
>-                box-shadow: none;
>                 border: 0;
>+                box-shadow: none;
>             }
>         }
>     }
>@@ -2798,7 +2793,7 @@ fieldset > .toptabs {
> }
> 
> .pluginname {
>-    background-color: #e3f1df;
>+    background-color: #E3F1DF;
>     cursor: move;
>     margin: .3em;
>     padding-bottom: 4px;
>@@ -2857,17 +2852,17 @@ nav {
>         margin: 0;
> 
>         ol {
>+            list-style: none;
>             margin: 0;
>             padding-left: 0;
>-            list-style: none;
> 
>             li {
>+                color: $green-text-color;
>                 display: inline;
>-                color : $green-text-color;
>                 font-style: italic;
> 
>-                &+li::before {
>-                    background: transparent url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iY3VycmVudENvbG9yIiBjbGFzcz0iYmkgYmktY2hldnJvbi1yaWdodCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNy4zNyAwbDUuMzUgNy4zYy4yLjIuMi41MSAwIC43bC01LjM4IDhoLTQuMmw1LjY0LTguMzVMMy4xMy4wMXoiLz48L3N2Zz4=") 50% 50% no-repeat;
>+                & + li::before {
>+                    background: transparent url( "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iY3VycmVudENvbG9yIiBjbGFzcz0iYmkgYmktY2hldnJvbi1yaWdodCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNy4zNyAwbDUuMzUgNy4zYy4yLjIuMi41MSAwIC43bC01LjM4IDhoLTQuMmw1LjY0LTguMzVMMy4xMy4wMXoiLz48L3N2Zz4=" ) 50% 50% no-repeat;
>                     background-size: 8px;
>                     content: "";
>                     display: inline-block;
>@@ -2875,7 +2870,10 @@ nav {
>                     width: .8em;
>                 }
> 
>-                a:link, a:active, a:hover, a:focus {
>+                a:link,
>+                a:active,
>+                a:hover,
>+                a:focus {
>                     padding: .6em .3em;
>                 }
>             }
>@@ -2905,6 +2903,7 @@ nav {
>         a {
>             background-color: transparent;
>         }
>+
>         &.active {
>             a {
>                 &:link,
>@@ -2922,7 +2921,6 @@ nav {
>     }
> }
> 
>-
> .pagination {
>     margin: .5em 0;
> }
>@@ -2951,18 +2949,18 @@ button,
>     &.btn-danger {
>         background-color: #CC3333;
>         border-color: #9B2323;
>-        color: #fff;
>+        color: #FFF;
>     }
> 
>     &.btn-danger:hover {
>-        color: #fff;
>-        background-color: #c82333;
>-        border-color: #a81c29;
>+        background-color: #C82333;
>+        border-color: #A81C29;
>+        color: #FFF;
>     }
> 
>-    &.btn-danger:not( :disabled ):not( .disabled ).active,
>-    &.btn-danger:not( :disabled ):not( .disabled ):active {
>-        box-shadow: inset 0 0 0 1px #a81c29;
>+    &.btn-danger:not( :disabled, .disabled ).active,
>+    &.btn-danger:not( :disabled, .disabled ):active {
>+        box-shadow: inset 0 0 0 1px #A81C29;
>     }
> }
> 
>@@ -2990,10 +2988,10 @@ button,
> .panel-title {
>     a {
>         border-radius: 3px;
>-        display: block;
>-        padding: 10px 15px;
>         border-bottom-left-radius: 0;
>         border-bottom-right-radius: 0;
>+        display: block;
>+        padding: 10px 15px;
> 
>         &::before {
>             content: "\f0d7";
>@@ -3003,7 +3001,7 @@ button,
>         }
> 
>         &:hover {
>-            background: #e3f1df none;
>+            background: #E3F1DF none;
>             border-bottom-left-radius: 0;
>             border-bottom-right-radius: 0;
>         }
>@@ -3017,7 +3015,7 @@ button,
>             }
> 
>             &:hover {
>-                background: #e3f1df none;
>+                background: #E3F1DF none;
>                 border-bottom-left-radius: 3px;
>                 border-bottom-right-radius: 3px;
>             }
>@@ -3026,14 +3024,15 @@ button,
> }
> 
> .panel-default {
>-    border: 1px solid #bfd9b9;
>+    border: 1px solid #BFD9B9;
>+
>     > .panel-heading {
>         background: transparent none;
>         padding: 0;
> 
>         + .panel-collapse {
>             > .panel-body {
>-                border-top-color: #bfd9b9;
>+                border-top-color: #BFD9B9;
>             }
>         }
>     }
>@@ -3049,7 +3048,7 @@ button,
> 
> #changelanguage {
>     background: #FFF none;
>-    border-top: 1px solid rgb(173, 173, 173);
>+    border-top: 1px solid rgb( 173, 173, 173 );
>     min-height: $language-footer-min-height;
> 
>     .dropdown-menu {
>@@ -3113,8 +3112,8 @@ button,
> 
>         .tooltip-inner {
>             background-color: #FFFFFF;
>-            border: 1px solid rgba(0, 0, 0, .2);
>-            box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
>+            border: 1px solid rgba( 0, 0, 0, .2 );
>+            box-shadow: 0 5px 10px rgba( 0, 0, 0, .2 );
>             color: #000;
>             font-size: 120%;
>             padding: 1em;
>@@ -3123,7 +3122,7 @@ button,
> }
> 
> .separator {
>-    color: #bfbfbf;
>+    color: #BFBFBF;
>     padding: 0 .2em;
> }
> 
>@@ -3147,7 +3146,6 @@ button,
>     }
> }
> 
>-
> label {
>     .radio &,
>     .checkbox & {
>@@ -3245,7 +3243,7 @@ label {
>         font-size: 13px;
>     }
> 
>-    > .btn:first-child:not( :last-child ):not( .dropdown-toggle ) {
>+    > .btn:first-child:not( :last-child, .dropdown-toggle ) {
>         border-right: 1px solid darken( saturate( $btn-primary, 15 ), 15 );
>     }
> }
>@@ -3286,7 +3284,7 @@ code {
> }
> 
> .tab-content {
>-    background-color: #fff;
>+    background-color: #FFF;
>     border: 0;
>     border-radius: 0;
>     padding: 1em;
>@@ -3294,15 +3292,7 @@ code {
> 
> .tab-pane {
>     &.active {
>-        &::after,
>-        &::before {
>-            content: " ";
>-            display: table;
>-        }
>-
>-        &::after {
>-            clear: both;
>-        }
>+        @include clearfix;
>     }
> }
> 
>@@ -3324,7 +3314,9 @@ code {
>             margin-right: .4em;
>             padding: .5em 1em;
> 
>-            &:hover, &:focus, &:active {
>+            &:hover,
>+            &:focus,
>+            &:active {
>                 background-color: $background-color-primary;
>                 border: 2px solid $background-color-primary;
>                 border-bottom: 0;
>@@ -3364,12 +3356,12 @@ code {
> }
> 
> #jobprogress {
>-    background: url("../img/progress.png") -300px 0 no-repeat;
>+    background: url( "../img/progress.png" ) -300px 0 no-repeat;
>     border: 1px solid #666;
>     display: inline-block;
>     height: 10px;
>     width: 200px;
>- }
>+}
> 
> .progress_panel {
>     border: 2px solid #EEE;
>@@ -3394,7 +3386,7 @@ progress {
>     }
> 
>     span {
>-        background-color: #ecffeb;
>+        background-color: #ECFFEB;
>         border-radius: 5px;
>         display: inline-block;
>         font-size: 75%;
>@@ -3403,7 +3395,7 @@ progress {
>         white-space: nowrap;
> 
>         &.selected {
>-            background-color: #d2fad0;
>+            background-color: #D2FAD0;
>         }
>     }
> }
>@@ -3428,7 +3420,7 @@ progress {
> }
> 
> .tag_editor {
>-    background: transparent url("../img/edit-tag.png") top left no-repeat;
>+    background: transparent url( "../img/edit-tag.png" ) top left no-repeat;
>     display: block;
>     float: left;
>     height: 16px;
>@@ -3456,8 +3448,8 @@ progress {
> }
> 
> #browse-return-to-results {
>-    background-color: #e6e6e6;
>-    border: 1px solid lighten($background-color-primary, 30%);
>+    background-color: #E6E6E6;
>+    border: 1px solid lighten( $background-color-primary, 30% );
>     border-bottom-width: 0;
>     border-top-left-radius: 5px;
>     border-top-right-radius: 5px;
>@@ -3468,7 +3460,7 @@ progress {
> 
> .browse-button {
>     background-color: transparent;
>-    border: 1px solid lighten($background-color-primary, 30%);
>+    border: 1px solid lighten( $background-color-primary, 30% );
>     display: block;
>     overflow: hidden;
>     padding: .4em .6em;
>@@ -3481,7 +3473,7 @@ a.browse-button {
>     color: $green-text-color;
> 
>     &:hover {
>-        background: #fff;
>+        background: #FFF;
>     }
> }
> 
>@@ -3526,7 +3518,6 @@ span {
>     }
> }
> 
>-
> .result-biblio-itemtype {
>     float: right;
>     font-size: 85%;
>@@ -3546,8 +3537,8 @@ span {
> }
> 
> #browse-next {
>-    border-bottom-right-radius: 5px;
>     border-bottom-left-radius: 5px;
>+    border-bottom-right-radius: 5px;
> }
> 
> #merge_invoices {
>@@ -3625,14 +3616,14 @@ input.renew {
> }
> 
> .onsite-checkout-only {
>-    background-color: rgba(255, 242, 206, .5);
>+    background-color: rgba( 255, 242, 206, .5 );
>     border: 1px solid #FFF2CE;
>     border-radius: 4px;
> }
> 
> .branchgriditem {
>     background-color: #FFFFFF;
>-    border: 1px solid #bfd9b9;
>+    border: 1px solid #BFD9B9;
>     border-radius: 3px;
>     display: table-cell;
>     float: left;
>@@ -3659,14 +3650,13 @@ input.renew {
> 
> #new_rule {
>     background-color: #F4F8F9;
>-    border: 2px solid #bfd9b9;
>+    border: 2px solid #BFD9B9;
>     border-radius: 5px;
>     display: none;
>     margin: .3em;
>     padding: .3em;
> }
> 
>-
> .blocks {
>     margin-bottom: .3em;
> }
>@@ -3692,15 +3682,6 @@ input.renew {
>     margin-top: 10px;
> }
> 
>-.form-group {
>-    margin-bottom: 10px;
>-
>-    label {
>-        font-weight: bold;
>-    }
>-}
>-
>-
> .form-message {
>     background-color: #FFF;
>     border: 1px solid #A4BEDD;
>@@ -3720,7 +3701,7 @@ input.renew {
> }
> 
> #fixedlengthbuilderaction {
>-    border: 3px solid #e3f1df;
>+    border: 3px solid #E3F1DF;
>     left: 80%;
>     padding: 5px;
>     position: relative;
>@@ -3782,7 +3763,7 @@ input.renew {
>     #search-summary {
>         position: absolute;
>         top: 50%;
>-        transform: translateY(-50%);
>+        transform: translateY( -50% );
>     }
> 
>     #generic_confirm_search_count {
>@@ -3791,14 +3772,15 @@ input.renew {
> 
>     #generic_confirm_search {
>         display: block;
>-        visibility: hidden;
>         margin: 1em 0 1em 10em;
>+        visibility: hidden;
>     }
> 
>     #partnerSearch {
>         .modal-dialog {
>             width: 50vw;
>         }
>+
>         .modal-body {
>             max-height: 70vh;
>         }
>@@ -3829,7 +3811,8 @@ input.renew {
>     width: 100% !important;
> }
> 
>-.ar-title, .hq-title {
>+.ar-title,
>+.hq-title {
>     .biblio-title {
>         font-weight: bold;
>     }
>@@ -3847,66 +3830,76 @@ input.renew {
>     h3 {
>         margin: 30px 0 10px 0;
>     }
>+
>     .dialog {
>         h3 {
>             margin: 10px 0;
>         }
>+
>         margin-bottom: 20px;
>     }
>+
>     .highlight_stage {
>         font-weight: bold;
>     }
>-}
>-
>-#catalog_stockrotation .highlight_stage {
>-    font-weight: bold;
>-}
> 
>-#stockrotation {
>     #rota_form {
>         textarea {
>-            width: 300px;
>             height: 100px;
>+            width: 300px;
>         }
>+
>         #name {
>             width: 300px;
>         }
>+
>         fieldset {
>             width: auto;
>         }
>     }
>-    #stage_form fieldset, #add_rota_item_form fieldset {
>+
>+    #stage_form fieldset,
>+    #add_rota_item_form fieldset {
>         width: auto;
>     }
>+
>     .dialog.alert {
>         ul {
>             margin: 20px 0;
>         }
>+
>         li {
>             list-style-type: none;
>         }
>     }
> }
> 
>+#catalog_stockrotation .highlight_stage {
>+    font-weight: bold;
>+}
>+
> #catalog_stockrotation {
>     .item_select_rota {
>         vertical-align: middle;
>     }
>+
>     h1 {
>         margin-bottom: 20px;
>     }
> }
> 
>-#stockrotation td.actions, #catalog_stockrotation td.actions {
>+#stockrotation td.actions,
>+#catalog_stockrotation td.actions {
>     vertical-align: middle;
> }
> 
>-#stockrotation .stage, #catalog_stockrotation .stage {
>+#stockrotation .stage,
>+#catalog_stockrotation .stage {
>+    background-color: rgba( 0, 0, 0, .1 );
>+    border-radius: 5px;
>     display: inline-block;
>-    padding: 5px 7px;
>     margin: 3px 0 3px 0;
>-    border-radius: 5px;
>-    background-color: rgba(0, 0, 0, .1);
>+    padding: 5px 7px;
> }
> 
> #restriction_form {
>@@ -3917,6 +3910,7 @@ input.renew {
> 
> #stage_list_headings {
>     font-weight: bold;
>+
>     span {
>         padding: 3px;
>     }
>@@ -3926,46 +3920,57 @@ input.renew {
>     ul {
>         padding-left: 0;
>     }
>+
>     li {
>         list-style: none;
>         margin-bottom: 5px;
>+
>         span {
>             padding: 6px 3px;
>         }
>     }
>+
>     .stagename {
>-        width: 15em;
>         display: inline-block;
>+        width: 15em;
>     }
>+
>     .stageduration {
>-        width: 10em;
>         display: inline-block;
>+        width: 10em;
>     }
>+
>     .stageactions {
>         display: inline-block;
>     }
>-    li:nth-child(odd) {
>+
>+    li:nth-child( odd ) {
>         background-color: #F3F3F3;
>     }
>+
>     .drag_handle {
>-        margin-right: 6px;
>         cursor: move;
>+        margin-right: 6px;
>     }
>+
>     .drag_placeholder {
>+        border: 1px dotted #AAA;
>         height: 2em;
>-        border: 1px dotted #aaa;
>     }
>+
>     h3 {
>         display: inline-block;
>     }
>+
>     #ajax_status {
>-        display: inline-block;
>-        border: 1px solid #bcbcbc;
>+        background: #F3F3F3;
>+        border: 1px solid #BCBCBC;
>         border-radius: 5px;
>-        padding: 5px;
>+        display: inline-block;
>         margin-left: 10px;
>-        background: #f3f3f3;
>+        padding: 5px;
>     }
>+
>     #manage_stages_help {
>         margin: 20px 0;
>     }
>@@ -3984,7 +3989,7 @@ input.renew {
> .loggedin-menu-label {
>     color: #FFFFFF;
>     font-size: 12px;
>-    line-height: 1.42857143;
>+    line-height: 1.4286;
>     padding: 4px 12px;
>     white-space: nowrap;
> 
>@@ -4002,9 +4007,10 @@ input.renew {
> 
> /* ==== MODULE LINKS - Start ==== */
> .buttons-list {
>+    max-width: 260px;
>+
>     /* List containing the module links */
>     padding: 0;
>-    max-width: 260px;
> 
>     li {
>         /* Standard attributes for the list elements */
>@@ -4012,17 +4018,17 @@ input.renew {
>         margin-bottom: 15px;
> 
>         a {
>-            padding: 10px;
>-            background-color: #e0e0e0;
>+            background-color: #E0E0E0;
>             border-radius: 6px;
>             color: #101010;
>             display: block;
>             font-size: 110%;
>             font-weight: bold;
>+            padding: 10px;
> 
>             &:hover {
>                 background-color: $background-color-primary;
>-                color: white;
>+                color: #FFF;
>                 text-decoration: none;
>             }
>         }
>@@ -4030,24 +4036,24 @@ input.renew {
> }
> 
> .about h2 {
>-    border-bottom: 1px solid #bfd9b9;
>+    border-bottom: 1px solid #BFD9B9;
>+    margin: .5em 0;
>     padding: .5em .2em;
>-    margin:  .5em 0;
> }
> 
> .columns-2 {
>-    columns: 2 auto;
>     column-gap: 2.5em;
>+    columns: 2 auto;
> }
> 
> .columns-3 {
>-    columns: 3 auto;
>     column-gap: 2.5em;
>+    columns: 3 auto;
> }
> 
> .columns-4 {
>-    columns: 4 auto;
>     column-gap: 2em;
>+    columns: 4 auto;
> }
> 
> /* ==== MODULE LINKS - End ==== */
>@@ -4057,7 +4063,6 @@ input.renew {
>     padding-right: .3em;
> }
> 
>-
> #catalog-search-dropdown {
>     padding: 0;
> 
>@@ -4140,12 +4145,11 @@ input.renew {
>         border-bottom-width: 1px;
>     }
> 
>-    &:nth-child(odd) {
>+    &:nth-child( odd ) {
>         background-color: #F8F8F8;
>     }
> }
> 
>-
> .superlibrarian-hint {
>     color: #000;
>     padding: .2em 0;
>@@ -4167,7 +4171,7 @@ input.renew {
>         border-bottom-width: 1px;
>     }
> 
>-    &:nth-child(odd) {
>+    &:nth-child( odd ) {
>         background-color: #EEE;
>     }
> }
>@@ -4251,8 +4255,8 @@ div .suggestion_note {
>     }
> 
>     .result_item_details {
>-        display:inline-block;
>-        white-space:nowrap;
>+        display: inline-block;
>+        white-space: nowrap;
> 
>         &::before {
>             content: "\2022";
>@@ -4264,7 +4268,8 @@ div .suggestion_note {
>     }
> }
> 
>-#camera, #output {
>+#camera,
>+#output {
>     border: 8px solid #EDF4F6;
>     padding: 1em;
> }
>@@ -4276,8 +4281,6 @@ div .suggestion_note {
> 
> #camera-error {
>     display: none;
>-    flex-direction: row;
>-    flex-wrap: nowrap;
> 
>     div {
>         padding: 0 .5em;
>@@ -4289,21 +4292,11 @@ div .suggestion_note {
>     margin: .5em;
> }
> 
>-.tab-pane {
>-    &.active {
>-        @include clearfix();
>-    }
>-}
>-
> @import "header";
> @import "toolbar";
> @import "forms";
> 
>-@media (min-width: 200px) {
>-
>-}
>-
>-@media (max-width: 767px) {
>+@media ( max-width: 767px ) {
>     .header-menu-link {
>         display: inline-block;
>     }
>@@ -4330,7 +4323,7 @@ div .suggestion_note {
>         .open {
>             .dropdown-menu {
>                 background-color: #352C2E;
>-                border: 1px solid #ccc;
>+                border: 1px solid #CCC;
>                 position: absolute;
>             }
>         }
>@@ -4345,10 +4338,10 @@ div .suggestion_note {
>             padding-left: 1.5em;
> 
>             &:hover {
>-                text-decoration: underline;
>-                color: #FFF;
>                 background-color: #352C2E;
>                 background-image: none;
>+                color: #FFF;
>+                text-decoration: underline;
>             }
>         }
> 
>@@ -4387,7 +4380,7 @@ div .suggestion_note {
>     #user-menu {
>         .open {
>             .dropdown-menu {
>-                background-color: #352c35;
>+                background-color: #352C35;
>                 position: absolute;
>             }
>         }
>@@ -4402,10 +4395,9 @@ div .suggestion_note {
>     }
> }
> 
>-@media (max-width: 768px) {
>+@media ( max-width: 768px ) {
>     .navbar-nav {
>         li {
>-
>             a {
>                 padding: .4em .6em;
>             }
>@@ -4431,10 +4423,7 @@ div .suggestion_note {
>     }
> }
> 
>-@media (min-width: 800px) {
>-
>-
>-
>+@media ( min-width: 800px ) {
>     #helper {
>         i {
>             display: none;
>@@ -4482,10 +4471,10 @@ div .suggestion_note {
>     }
> 
>     body.modalprinter .modal-dialog.focused {
>-        position: absolute;
>-        padding: 0;
>-        margin: 0;
>         left: 0;
>+        margin: 0;
>+        padding: 0;
>+        position: absolute;
>         top: 0;
>     }
> 
>-- 
>2.30.2

Actions: View | Diff | Splinter Review

Attachments on bug 34392: 153926 | 154226 | 154699 | 155897 | 155967 | 157255 | 157342