Render chemical formulas with proper subscript notation
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful

Adds a template filter that cleans up spaced-out formulas from scraping
and wraps subscript numbers in <sub> tags for proper display.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-30 22:13:19 +03:00
parent 44e2420c29
commit 6695e7e8ab
3 changed files with 42 additions and 3 deletions

View File

@@ -1,6 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
{% load chem %}
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% if mineral %}{{ mineral.name }} — Daily Stone{% else %}Daily Stone{% endif %}</title> <title>{% if mineral %}{{ mineral.name }} — Daily Stone{% else %}Daily Stone{% endif %}</title>
@@ -98,10 +99,17 @@
.formula { .formula {
font-size: 1.15rem; font-size: 1.15rem;
font-family: 'Courier New', monospace; font-family: 'Georgia', serif;
color: var(--text-secondary); color: var(--text-secondary);
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
letter-spacing: 0.02em; letter-spacing: 0.03em;
}
.formula sub {
font-size: 0.7em;
vertical-align: baseline;
position: relative;
top: 0.3em;
} }
/* Photo gallery */ /* Photo gallery */
@@ -312,7 +320,7 @@
</a> </a>
<div class="label">{% if is_random %}Random Stone{% else %}Daily Stone{% endif %}</div> <div class="label">{% if is_random %}Random Stone{% else %}Daily Stone{% endif %}</div>
<h1 class="mineral-name">{{ mineral.name }}</h1> <h1 class="mineral-name">{{ mineral.name }}</h1>
{% if mineral.formula %}<div class="formula">{{ mineral.formula }}</div>{% endif %} {% if mineral.formula %}<div class="formula">{{ mineral.formula|chem_formula }}</div>{% endif %}
<div class="date">{{ today|date:"F j, Y" }}</div> <div class="date">{{ today|date:"F j, Y" }}</div>
</header> </header>

View File

View File

@@ -0,0 +1,31 @@
import re
from django import template
from django.utils.html import escape
from django.utils.safestring import mark_safe
register = template.Library()
@register.filter
def chem_formula(value):
"""Render a chemical formula with proper subscript numbers."""
if not value:
return value
text = escape(value)
# Remove spaces around parentheses and brackets
text = re.sub(r'\s*\(\s*', '(', text)
text = re.sub(r'\s*\)\s*', ')', text)
text = re.sub(r'\s*\[\s*', '[', text)
text = re.sub(r'\s*\]\s*', ']', text)
# Remove spaces between a letter and a following number
text = re.sub(r'([A-Za-z])\s+(\d)', r'\1\2', text)
# Remove spaces between a number and a following letter
text = re.sub(r'(\d)\s+([A-Za-z])', r'\1\2', text)
# Remove spaces between closing paren/bracket and a number
text = re.sub(r'([)\]])\s+(\d)', r'\1\2', text)
# Normalize middot spacing
text = re.sub(r'\s*[·•]\s*', '·', text)
# Subscript numbers after letters or closing parens/brackets
text = re.sub(r'([A-Za-z)\]])(\d+)', r'\1<sub>\2</sub>', text)
return mark_safe(text)