From 0a5dbec79759cba07da5f062f2ac2e242228d1cf Mon Sep 17 00:00:00 2001
From: Owen Leonard <oleonard@myacpl.org>
Date: Wed, 3 Jan 2024 16:01:56 +0000
Subject: [PATCH] Bug 35689: Add id and classes to each MARC note in OPAC
 bibliographic details

Building on Bug 14156, this patch updates the OPAC bibliographic
detail page's display of MARC notes to add the tag number in both a
class (for consistent styling across the same tag number) and id (for
unique styling for each repeated tag).

To test:

- As a quick test for custom CSS, go to Administration -> System
  preferences and locate the OPACUserCSS preference.
  - Add this testing CSS:

   .marcnote { font-size:140%; font-family: serif; }
   .marcnote-500 { background-color: #66FFCC; }
   .marcnote-511 { background-color: #99FFFF; }
   .marcnote-520 { background-color: #CCFF00; }
   .marcnote-521 { background-color: #CCFFFF; }
   .marcnote-538 { background-color: #FFCCCC; }
   .marcnote-546 { background-color: #FFFFCC; }

- Locate a record with multiple notes fields. In the sample data, record
  46, "Viridiana" is a good example which works well with the above CSS.
- On the bibliographic detail page for the record, click the
  "Descriptions" tab.
  - Each MARC note should be colored according to the tag it comes from.
  - Inspect the HTML to confirm that each paragraph also has its own
    unique ID.

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
Signed-off-by: Kyle M Hall <kyle@bywatersolutions.com>
Signed-off-by: Katrin Fischer <katrin.fischer@bsz-bw.de>
(cherry picked from commit dfd4894acbab3af5355b72c859a0a17deef70af5)
Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>
---
 .../opac-tmpl/bootstrap/en/modules/opac-detail.tt    | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt
index 789244f9d3..8d197b0627 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt
@@ -597,12 +597,12 @@
                                     [% IF ( MARCNOTES ) %]
                                         <div id="marcnotes">
                                             [% FOREACH MARCNOTE IN MARCNOTES %]
-                                                <p>
-                                                [% IF MARCNOTE.marcnote.match('^https?://\S+$') %]
-                                                    <a href="[% MARCNOTE.marcnote | url %]">[% MARCNOTE.marcnote | html %]</a>
-                                                [% ELSE %]
-                                                    [% MARCNOTE.marcnote | html | html_line_break %]
-                                                [% END %]
+                                                <p class="marcnote marcnote-[% MARCNOTE.tag | html %]" id="marcnote-[% MARCNOTE.tag | html %]-[% loop.count | html %]">
+                                                    [% IF MARCNOTE.marcnote.match('^https?://\S+$') %]
+                                                        <a href="[% MARCNOTE.marcnote | url %]">[% MARCNOTE.marcnote | html %]</a>
+                                                    [% ELSE %]
+                                                        [% MARCNOTE.marcnote | html | html_line_break %]
+                                                    [% END %]
                                                 </p>
                                             [% END %]
                                         </div>
-- 
2.39.5