From 8cdc01ed8c710bd146c9aa07aa402c560601dc05 Mon Sep 17 00:00:00 2001 From: Owen Leonard Date: Mon, 10 Mar 2025 16:23:02 +0000 Subject: [PATCH] Bug 39274: Non public notes are low contrast in the issues table - Previous checkouts This patch reflects some rethinking on my part about how the Bootstrap color classes are meant to be used, and makes some changes which I hope will be more consistent with the Bootstrap 5 documentation while keeping our interface usable. The main difference is in the use of the classes "text-bg-*" and "bg-*-subtle." For example the class "bg-info-subtle" will give an element a subtle colored background. "text-bg-info" will have a more saturated background color. The "text-" part of the class is a reference to the fact that elements with that category of classes will have text color which adapts to provide correct contrast. This patch also makes a minor adjustment to the color used for "warning" type elements (e.g.
. I've adjusted the color slightly in order to differentiate it from the "primary" class color we use for submit buttons. To test, apply the patch and rebuil the staff interface CSS. Clear your browser cache if necessary. Checkouts: 1. Have an item with a non-public note. 2. Check it out, it looks fine while under "Today's issues" 3. Set the issuedate to some time in the past `update issues set issuedate = '2025-03-04 15:58:46';` 4. The non-public note should appear in legible red. Return claims: 1. The "Claims" tab on the patron detail and checkout pages already used the "text-bg-*" classes but the "-success" class didn't work well with the tab background color so I removed it. I notice there is a bug in the way the classes change as the tab is activated, but that will have to be dealt with on another bug. Bibliographic details: 1. Place at least one hold and at least one article request on a title. 2. The detail view should show "Holds: 1", and "Article requests: 1" with the numbers in legible Bootstrap badges. Holds: 1. Perform a catalog search which will return multiple titles. 2. Select multiple titles and click "Place hold." 3. Select a patron to place a hold for. 4. Confirm the holds by clicking "Place hold." 5. The holds should now be shown under the heading "Existing holds," with Bootstrap badgets showing the hold count on each. Patrons requesting modification: 1. Submit an update to a patron record via the OPAC. 2. On the patrons home page in the staff interface there should be a "Patrons requesting modifications" link at the top, with a count of pending modifications shown in a Bootstrap badge. Check-ins: 1. Check in an item from a patron account with multiple other checkouts. 2. In the table of checked-in items the patron's remaining checkout count should be shown in a Bootstrap badge. SMTP servers: 1. Go to Administration -> SMTP Servers. 2. Edit at least one server so that debug mode is enabled and it is marked as a default server. 3. In the view of servers, the debug mode and default status should be shown in Bootstrap badges. Plugins: 1. Go to Administration -> Plugins. 2. Upload a plugin if necessary, and check the list of installed plugins when the plugin is disabled and when it is enabled. In both cases the status should appear in a Bootstrap badge. About page: 1. Go to the About page. 2. Under the "Server information" tab, the status of Memcached and Message broker should be shown with a background color--pale blue for okay statuses. Tools home page: 1. If necessary, go to the OPAC and submit at least one comment on a bibliographic record and tag at least one record. 2. In the staff interface, on the Tools home page, the number of tags pending approval and the number of comments awaiting moderation should show in Bootstrap badges. Sponsored-by: Athens County Public Libraries Signed-off-by: Andrew Fuerste Henry --- .../prog/css/src/_variables.scss | 34 +++++++++--------- .../prog/css/src/staff-global.scss | 32 +++-------------- .../prog/en/includes/patron-detail-tabs.inc | 2 +- .../intranet-tmpl/prog/en/modules/about.tt | 36 +++++++++---------- .../prog/en/modules/catalogue/detail.tt | 4 +-- .../prog/en/modules/circ/returns.tt | 2 +- .../prog/en/modules/members/member.tt | 2 +- .../en/modules/onboarding/onboardingstep2.tt | 2 +- .../prog/en/modules/reserve/request.tt | 2 +- .../prog/en/modules/suggestion/suggestion.tt | 2 +- .../prog/en/modules/tools/tools-home.tt | 4 +-- koha-tmpl/intranet-tmpl/prog/js/checkouts.js | 11 ------ .../bootstrap/en/modules/opac-user.tt | 2 +- 13 files changed, 50 insertions(+), 85 deletions(-) diff --git a/koha-tmpl/intranet-tmpl/prog/css/src/_variables.scss b/koha-tmpl/intranet-tmpl/prog/css/src/_variables.scss index 4f460c9cb7..1416c7f0be 100644 --- a/koha-tmpl/intranet-tmpl/prog/css/src/_variables.scss +++ b/koha-tmpl/intranet-tmpl/prog/css/src/_variables.scss @@ -36,7 +36,7 @@ $grays: ( // fusv-enable // scss-docs-start color-variables -$blue: #0d6efd; +$blue: #5d9efe; $indigo: #6610f2; $purple: #6f42c1; $pink: #d63384; @@ -45,7 +45,7 @@ $orange: #fd7e14; $yellow: #ffc107; $green: #408540; $teal: #20c997; -$cyan: #0dcaf0; +$cyan: #84c1f3; // scss-docs-end color-variables $background-color-primary: #408540; @@ -304,9 +304,9 @@ $cyans: ( $primary: $yellow; // $blue !default; $secondary: $gray-600; // $gray-600 !default; $success: $green; // $green !default; -$info: $blue-300; // $blue-100; // $cyan !default; -$warning: $yellow; // $yellow !default; -$danger: #f2dede; // $red !default; +$info: $cyan; // $blue-100; // $cyan !default; +$warning: #ffe407; // $yellow !default; +$danger: $red; // $red !default; $light: #FFF; // $gray-100 !default; $dark: #352c2e; // $gray-900 !default; // scss-docs-end theme-color-variables @@ -336,23 +336,23 @@ $dark-text-emphasis: $gray-700; // scss-docs-end theme-text-variables // scss-docs-start theme-bg-subtle-variables -$primary-bg-subtle: tint-color($primary, 80%); -$secondary-bg-subtle: tint-color($secondary, 80%); -$success-bg-subtle: tint-color($success, 80%); -$info-bg-subtle: tint-color($info, 80%); -$warning-bg-subtle: tint-color($warning, 80%); -$danger-bg-subtle: tint-color($danger, 80%); +$primary-bg-subtle: tint-color($primary, 70%); +$secondary-bg-subtle: tint-color($secondary, 70%); +$success-bg-subtle: tint-color($success, 70%); +$info-bg-subtle: tint-color($info, 70%); +$warning-bg-subtle: tint-color($warning, 70%); +$danger-bg-subtle: tint-color($danger, 70%); $light-bg-subtle: mix($gray-100, $white); $dark-bg-subtle: $gray-400; // scss-docs-end theme-bg-subtle-variables // scss-docs-start theme-border-subtle-variables -$primary-border-subtle: tint-color($primary, 60%); -$secondary-border-subtle: tint-color($secondary, 60%); -$success-border-subtle: tint-color($success, 60%); -$info-border-subtle: tint-color($info, 60%); -$warning-border-subtle: tint-color($warning, 60%); -$danger-border-subtle: tint-color($danger, 60%); +$primary-border-subtle: tint-color($primary, 40%); +$secondary-border-subtle: tint-color($secondary, 40%); +$success-border-subtle: tint-color($success, 40%); +$info-border-subtle: tint-color($info, 40%); +$warning-border-subtle: tint-color($warning, 40%); +$danger-border-subtle: tint-color($danger, 40%); $light-border-subtle: $gray-200; $dark-border-subtle: $gray-500; // scss-docs-end theme-border-subtle-variables 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 d8a1d8aca3..5dbf26325e 100644 --- a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss +++ b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss @@ -78,34 +78,10 @@ $enable-dark-mode: false; ) } -.text-bg-primary { - background-color: shift-color( $primary, -55% ); - color: $black; -} - -.text-bg-secondary { - background-color: shift-color( $secondary, -55% ); - color: $black; -} - -.text-bg-success { - background-color: shift-color( $success, -55% ); - color: $black; -} - -.text-bg-info { - background-color: shift-color( $info, -55% ); - color: $black; -} - -.text-bg-warning { - background-color: shift-color( $warning, -55% ); - color: $black; -} - -.text-bg-danger { - background-color: shift-color( $danger, -55% ); - color: $black; +.badge { + &[class$="-subtle"] { + color: #000; + } } ::selection { diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/patron-detail-tabs.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/patron-detail-tabs.inc index 4418f88548..24e01ea9b3 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/includes/patron-detail-tabs.inc +++ b/koha-tmpl/intranet-tmpl/prog/en/includes/patron-detail-tabs.inc @@ -50,7 +50,7 @@ ([% IF patron.return_claims.resolved.count == 0 %] [% patron.return_claims.resolved.count | html %] [% ELSE %] - [% patron.return_claims.resolved.count | html %] + [% patron.return_claims.resolved.count | html %] [% END %] [% IF patron.return_claims.unresolved.count == 0 %] [% patron.return_claims.unresolved.count | html %] diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/about.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/about.tt index 79478b30b6..9e9c58b0b1 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/about.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/about.tt @@ -130,10 +130,10 @@ Elasticsearch: [% IF elasticsearch_fatal_config_error %] - [% elasticsearch_fatal_config_error | html %] + [% elasticsearch_fatal_config_error | html %] [% ELSE %] [% IF elasticsearch_status.running %] - [% SET td_class="text-bg-info" %] + [% SET td_class="bg-info-subtle" %] [% END %] Version: @@ -152,7 +152,7 @@ (count: [% index.index_count | html %]) [% UNLESS loop.last %],[% END %] [% END %] [% ELSE %] - not running + not running [% END %] [% END # /IF elasticsearch_fatal_config_error %] @@ -161,7 +161,7 @@ Memcached: [% IF memcached_running AND is_memcached_still_active AND where_is_memcached_config == 'config_only' %] - [% SET td_class="text-bg-info" %] + [% SET td_class="bg-info-subtle" %] [% END %] Servers: @@ -181,9 +181,9 @@ Status: [% IF memcached_servers %] [% IF memcached_running and is_memcached_still_active %] - running. + running. [% ELSE %] - not running. + not running. [% IF is_psgi %] Remember memcached needs to be started before Plack. [% END %] @@ -195,14 +195,14 @@ Config read from: [% SWITCH where_is_memcached_config %] [% CASE 'config_only' %] - koha-conf.xml + koha-conf.xml [% CASE 'ENV_only' %] - ENV Note that the right place to define the memcached config is in your $KOHA_CONF file + ENV Note that the right place to define the memcached config is in your $KOHA_CONF file [% CASE 'both' %] - ENV and koha-conf.xml + ENV and koha-conf.xml Note that the right place to define the memcached config is in your $KOHA_CONF file. To avoid any misunderstanding you should not export the memcached config from ENV. [% CASE # nowhere %] - Nowhere Note that the right place to define the memcached config is in your $KOHA_CONF file. Currently you do not have a valid memcached configuration defined. + Nowhere Note that the right place to define the memcached config is in your $KOHA_CONF file. Currently you do not have a valid memcached configuration defined. [% END %] [% IF effective_caching_method != 'Cache::Memcached::Fast::Safe' %] | Effective caching method: [% effective_caching_method | html %] @@ -216,22 +216,22 @@ Zebra status: [% IF (errZebraConnection == 10000) %] - Zebra server seems not to be available. Is it started? + Zebra server seems not to be available. Is it started? [% ELSIF (errZebraConnection) %] - Error message from Zebra: [% ( errZebraConnection ) | html %] + Error message from Zebra: [% ( errZebraConnection ) | html %] [% ELSE %] - Running + Running [% END %] Message broker: [% IF warnConnectBroker %] - Using SQL polling (Fallback, Error connecting to RabbitMQ) + Using SQL polling (Fallback, Error connecting to RabbitMQ) [% ELSE %] [% IF Koha.Preference('JobsNotificationMethod') == 'polling' %] - Using SQL polling + Using SQL polling [% ELSE %] - Using RabbitMQ + Using RabbitMQ [% END %] [% END %] @@ -240,8 +240,8 @@ [% current_date_and_time | $KohaDates with_hours => 1 %] - [% timezone_config_class = (time_zone.config_invalid) ? 'text-bg-warning' : '' %] - [% timezone_env_class = (time_zone.env_invalid) ? 'text-bg-warning' : '' %] + [% timezone_config_class = (time_zone.config_invalid) ? 'bg-warning-subtle' : '' %] + [% timezone_env_class = (time_zone.env_invalid) ? 'bg-warning-subtle' : '' %] Time zone: Used: [% time_zone.actual | html %] diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/catalogue/detail.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/catalogue/detail.tt index 801f7dad1e..76c6a59e66 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/catalogue/detail.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/catalogue/detail.tt @@ -188,7 +188,7 @@ [% IF ( holdcount ) %] Holds: - + [% IF CAN_user_reserveforothers_place_holds %] [% holdcount | html %] [% ELSE %] @@ -216,7 +216,7 @@ [% IF ( article_requests_count = biblio.article_requests.filter_by_current.count ) %] Article requests: - + [% article_requests_count | html %] diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tt index d2b1f67678..efb2c1fe8c 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tt @@ -1395,7 +1395,7 @@ [% IF issues_count %] Checkouts: - + [% issues_count | html %] diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/members/member.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/members/member.tt index 318f56a688..a1b52e1615 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/members/member.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/members/member.tt @@ -56,7 +56,7 @@ [% IF CAN_user_borrowers_edit_borrowers && pending_borrower_modifications %] [% END %] diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/onboarding/onboardingstep2.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/onboarding/onboardingstep2.tt index ff989d4914..9fad050e02 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/onboarding/onboardingstep2.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/onboarding/onboardingstep2.tt @@ -46,7 +46,7 @@
-

The patron category you create will be used by the administrator account.

+

The patron category you create will be used by the administrator account.

[% INCLUDE 'csrf-token.inc' %] diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/reserve/request.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/reserve/request.tt index 558b5e0d9f..a8f2352b80 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/reserve/request.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/reserve/request.tt @@ -1243,7 +1243,7 @@ [% IF ( multi_hold ) %]

[% biblioloo.title | html %] - [% biblioloo.reserveloop.size | html %] [% tn('Hold', 'Holds', biblioloo.reserveloop.size) | $raw %] + [% biblioloo.reserveloop.size | html %] [% tn('Hold', 'Holds', biblioloo.reserveloop.size) | $raw %]

[% END %] diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/suggestion/suggestion.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/suggestion/suggestion.tt index c50da2d860..a1d20adba3 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/suggestion/suggestion.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/suggestion/suggestion.tt @@ -837,7 +837,7 @@ [% END %]
[% IF ( s.note ) %] -
[% s.note | html %]
+
[% s.note | html %]
[% END %] [% IF s.archived %]
Archived diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/tools-home.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/tools-home.tt index bf1d14de86..3aa18b3963 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/tools-home.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/tools-home.tt @@ -47,7 +47,7 @@
Comments [% IF ( pendingcomments ) %] - [% pendingcomments | html %] + [% pendingcomments | html %] [% END %]
Moderate patron comments
@@ -92,7 +92,7 @@
Tags [% IF ( pendingtags ) %] - [% pendingtags | html %] + [% pendingtags | html %] [% END %]
Moderate patron tags
diff --git a/koha-tmpl/intranet-tmpl/prog/js/checkouts.js b/koha-tmpl/intranet-tmpl/prog/js/checkouts.js index f11f755964..47dd62836d 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/checkouts.js +++ b/koha-tmpl/intranet-tmpl/prog/js/checkouts.js @@ -1557,17 +1557,6 @@ $(document).ready(function () { let resolved = json.resolved; let unresolved = json.unresolved; - if (resolved > 0) { - $("#return-claims-count-resolved") - .text(resolved) - .removeClass("text-bg-info") - .addClass("text-bg-success"); - } else { - $("#return-claims-count-resolved") - .text(resolved) - .removeClass("text-bg-success") - .addClass("text-bg-info"); - } if (unresolved > 0) { $("#return-claims-count-unresolved") .text(unresolved) diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt index 8a90f4de21..18464a136e 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt +++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt @@ -446,7 +446,7 @@ [% ISSUE.itemcallnumber | html %] [% IF ( OpacRenewalAllowed && !( logged_in_user.is_expired && logged_in_user.category.effective_BlockExpiredPatronOpacActions_contains('renew') ) ) %] - [% IF ISSUE.renewed %]Renewed!
[% END %] + [% IF ISSUE.renewed %]Renewed!
[% END %] [% IF ( ISSUE.status ) %] [% IF ( canrenew ) %] -- 2.39.5