wip: landing page

Author: agoose77

portal/index.md

@@ -1,20 +1,27 @@
-# Project Pythia
+---
+site:
+  hide_outline: true
+  hide_toc: true
+  hide_title_block: true
+---
+
++++ {"class": "split-image"}
 
-:::{banner}
-:color: rgba(26, 100, 143, 0.9)
-:image: _static/images/backgrounds/pexels-jeff-stapleton-5792818.jpg
+## Project Pythia
+
+:::{image} _static/images/backgrounds/pexels-jeff-stapleton-5792818.jpg
 :caption: Photo by Jeff Stapleton from Pexels
-:class: dark-banner
 :::
 
-<span style="font-size: 2.6rem;">An education and training hub for the geoscientific Python community</span>
+An education and training hub for the geoscientific Python community
+
+Project Pythia is hosting a Cookbook Cook-Off June 11-14, 2024. {button}`Cookbook Cook-Off<https://projectpythia.org/pythia-cookoff-2024>`
 
-<a href="https://projectpythia.org/pythia-cookoff-2024/" role="button" class="btn btn-light btn-lg" style="display: flex; align-items: center; font-weight: 600; text-decoration: none; background-color: #ccc; border: rgba(var(--spt-color-dark), 1);">
-         Project Pythia is hosting a Cookbook Cook-Off June 11-14, 2024.<br>
-         Learn more here.
- </a>
++++ { "class": "centered"}
 
