Bugzilla – Attachment 174936 Details for
Bug 38519
Improve contrast of Bootstrap alerts and text background classes
Home
|
New
|
Browse
|
Search
|
[?]
|
Reports
|
Help
|
New Account
|
Log In
[x]
|
Forgot Password
Login:
[x]
[patch]
Bug 38519: Improve contrast of Bootstrap alerts and text background classes
Bug-38519-Improve-contrast-of-Bootstrap-alerts-and.patch (text/plain), 17.05 KB, created by
Owen Leonard
on 2024-11-22 16:28:30 UTC
(
hide
)
Description:
Bug 38519: Improve contrast of Bootstrap alerts and text background classes
Filename:
MIME Type:
Creator:
Owen Leonard
Created:
2024-11-22 16:28:30 UTC
Size:
17.05 KB
patch
obsolete
>From 7d39c7a269d0f42573667517aad8de0034a67370 Mon Sep 17 00:00:00 2001 >From: Owen Leonard <oleonard@myacpl.org> >Date: Fri, 22 Nov 2024 12:05:20 +0000 >Subject: [PATCH] Bug 38519: Improve contrast of Bootstrap alerts and text > background classes > >This patch updates staff interface CSS in order to improve visibility >and contrast in Bootstrap alerts and text with background classes. > >Some of these changes are made via our custom _variables.scss file which >sets overrides of default Bootstrap classes. I was not able to figure >out a good way to customize the .text-bg-* classes via that method so >I've inserted those changes into staff-global.scss. > >The patch also removes our custom .note class because it can be replaced >with .alert.alert-info. > >To test, apply the patch and rebuild the staff interface CSS. > >- Clear your browser cache if necessary. >- View places where the updated classes can be found: > - For example: Administration -> Authorized values. Click a > category which has no saved values, e.g. Asort1. There should be two > "info" classed alerts: One showing "NOTE: If you changed an > authorized value..." and one showing "There are no authorized > values..." >- Other examples of pages which are updated to use "alert alert-info" > instead of the "note" class: > - Patron search where the search is limited by permissions, e.g. > Acquisitions -> Vendor -> Basket -> Add user. > - Administration -> Search engine configuration: "Warning: Any changes > to the configuration will only take effect..." >- See also pages where a count of something uses the text-bg-info class: > - Bibliographic detail page when the record has holds > - Patron module home page when there are pending modifications > - Tools home page when there are tags or comments pending approval > - A patron checkout screen when the Claims tab is present ( > BundleLostValue or ClaimReturnedLostValue prefs are set). > >Sponsored-by: Athens County Public Libraries >--- > .../prog/css/src/_variables.scss | 34 ++++++++---------- > .../prog/css/src/staff-global.scss | 36 ++++++++++++++++--- > .../prog/en/includes/patron-search.inc | 8 ++--- > .../en/modules/admin/authorised_values.tt | 4 +-- > .../searchengine/elasticsearch/mappings.tt | 2 +- > .../prog/en/modules/reserve/request.tt | 8 ++--- > .../en/modules/tools/batch_delete_records.tt | 4 +-- > .../modules/tools/batch_extend_due_dates.tt | 2 +- > .../tools/batch_record_modification.tt | 4 +-- > 9 files changed, 62 insertions(+), 40 deletions(-) > >diff --git a/koha-tmpl/intranet-tmpl/prog/css/src/_variables.scss b/koha-tmpl/intranet-tmpl/prog/css/src/_variables.scss >index 1cf18685d2..55d0bfab58 100644 >--- a/koha-tmpl/intranet-tmpl/prog/css/src/_variables.scss >+++ b/koha-tmpl/intranet-tmpl/prog/css/src/_variables.scss >@@ -301,14 +301,14 @@ $cyans: ( > // fusv-enable > > // scss-docs-start theme-color-variables >-$primary: $yellow; >-$secondary: $gray-600; >-$success: $green; >-$info: $blue-100; >-$warning: $yellow; >-$danger: $red; >-$light: #FFF; >-$dark: #352c2e; >+$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: $red; // $red !default; >+$light: #FFF; // $gray-100 !default; >+$dark: #352c2e; // $gray-900 !default; > // scss-docs-end theme-color-variables > > // scss-docs-start theme-colors-map >@@ -325,12 +325,12 @@ $theme-colors: ( > // scss-docs-end theme-colors-map > > // scss-docs-start theme-text-variables >-$primary-text-emphasis: shade-color($primary, 60%); >-$secondary-text-emphasis: shade-color($secondary, 60%); >-$success-text-emphasis: shade-color($success, 60%); >-$info-text-emphasis: shade-color($info, 60%); >-$warning-text-emphasis: $black; // shade-color($warning, 60%); >-$danger-text-emphasis: shade-color($danger, 60%); >+$primary-text-emphasis: $gray-900; // shade-color($primary, 60%); >+$secondary-text-emphasis: $gray-900; // shade-color($secondary, 60%); >+$success-text-emphasis: $gray-900; // shade-color($success, 60%); >+$info-text-emphasis: $gray-900; // shade-color($info, 60%); >+$warning-text-emphasis: $gray-900; // shade-color($warning, 60%); >+$danger-text-emphasis: $gray-900; // shade-color($danger, 60%); > $light-text-emphasis: $gray-700; > $dark-text-emphasis: $gray-700; > // scss-docs-end theme-text-variables >@@ -385,7 +385,7 @@ $enable-rfs: true; > $enable-validation-icons: true; > $enable-negative-margins: false; > $enable-deprecation-messages: true; >-$enable-important-utilities: true; >+$enable-important-utilities: false; > > $enable-dark-mode: true; > $color-mode-type: data; // `data` or `media-query` >@@ -1770,10 +1770,6 @@ $table-border-color: #BCBCBC; > $table-header-background: #FFF; > $table-odd-row: #f3f4f4; > >-// $body-bg: $white; >-// $body-color: $gray-900; >-// $body-text-align: null; >- > $default-bs-btn-bg: #FFF; > $default-bs-btn-border-color: #555; > $default-bs-btn-color: #555; >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 b43fe29c30..ce5344fb95 100644 >--- a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss >+++ b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss >@@ -78,6 +78,36 @@ $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; >+} >+ > ::selection { > background: $background-color-primary; > color: #FFFFFF; >@@ -554,11 +584,7 @@ div { > text-align: justify; > } > >- &.note { >- background-color: #CFE2FF; >- margin: .5em 0; >- padding: .5em; >- >+ &.alert-info { > i { > &.fa-exclamation { > color: $warning-text-color; >diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/patron-search.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/patron-search.inc >index 8233e70c54..03665362c7 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/includes/patron-search.inc >+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/patron-search.inc >@@ -130,13 +130,13 @@ > [% END %] > > [% IF filter == 'suggestions_managers' %] >- <div class="note">Only staff with superlibrarian or full suggestions permissions are returned in the search results</div> >+ <div class="alert alert-info">Only staff with superlibrarian or full suggestions permissions are returned in the search results</div> > [% ELSIF filter == 'orders_managers' OR filter == 'baskets_managers' %] >- <div class="note">Only staff with superlibrarian or acquisitions permissions (or order_manage permission if granular permissions are enabled) are returned in the search results</div> >+ <div class="alert alert-info">Only staff with superlibrarian or acquisitions permissions (or order_manage permission if granular permissions are enabled) are returned in the search results</div> > [% ELSIF filter == 'funds_owners' OR filter == 'funds_users' %] >- <div class="note">Only staff with superlibrarian or acquisitions permissions (or budget_modify permission if granular permissions are enabled) are returned in the search results</div> >+ <div class="alert alert-info">Only staff with superlibrarian or acquisitions permissions (or budget_modify permission if granular permissions are enabled) are returned in the search results</div> > [% ELSIF filter == 'erm_users' %] >- <div class="note">Only staff with superlibrarian or ERM permissions are returned in the search results</div> >+ <div class="alert alert-info">Only staff with superlibrarian or ERM permissions are returned in the search results</div> > [% END %] > > <div class="browse"> >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/authorised_values.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/authorised_values.tt >index 2bfb4f3f7f..345f6cf8a9 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/authorised_values.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/authorised_values.tt >@@ -122,7 +122,7 @@ > </h1> > > [% IF ( action_modify ) %] >- <div class="note"> >+ <div class="alert alert-info"> > <i class="fa fa-exclamation"></i> <strong>NOTE:</strong> If you change an authorized value code, existing records using it won't be updated. Changes to value descriptions will show immediately. > </div> > [% END %] >@@ -230,7 +230,7 @@ > [% END %] > > [% IF ( searchfield ) %] >- <div class="note"> >+ <div class="alert alert-info"> > <i class="fa fa-exclamation"></i> <strong>NOTE:</strong> If you change an authorized value code, existing records using it won't be updated. Changes to value descriptions will show immediately. > </div> > [% END %] >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/searchengine/elasticsearch/mappings.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/searchengine/elasticsearch/mappings.tt >index b32a11b63f..cd7958315e 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/searchengine/elasticsearch/mappings.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/searchengine/elasticsearch/mappings.tt >@@ -103,7 +103,7 @@ a.add, a.delete { > </div> > [% END %] > >- <div class="note"> >+ <div class="alert alert-info"> > <i class="fa fa-exclamation"></i> > <strong>Warning:</strong> Any changes to the configuration will only take effect after a full reindex. Until then searching may not work correctly. > >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 2fcc09479f..6737e50b3e 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/reserve/request.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/reserve/request.tt >@@ -1289,7 +1289,7 @@ > [% END %] > [% branchcodes = branchcodes.unique %] > [% IF ( branchcodes.empty ) %] >- <div class="note"> >+ <div class="alert alert-info"> > There are no holds on this title. > </div> > [% ELSE %] >@@ -1319,7 +1319,7 @@ > [% END %] > [% itemtypes = itemtypes.unique %] > [% IF ( itemtypes.empty ) %] >- <div class="note"> >+ <div class="alert alert-info"> > There are no holds on this title. > </div> > [% ELSE %] >@@ -1352,7 +1352,7 @@ > [% END %] > [% branchcodes = branchcodes.unique %] > [% IF ( branchcodes.empty ) %] >- <div class="note"> >+ <div class="alert alert-info"> > There are no holds on this title. > </div> > [% ELSE %] >@@ -1403,7 +1403,7 @@ > [% IF ( biblioloo.reserveloop.size ) %] > [% INCLUDE holds_table.inc holds=biblioloo.reserveloop %] > [% ELSE %] >- <div class="note"> >+ <div class="alert alert-info"> > There are no holds on this title. > </div> > [% END %] >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/batch_delete_records.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/batch_delete_records.tt >index 0de1cc5295..668fd19aa0 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/batch_delete_records.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/batch_delete_records.tt >@@ -193,7 +193,7 @@ > [% END %] > </tbody> > </table> >- <div class="note"><i class="fa fa-exclamation"></i> Reminder: this action will delete all selected bibliographic records, attached subscriptions, existing holds, and attached items!</div> >+ <div class="alert alert-info"><i class="fa fa-exclamation"></i> Reminder: this action will delete all selected bibliographic records, attached subscriptions, existing holds, and attached items!</div> > [% ELSE %] > <div class="btn-toolbar selections-toolbar"> > <a id="selectall" href="#"><i class="fa fa-check"></i> Select all</a> >@@ -222,7 +222,7 @@ > [% END %] > </tbody> > </table> >- <div class="note"><i class="fa fa-exclamation"></i> Reminder: this action will delete all selected authorities!</div> >+ <div class="alert alert-info"><i class="fa fa-exclamation"></i> Reminder: this action will delete all selected authorities!</div> > [% END %] > <fieldset class="action"> > [% INCLUDE 'csrf-token.inc' %] >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/batch_extend_due_dates.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/batch_extend_due_dates.tt >index aa7161ada7..f69313bd07 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/batch_extend_due_dates.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/batch_extend_due_dates.tt >@@ -195,7 +195,7 @@ > </tbody> > </table> <!-- /#checkouts --> > </div> <!-- /.page-section --> >- <div class="note"><i class="fa fa-exclamation"></i> Reminder: this action will modify all selected checkouts!</div> >+ <div class="alert alert-info"><i class="fa fa-exclamation"></i> Reminder: this action will modify all selected checkouts!</div> > <fieldset class="action"> > <input type="hidden" name="op" value="cud-modify" /> > <input type="hidden" name="new_hard_due_date" value="[% new_hard_due_date | $KohaDates dateformat => 'iso' %]" /> >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/batch_record_modification.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/batch_record_modification.tt >index 62ec796fd1..8a748d5001 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/batch_record_modification.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/batch_record_modification.tt >@@ -226,7 +226,7 @@ > </tbody> > </table> <!-- /#biblios --> > </div> >- <div class="note"><i class="fa fa-exclamation"></i> Reminder: this action will modify all selected biblios!</div> >+ <div class="alert alert-info"><i class="fa fa-exclamation"></i> Reminder: this action will modify all selected biblios!</div> > [% ELSE %] > <div class="btn-toolbar selections-toolbar"> > <a id="selectall" href="#"><i class="fa fa-check"></i> Select all</a> >@@ -254,7 +254,7 @@ > </tbody> > </table> <!-- /#authorities --> > </div> >- <div class="note"><i class="fa fa-exclamation"></i> Reminder: this action will modify all selected authorities!</div> >+ <div class="alert alert-info"><i class="fa fa-exclamation"></i> Reminder: this action will modify all selected authorities!</div> > [% END %] > <fieldset class="action"> > <input type="hidden" name="op" value="cud-modify" /> >-- >2.39.5
<b>You cannot view the attachment while viewing its details because your browser does not support IFRAMEs. <a href="attachment.cgi?id=174936">View the attachment on a separate page</a>.</b>
View Attachment As Diff
View Attachment As Raw
Actions:
View
|
Diff
|
Splinter Review
Attachments on
bug 38519
:
174934
|
174935
|
174936
|
174996
|
175570