Update web/templates/entry_view.html

This commit is contained in:
Joshua Laymon 2025-08-24 00:58:33 +00:00
parent e9171553fa
commit 20e0d593bb

View File

@ -216,7 +216,14 @@
border-color:#c9def5;
}
/* Light gray highlight for search hits */
/* Subject chip gets a hit → color the whole pill */
.chip-subject.chip-hit{
background:#f8e3c5; /* your chosen highlight color */
border-color:#e0b98e;
color:#111;
}
/* Light gray (peach) highlight for inline text hits */
.mark-hit {
background: #f8e3c5;
border-radius: 3px;
@ -467,7 +474,7 @@ function showToast(message, duration = 3000) {
}
</script>
<!-- Highlighter: apply to ALL fields (ignores selected fields) -->
<!-- Highlighter: apply to ALL fields; for Subjects, color the whole chip instead of inline marks -->
<script>
(function(){
// Target EVERY field we render on entry_view
@ -557,7 +564,17 @@ function showToast(message, duration = 3000) {
if (!needle) return;
const re = new RegExp(escapeRegExp(needle), "gi");
// Snapshot text nodes first to avoid modifying while walking
// Special handling for SUBJECT chips: color the whole chip, no <mark> injection
if (root.id === "subject-list") {
root.querySelectorAll(".chip-subject, .chip-muted").forEach(chip => {
if (re.test(chip.textContent || "")) {
chip.classList.add("chip-hit");
}
});
return; // do not inject <mark> inside subject chips
}
// Normal inline highlighting for text fields
const nodes = [];
const walker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT, null, false);
while (walker.nextNode()) nodes.push(walker.currentNode);
@ -571,7 +588,7 @@ function showToast(message, duration = 3000) {
text.replace(re, (m, idx) => {
if (idx > lastIndex) frag.appendChild(document.createTextNode(text.slice(lastIndex, idx)));
const mark = document.createElement("mark");
mark.className = "mark-hit"; // uses your existing gray style
mark.className = "mark-hit"; // uses your peach highlight
mark.textContent = m;
frag.appendChild(mark);
lastIndex = idx + m.length;
@ -585,11 +602,4 @@ function showToast(message, duration = 3000) {
})();
</script>
{% endblock %}