Make Strong's numbers clickable links to Bible Hub lexicon

Add clickable links to Strong's numbers on interlinear pages:
- Parse Strong's numbers (G#### or H####) and link to Bible Hub
- Greek words link to biblehub.com/greek/{num}.htm
- Hebrew words link to biblehub.com/hebrew/{num}.htm
- Open in new tab with rel="noopener noreferrer"
- Style links with dotted underline that becomes solid on hover
- Support both light and dark mode styling

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-11-22 15:17:37 -05:00
parent ae65209864
commit 488f833063
+33 -1
View File
@@ -82,6 +82,18 @@
font-weight: 600;
}
.word-strongs a {
color: inherit;
text-decoration: none;
border-bottom: 1px dotted currentColor;
transition: all 0.2s;
}
.word-strongs a:hover {
border-bottom-style: solid;
opacity: 0.8;
}
.word-english {
font-size: 1rem;
color: #111;
@@ -295,6 +307,10 @@
color: #6699ff;
}
.word-strongs a {
color: #6699ff;
}
.word-english {
color: #ddd;
}
@@ -407,6 +423,10 @@
color: #6699ff;
}
[data-theme="dark"] .word-strongs a {
color: #6699ff;
}
[data-theme="dark"] .word-english {
color: #ddd;
}
@@ -520,7 +540,19 @@
<div class="word-position">#{{ word.position }}</div>
<div class="word-original">{{ word.original }}</div>
<div class="word-transliteration">{{ word.transliteration }}</div>
<div class="word-strongs">{{ word.strongs }}</div>
<div class="word-strongs">
{% if word.strongs %}
{% set lang = word.strongs[0]|lower %}
{% set num = word.strongs[1:] %}
{% if lang == 'g' %}
<a href="https://biblehub.com/greek/{{ num }}.htm" target="_blank" rel="noopener noreferrer">{{ word.strongs }}</a>
{% elif lang == 'h' %}
<a href="https://biblehub.com/hebrew/{{ num }}.htm" target="_blank" rel="noopener noreferrer">{{ word.strongs }}</a>
{% else %}
{{ word.strongs }}
{% endif %}
{% endif %}
</div>
<div class="word-english">{{ word.english }}</div>
<div class="word-parsing">{{ word.parsing }}</div>
<div class="word-definition">{{ word.definition }}</div>