from pathlib import Path
from urllib.parse import quote
from IPython.display import display, HTML

pdf_dir = Path("_static/literature_pdfs")
thumb_dir = Path("_static/literature_thumbs")

pdf_files = sorted(pdf_dir.glob("*.pdf"))

cards = []
for pdf_path in pdf_files:
    title = pdf_path.stem.replace("_", " ")
    
    pdf_href = f"../_static/literature_pdfs/{quote(pdf_path.name)}"
    img_src = f"../_static/literature_thumbs/{quote(pdf_path.stem)}.png"

    card = f"""
    <div style="width:220px; text-align:center; margin:15px;">
        <a href="{pdf_href}" target="_blank" style="text-decoration:none; color:inherit;">
            <img src="{img_src}" style="width:180px; border:1px solid #ccc; box-shadow:2px 2px 8px rgba(0,0,0,0.15);">
            <div style="margin-top:10px; font-size:14px; word-break:break-word;">{title}</div>
        </a>
    </div>
    """
    cards.append(card)

html = f"""
<div style="display:flex; flex-wrap:wrap; gap:10px;">
    {''.join(cards)}
</div>
"""

display(HTML(html))