Similar gallery generation for try_updated_theme

environment.yml

@@ -13,3 +13,4 @@ dependencies:
 
 pip:
 - git+https://github.com/ProjectPythia/sphinx-pythia-theme.git@theme-update
+- sphinx_design #will remove when changed above theme install to PyPI or conda

portal/_extensions/gallery_generator.py

@@ -1,6 +1,5 @@
 import itertools
 import pathlib
-from textwrap import dedent
 
 from truncatehtml import truncate
 
@@ -67,15 +66,15 @@ def build_from_items(items, filename, title='Gallery', subtitle=None, subtext=No
     panels_body = []
     for item in items:
         if not item.get('thumbnail'):
-            item['thumbnail'] = '/_static/images/ebp-logo.png'
-        thumbnail = item['thumbnail']
+            item['thumbnail'] = '_static/images/ebp-logo.png'
+        thumbnail = item['thumbnail'][1:] if item['thumbnail'].startswith('/') else item['thumbnail']
         tag_list = sorted((itertools.chain(*item['tags'].values())))
         tag_list_f = [tag.replace(' ', '-') for tag in tag_list]
 
         tags = [f'<span class="badge bg-primary">{tag}</span>' for tag in tag_list_f]
         tags = '\n'.join(tags)
 
-        tag_class_str = ' '.join(tag_list_f)
+        # tag_class_str = ' '.join(tag_list_f)
 
         author_strs = set()
         affiliation_strs = set()
@@ -121,20 +120,19 @@ def build_from_items(items, filename, title='Gallery', subtitle=None, subtext=No
             </div>
             </div>
             """
+            modal_str = '\n'.join([m.lstrip() for m in modal_str.split('\n')])
         else:
             modal_str = ''
-
-        panels_body.append(
-            f"""\
+        new_panel = f"""\
             :::{{grid-item-card}}
-            :column: + tagged-card {tag_class_str}
-
+            :shadow: md
+            :class-footer: card-footer
             <div class="d-flex gallery-card">
             <img src="{thumbnail}" class="gallery-thumbnail" />
             <div class="container">
             <a href="{item["url"]}" class="text-decoration-none"><h4 class="display-4 p-0">{item["title"]}</h4></a>
             <p class="card-subtitle">{authors_str}<br/>{affiliations_str}</p>
-            <p class="my-2">{short_description}</p>
+            <p class="my-2">{short_description} </p>
             </div>
             </div>
             {modal_str}
@@ -143,36 +141,36 @@ def build_from_items(items, filename, title='Gallery', subtitle=None, subtext=No
 
             {tags}
 
-            ::::
+            :::
 
             """
-        )
+
+        panels_body.append('\n'.join([m.lstrip() for m in new_panel.split('\n')]))
 
     panels_body = '\n'.join(panels_body)
 
     stitle = f'#### {subtitle}' if subtitle else ''
     stext = subtext if subtext else ''
 
     panels = f"""\
-        # {title}
+        {title}
+        {'=' * len(title)}
 
         {stitle}
         {stext}
 
         {menu_html}
 
-        ````{{grid}}
-        :column: col-12
-        :card: +mb-4 w-100
-        :header: d-none
-        :body: p-3 m-0
-        :footer: p-1
+        ::::{{grid}} 1
+        :gutter: 4
 
-        {dedent(panels_body)}
+        {panels_body}
         ````
 
         <div class="modal-backdrop"></div>
         <script src="/_static/custom.js"></script>
     """
 
+    panels = '\n'.join([m.lstrip() for m in panels.split('\n')])
+
     pathlib.Path(f'{filename}.md').write_text(panels)

portal/_static/custom.css

@@ -1,10 +1,19 @@
+:root {
+  --pst-color-border: rgba(0, 0, 0, 0.125) !important;
+}
+
 .bd-main .bd-content .bd-article-container {
   max-width: 100%;  /* default is 60em */
 }
 .bd-page-width {
   max-width: 100%;  /* default is 88rem */
 }
 
+.sd-card-footer {
+  background: rgba(var(--spt-color-gray-100), 1) !important;
+  padding: 4px;
+}
+
 main.banner-main #project-pythia {
   padding-top: 1rem;
   padding-bottom: 1rem;
@@ -81,12 +90,22 @@ main.banner-main #project-pythia a.btn-light {
   margin: auto 0;
   padding: 0;
   max-width: 160px;
+  background: transparent !important;
 }
 
 .card-subtitle {
   font-size: 0.8rem;
 }
 
+.my-2 {
+  color: inherit;
+}
+
+.text-decoration-none {
+  text-decoration: none;
+  color: inherit;
+}
+
 @media (max-width: 576px) {
   .modal {
     padding: 2rem;

portal/conf.py

@@ -14,14 +14,8 @@
 # documentation root, use os.path.abspath to make it absolute, like shown here.
 #
 import os
-import pathlib
 import shutil
 import sys
-from textwrap import dedent, indent
-
-import yaml
-from sphinx.application import Sphinx
-from sphinx.util import logging
 
 sys.path.insert(0, os.path.abspath('_extensions'))
 
@@ -38,6 +32,7 @@
 # extensions coming with Sphinx (named 'sphinx.ext.*') or your custom
 # ones.
 extensions = [
+    'resource_gallery_generator',
     'myst_nb',
     'ablog',
     'sphinx.ext.intersphinx',
@@ -150,45 +145,3 @@
 # Blog configuration settings
 
 blog_post_pattern = ['posts/*.rst', 'posts/*.md']
-
-
-LOGGER = logging.getLogger('conf')
-
-
-# custom scripts for making a gallery of examples notebooks
-def update_gallery(app: Sphinx):
-    """Update the gallery of examples notebooks."""
-
-    notebooks = yaml.safe_load('resource_gallery.yaml')
-
-    LOGGER.info(notebooks)
-
-    items = [
-        f"""
-         .. grid-item-card::
-            :text-align: center
-
-            .. image:: {item['thumbnail']}
-                :alt: {item['title']}
-            +++
-            {item['title']}
-            """
-        for item in notebooks
-    ]
-
-    items_md = indent(dedent('\n'.join(items)), prefix='    ')
-    markdown = f"""
-.. grid:: 1 2 3 3
-    :gutter: 2
-
-    {items_md}
-    """
-
-    # pathlib.Path(app.srcdir, "notebook-examples.txt").write_text(markdown)
-
-    pathlib.Path('resource-gallery.md').write_text(markdown)
-
-
-# Allow for changes to be made to the css in the theme_overrides file
-def setup(app):
-    app.connect('builder-inited', update_gallery)