|
|
| Line 933: |
Line 933: |
| } | | } |
|
| |
|
| // CHANGED: was targeting .gra-hl-active — the WRONG class. That one is | | // REMOVED: injectAnnotationCss(), which JS-injected a defensive |
| // used by scrollToHighlight (panel card clicked -> scrolls to text in
| | // .gra-card-active/.gra-hl-active rule here as a guess, since the real |
| // the document), which was already working correctly. The actual | | // gr_annotations.css wasn't available at the time. Now that it is, |
| // reported gap is the OTHER direction — clicking a footnote/bookmark
| | // confirmed precisely: .gra-hl-active already had working CSS for |
| // IN THE DOCUMENT should scroll to and flash-highlight the | | // notes and footnotes (that JS rule was unneeded there, though it did |
| // corresponding card in the panel — and that direction uses a | | // fill a real gap for bookmarks' .gra-hl-active, which had none at |
| // DIFFERENT class, .gra-card-active (see the three highlight click | | // all) — and .gra-card-active genuinely only had a rule for |
| // handlers above). Confirmed directly: the note, bookmark, and
| | // .gra-note-card, nothing for bookmark or footnote cards, confirming |
| // footnote click handlers are structurally identical in code (same | | // that diagnosis exactly. The JS version also risked overriding the |
| // addClass/scrollIntoView/removeClass sequence) — the gap can only be
| | // existing, working note-card style with !important. Fixed directly |
| // CSS, most likely .gra-card-active having a rule scoped to
| | // in gr_annotations.css instead — see that file. |
| // .gra-note-card (the oldest, most established of the three) but no | |
| // matching rule for .gra-bookmark-card or .gra-footnote-card. This
| |
| // rule is unconditional across all three card classes. | |
| function injectAnnotationCss() { | |
| if (document.getElementById('gra-hl-active-css')) return;
| |
| var css = [
| |
| '.gra-hl-active{background:#fff176!important;border-radius:2px;box-shadow:0 0 0 2px #ffb300!important;transition:background 0.3s,box-shadow 0.3s;}',
| |
| '.gra-note-card.gra-card-active,.gra-bookmark-card.gra-card-active,.gra-footnote-card.gra-card-active{background:#fdf0eb!important;box-shadow:0 0 0 2px #b5451b!important;transition:background 0.3s,box-shadow 0.3s;}',
| |
| ].join('\n');
| |
| var style = document.createElement('style');
| |
| style.id = 'gra-hl-active-css';
| |
| style.textContent = css;
| |
| document.head.appendChild(style);
| |
| }
| |
|
| |
|
| $(function() { | | $(function() { |
| Line 964: |
Line 950: |
| _mobile = window.innerWidth < 768 || 'ontouchstart' in window; | | _mobile = window.innerWidth < 768 || 'ontouchstart' in window; |
| }); | | }); |
| injectAnnotationCss();
| |
| buildDom(); | | buildDom(); |
| wireEvents(); | | wireEvents(); |