-[Project Pythia](about) is the education working group for [Pangeo](https://pangeo.io)
+## What is Project Pythia?
+
+[Project Pythia](./about.md) is the education working group for [Pangeo](https://pangeo.io)
 and is an educational resource for the entire geoscience community.
 Together these initiatives are helping geoscientists make sense of huge volumes of
 numerical scientific data using tools that facilitate open, reproducible science,
@@ -24,63 +31,53 @@ around these goals.
 Project Pythia is a home for Python-centered learning resources that are _open-source_,
 _community-owned_, _geoscience-focused_, and _high-quality_.
 
-<span class="d-flex justify-content-center py-4">
-    <a href="about.html" role="button" class="btn btn-light btn-lg" style="display: flex; align-items: center; font-weight: 600; text-decoration: none;">
-        About <img src="./_static/images/logos/pythia_logo-blue-rtext.svg" alt="Project Pythia" height="35px" style="margin-left: 0.5rem;">
-    </a>
-    <div class="horizontalgap" style="width:70px"></div>
-    <a href="https://pangeo.io/about" role="button" class="btn btn-light btn-lg" style="display: flex; align-items: center; font-weight: 600; text-decoration: none;">
-        About <img src="https://raw.githubusercontent.com/pangeo-data/pangeo/master/docs/_static/small_e_logo_cropped.png" alt="Pangeo logo" height="35px" style="margin-left: 0.5rem;">
-        <img src="https://raw.githubusercontent.com/pangeo-data/pangeo/master/docs/_static/pangeo_simple_logo.svg" alt="Pangeo" height="22px">
-    </a>
-</span>
++++ { "class": "centered"}
 
 ## Start Learning
 
 Project Pythia has several resources for you to use to start learning how to use Python
 and the technology in the Python ecosystem for the geosciences.
 
-### The Foundations Book
+::::{grid} 1 2 2 3
+:::{card}
+:url: https://foundations.projectpythia.org
+:header: The Foundations Book
+:footer: Visit the Foundations Book »
 
 The [Pythia Foundations Book](https://foundations.projectpythia.org) is a
 [Jupyter Book](https://jupyterbook.org/) developed by the Pythia community to
 act as a **comprehensive set of tutorials** covering the **foundational skills**
 everyone needs to get started with **computing in the open-source Python ecosystem**.
 These foundational tutorials will serve as common references for more advanced and
 domain-specific content to be housed here in the Pythia Portal.
+:::
 
-<span class="d-flex justify-content-center pt-1 pb-3">
-    <a href="https://foundations.projectpythia.org" role="button" class="btn btn-primary btn-lg">
-        Read the Pythia Foundations Book
-    </a>
-</span>
-
-### Pythia Cookbooks
+:::{card}
+:url: https://cookbooks.projectpythia.org
+:header: Pythia Cookbooks
+:footer: Visit Pythia Cookbooks »
 
 Pythia Cookbooks are collections of more advanced and domain-specific example workflows building on top of Pythia Foundations.
+:::
 
-<span class="d-flex justify-content-center pt-1 pb-3">
-    <a href="https://cookbooks.projectpythia.org" role="button" class="btn btn-primary btn-lg">
-        Visit Pythia Cookbooks
-    </a>
-</span>
 
-### The Resource Gallery
+:::{card}
+:url: ./resource-gallery.md
+:header: The Resource Gallery
+:footer: Visit the Resource Gallery »
 
 There is a wealth of educational resources out there on the internet for learning
 Python and how to use it in the geosciences! We have attempted to gather together
 a curated and filterable list of these resources (including Pythia's own content)
 into our [Pythia Resource Gallery](/resource-gallery).
 Click the link below to see a hand-picked selection of resources for learning at
 your own pace.
+:::
 
-<span class="d-flex justify-content-center pt-1 pb-3">
-    <a href="/resource-gallery.html" role="button" class="btn btn-primary btn-lg">
-        Visit the Pythia Resource Gallery
-    </a>
-</span>
-
-### Webinar Tutorial Series
+:::{card}
+:url: https://ncar-xdev.github.io/status/tutorials.html
+:header: Webinar Tutorial Series
+:footer: Visit the Pythia Webinar Tutorial Series »
 
 The [Pythia Webinar Tutorial Series](https://ncar-xdev.github.io/status/tutorials.html) is hosted regularly by the Project Pythia team. Anyone can join
 these hour-long, instructor-led interactive tutorials. Participants can
@@ -89,67 +86,20 @@ the instructor. Each seminar is recorded for later viewing on the
 [Project Pythia YouTube channel](https://www.youtube.com/channel/UCoZPBqJal5uKpO8ZiwzavCw).
 Click the link below to view past and upcoming seminars, covering a range of
 topics from beginning to advanced.
+:::
 
-<span class="d-flex justify-content-center pt-1 pb-3">
-    <a href="https://ncar-xdev.github.io/status/tutorials.html" role="button" class="btn btn-primary btn-lg">
-        Visit the Pythia Webinar Tutorial Series
-    </a>
-</span>
-
-### Pythia Data Collection
+:::{card}
+:url: https://github.com/ProjectPythia/pythia-datasets
+:header: Pythia Data Collection
+:footer: Visit the Pythia Data Repository »
 
 Looking for a free, public domain geoscience data set that you can use to
 sharpen your skills while learning the Scientific Python Ecosystem? All of
 the example data used by the [Pythia Foundations Book](https://foundations.projectpythia.org) are freely accessible.
+:::
+::::
 
-<span class="d-flex justify-content-center pt-1 pb-3">
-    <a href="https://github.com/ProjectPythia/pythia-datasets" role="button" class="btn btn-primary btn-lg">
-        Visit the Pythia Data Repository
-    </a>
-</span>
-
-<!--
-<a href="/gallery.html">
-<div id="galleryCarousel" class="carousel carousel-dark slide py-4" data-bs-ride="carousel">
-    <div class="carousel-indicators">
-        <button type="button" data-bs-target="#galleryCarousel" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
-        <button type="button" data-bs-target="#galleryCarousel" data-bs-slide-to="1" aria-label="Slide 2"></button>
-        <button type="button" data-bs-target="#galleryCarousel" data-bs-slide-to="2" aria-label="Slide 3"></button>
-    </div>
-    <div class="carousel-inner">
-        <div class="carousel-item active">
-            <img src="_static/images/pexels-brett-sayles-1431822.jpg" height="200" width="400" class="d-block w-100" alt="1"/>
-            <div class="carousel-caption d-none d-md-block">
-                <h5>Slide 1</h5>
-                <p>This is Slide 1.</p>
-            </div>
-        </div>
-        <div class="carousel-item">
-            <img src="_static/images/pexels-pixabay-209831.jpg" height="200" width="400"  class="d-block w-100" alt="2"/>
-            <div class="carousel-caption d-none d-md-block">
-                <h5>Slide 2</h5>
-                <p>This is Slide 2.</p>
-            </div>
-        </div>
-        <div class="carousel-item">
-            <img src="_static/images/pexels-pixabay-531756.jpg" height="200" width="400"  class="d-block w-100" alt="3"/>
-            <div class="carousel-caption d-none d-md-block">
-                <h5>Slide 3</h5>
-                <p>This is Slide 3.</p>
-            </div>
-        </div>
-    </div>
-    <button class="carousel-control-prev" type="button" data-bs-target="#galleryCarousel" data-bs-slide="prev">
-        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
-        <span class="visually-hidden">Previous</span>
-    </button>
-    <button class="carousel-control-next" type="button" data-bs-target="#galleryCarousel" data-bs-slide="next">
-        <span class="carousel-control-next-icon" aria-hidden="true"></span>
-        <span class="visually-hidden">Next</span>
-    </button>
-</div>
-</a>
--->
++++ { "class": "centered"}
 
 ## Join us!
 
@@ -158,11 +108,7 @@ Pythia Team, please reach out to us through the [Project Pythia
 category on the Pangeo Discourse forum](https://discourse.pangeo.io/c/education/project-pythia/)
 or join us at any of our [Monthly Project Meetings](#monthly-pythia-meetings).
 
-<span class="d-flex justify-content-center pt-1 pb-4">
-    <a href="https://discourse.pangeo.io/c/education/project-pythia/" role="button" class="btn btn-primary btn-lg">
-        Go to Pangeo Discourse
-    </a>
-</span>
+{button}`Go to Pangeo Discourse<https://discourse.pangeo.io/c/education/project-pythia/>`
 
 ### Contributing
 
@@ -204,7 +150,7 @@ and [Outreach Meetings](https://docs.google.com/document/d/e/2PACX-1vQBAt5B24wig
 :::{iframe} https://calendar.google.com/calendar/embed?src=c_4qpvf316afd9mv0ci7d2uiafog%40group.calendar.google.com
 :::
 
-
++++ { "class": "centered"}
 ## How to Cite
 
 The material in Project Pythia is licensed for free and open consumption and reuse. All code is served under [Apache 2.0](https://www.apache.org/licenses/LICENSE-2.0), while all non-code content is licensed under [Creative Commons BY 4.0 (CC BY 4.0)](https://creativecommons.org/licenses/by/4.0/). Effectively, this means you are free to share and adapt this material so long as you give appropriate credit to the Project Pythia community.
@@ -215,16 +161,3 @@ To cite this project, please site our [NSF GEO OSE proposal](https://zenodo.org/
 
 [![DOI](https://zenodo.org/badge/DOI/10.5281/zenodo.8184298.svg)](https://doi.org/10.5281/zenodo.8184298)
 
-```{toctree}
----
-hidden: True
-maxdepth: 1
----
-about.md
-contributing.md
-cookbook-guide.md
-code_of_conduct.md
-resource-gallery.md
-blog.md
-metrics.md
-```