Try out different rendering scheme

[clausmichele]

To improve the notebooks preview, we could try out the way DestinE does it here: https://destination-earth.github.io/DestinE-DataLake-Gallery/hda/

They are using a different class for the notebooks blocks called notebook-card:

https://github.com/destination-earth/DestinE-DataLake-Gallery/blob/9063686e28f2ab874f0de8e665fd453eb25187ce/scripts/generate_gallery_md.py#L40

We need to adapt our script to use the same class, which would replace the default grids called via the gallery-grid here https://github.com/EOPF-Sample-Service/eopf-sample-notebooks/blob/main/generate_gallery.py#L361-L364

[Yuvraj198920]

hi @clausmichele,

Implementation Plan

• Phase 1 — Extract thumbnail from notebook YAML frontmatter in generate_gallery.py; propagate it through analyze_notebooks() and export_metadata_for_plugin() into .gallery-metadata.json
• Phase 2 — Add generate_notebook_card_html() function that builds <div class="notebook-card" data-tags="..."> HTML (horizontal layout: thumbnail left, title/subtitle/tags/link right); default thumbnail EOPF-on-bright-baseline.png used when none is set in frontmatter
• Phase 3 — Rewrite generate_gallery_pages() to replace {gallery-grid} directive blocks with inline HTML notebook-card blocks per subsection, preserving the existing tag-filter links already added
• Phase 4 — Add .notebook-card CSS to gallery.css (flex layout, border, hover transition, tag chip styles)