From 77044b864e5ba858a39b88b7b7686478fd74ac77 Mon Sep 17 00:00:00 2001 From: Owen Leonard Date: Fri, 23 Apr 2021 12:01:57 +0000 Subject: [PATCH] Bug 27113: (follow-up) Move new CSS to main SCSS files This patch removes the separate CSS files added for the autocomplete feature and puts them into the "main" SCSS files. I think a separate file isn't necessary because the amount of CSS it adds is so small. I've also tweaked the style of the autocomplete menu shown when you use the arrow keys to navigate through the autocomplete choices. I think the previous white-on-light-green didn't have enough contrast. To test you must rebuild the OPAC and staff client CSS: https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client Follow the previous test plan, being careful to observe how it works when the autocomplete menu has been triggered and you use the arrow keys to navigate through the results. Signed-off-by: David Nind --- .../prog/css/elasticsearch/autocomplete.css | 28 --------------- .../prog/css/src/staff-global.scss | 34 ++++++++++++++++++ .../prog/en/includes/doc-head-close.inc | 5 --- .../opac-elasticsearch/opac-autocomplete.css | 29 --------------- .../opac-tmpl/bootstrap/css/src/opac.scss | 35 +++++++++++++++++++ .../bootstrap/en/includes/doc-head-close.inc | 5 --- 6 files changed, 69 insertions(+), 67 deletions(-) delete mode 100644 koha-tmpl/intranet-tmpl/prog/css/elasticsearch/autocomplete.css delete mode 100644 koha-tmpl/opac-tmpl/bootstrap/css/opac-elasticsearch/opac-autocomplete.css diff --git a/koha-tmpl/intranet-tmpl/prog/css/elasticsearch/autocomplete.css b/koha-tmpl/intranet-tmpl/prog/css/elasticsearch/autocomplete.css deleted file mode 100644 index 40dfefb0d6..0000000000 --- a/koha-tmpl/intranet-tmpl/prog/css/elasticsearch/autocomplete.css +++ /dev/null @@ -1,28 +0,0 @@ -.autocomplete { - /*the container must be positioned relative:*/ - position: relative; - display: inline-block; -} -.autocomplete-items { - position: absolute; - border: 1px solid #d4d4d4; - border-bottom: none; - border-top: none; - z-index: 99; - /*position the autocomplete items to be the same width as the container:*/ - } - .autocomplete-items div { - padding: 10px; - cursor: pointer; - background-color: #fff; - border-bottom: 1px solid #d4d4d4; - } - .autocomplete-items div:hover { - /*when hovering an item:*/ - background-color: #e9e9e9; - } - .autocomplete-active { - /*when navigating through the items using the arrow keys:*/ - background-color: #cedfb1 !important; - color: #ffffff; - } \ No newline at end of file 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 6d9db96973..5d7085825e 100644 --- a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss +++ b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss @@ -4426,6 +4426,40 @@ div .suggestion_note { } } +/* Elasticsearch autocomplete menu */ +.autocomplete { + /*the container must be positioned relative:*/ + position: relative; + display: inline-block; +} + +.autocomplete-items { + position: absolute; + border: 1px solid #d4d4d4; + border-bottom: none; + border-top: none; + z-index: 99; + /*position the autocomplete items to be the same width as the container:*/ + + div { + padding: 10px; + cursor: pointer; + background-color: #fff; + border-bottom: 1px solid #d4d4d4; + + &:hover { + /*when hovering an item:*/ + background-color: #e9e9e9; + } + + &.autocomplete-active { + /*when navigating through the items using the arrow keys:*/ + background-color: lighten(#85CA11, 45%); + } + } +} +/* /Elasticsearch autocomplete menu */ + @media (min-width: 200px) { } diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/doc-head-close.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/doc-head-close.inc index c026bae8b1..8f42529cf7 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/includes/doc-head-close.inc +++ b/koha-tmpl/intranet-tmpl/prog/en/includes/doc-head-close.inc @@ -22,11 +22,6 @@ [% Asset.css("css/print.css", { media = "print" }) | $raw %] [% INCLUDE intranetstylesheet.inc %] [% IF ( bidi ) %][% Asset.css("css/right-to-left.css") | $raw %][% END %] - -[% IF ( Koha.Preference('IntranetAutocompleteElasticSearch') ) %] - [% SET Optylesheet = 'elasticsearch/autocomplete.css' %] - -[% END %]