Add images, updated content

Author: LanesGood

docs/src/img/downloaddeploy.png

@@ -192,7 +192,7 @@ section + section {
 }
 
 .dark-section {
-  background: var(--md-default-fg-color);
+  background: #2e2b2b;
   color: var(--md-default-bg-color);
 }
 
@@ -263,6 +263,7 @@ section + section {
   flex-flow: column nowrap;
   margin: 1rem 0;
   gap: 1rem;
+  position: relative;
 }
 .figure-collection figure img {
   max-width: 100%;
@@ -274,13 +275,17 @@ section + section {
 
 .centered {
   margin: 0 auto;
+  padding: 0 0.75rem;
 }
 .logo-grid {
   align-items: center;
 }
 .logo-grid figure {
   mix-blend-mode: luminosity;
 }
+a > img {
+  max-width: 100%;
+}
 
 @media screen and (min-width: 40em) {
   .tx-hero {
@@ -303,10 +308,27 @@ section + section {
     max-width: 60ch;
     font-size: 1rem;
   }
-
   .feature-grid {
     grid-template-columns: repeat(var(--cols), minmax(10px, 1fr));
   }
+  .figure-collection figure img {
+    max-width: 75%;
+    align-self: center;
+  }
+  #eoapi-benefits.figure-collection figure:last-of-type:after {
+    display: block;
+    position: absolute;
+    content: '';
+    height: clamp(6rem, 14vw, 12rem);
+    width: 50vw;
+    background: var(--md-primary-fg-color);
+    mix-blend-mode: multiply;
+    border-radius: 0 0.5rem 0.5rem 0;
+    pointer-events: none;
+    z-index: -1;
+    bottom: 12rem;
+    left: -20vw;
+  }
 
   .width-160 {
     max-width: 160ch;
@@ -317,13 +339,38 @@ section + section {
   .tx-hero {
     padding: 4rem 1rem 6rem;
   }
+  .centered {
+    padding: 0;
+  }
   .figure-collection figure {
     flex-flow: row nowrap;
     justify-content: flex-start;
+    gap: 2rem;
+    align-items: center;
   }
 
   .figure-collection figure > * {
     flex: 1;
+    flex-shrink: 0;
+  }
+
+  .figure-collection figure img {
+    max-width: 50%;
+  }
+  #eoapi-benefits.figure-collection figure:nth-of-type(even) img {
+    margin-right: -5rem;
+    max-width: 100%;
+  }
+  #eoapi-benefits.figure-collection figure:nth-of-type(odd) img {
+    margin-left: -5rem;
+    max-width: 100%;
+  }
+  #eoapi-benefits.figure-collection figure:last-of-type:after {
+    bottom: 2rem;
+    left: -30vw;
+  }
+  .figure-collection figure:nth-of-type(even) img {
+    order: 1;
   }
 
   .figure-collection figure > :first-child {

docs/src/img/eoapi_veda.png

@@ -15,7 +15,7 @@
                     <h1>Earth Observation Data at Scale</h1>
                     <h1>Deployed in minutes</h1>
                     <p class="lead">eoAPI makes massive earth observation (EO) data archives discoverable and
-                        interoperable. The fastest and easiest way to configure, customize, and deploy a full Earth
+                        interoperable—the fastest and easiest way to configure, customize, and deploy a full Earth
                         Observation stack.</p>
                     <div class="button-wrapper">
                         <a href="{{ page.next_page.url | url }}" title="Get Started"
@@ -35,9 +35,9 @@ <h1>Deployed in minutes</h1>
                     </div>
                     <p class="media-attribution"><a title="Learn about the author"
                             href="https://www.flickr.com/photos/nasamarshall/5091372229"> <span class="twemoji">
-                            {% include ".icons/material/information-outline.svg" %}
-                        </span><strong>Photo
-                            ©NASA</strong></a>
+                                {% include ".icons/material/information-outline.svg" %}
+                            </span><strong>Photo
+                                ©NASA</strong></a>
                     </p>
 
                 </div>
@@ -56,10 +56,10 @@ <h2>State-of-the-art services to enable <mark>data discovery</mark>, <mark>searc
                         <a href="#what-is-eoapi" class="headerlink" title="Permanent link"> ¶ </a>
                     </h2>
                 </header>
-                <p class="md-typeset lead">eoAPI presents an open-source and reusable framework for exploiting earth
+                <p class="md-typeset lead">eoAPI presents an open-source and reusable framework for harnessing earth
                     observation data. eoAPI takes the work out of constructing a cloud-native EO infrastructure through
                     a set of intelligent defaults that fit most EO and geospatial infrastructure needs. Built with
-                    modularity as a core principal, eoAPI can be easily customized to your specific needs.</p>
+                    modularity as a core principle, eoAPI can easily be customized to your needs.</p>
             </div>
             <div class="md-content__inner">
                 <ul class="feature-grid" style="--cols: 3;">
@@ -78,7 +78,8 @@ <h3>STAC Powered</h3>
                                 {% include ".icons/material/folder-home.svg" %}
                             </span>
                             <h3>Intelligent Customizable Defaults</h3>
-                            <p>Seamless deployment, configuration, and customization, while preserving flexibility.</p>
+                            <p>Seamless deployment, configuration, and customization while preserving flexibility.
+                            </p>
                         </article>
                     </li>
                     <li class="feature-tout">
@@ -87,7 +88,7 @@ <h3>Intelligent Customizable Defaults</h3>
                                 {% include ".icons/material/cloud-braces.svg" %}
                             </span>
                             <h3>Cloud agnostic</h3>
-                            <p>Quickly deploy, configure and scale EO services. Deploy anywhere.</p>
+                            <p>Quickly deploy, configure, and scale EO services. Deploy anywhere.</p>
                         </article>
                     </li>
                 </ul>
@@ -111,10 +112,10 @@ <h3>
                                     Catalog Cloud Data
                                 </h3>
                                 <h5>
-                                    pgSTAC Database
+                                    pgSTAC
                                 </h5>
-                                <p>pg-STAC is an optimized Postgres schema to index and search large-scale
-                                    Spatio-Temporal Asset Catalog (STAC) collections.
+                                <p>pg-STAC is an optimized Postgres schema to index and search large-scale STAC
+                                    collections.
                                 <p>
                                     <a href="https://github.com/stac-utils/pgstac">stac-utils/pgstac</a>
                             </div>
@@ -176,37 +177,30 @@ <h5>
         <div class="md-grid" data-md-component="content">
             <div class="md-content__inner">
                 <header class="md-typeset">
-                    <h5 id="eoapi-benefits" class="supheading">harness eoapi benefits</h5>
+                    <h5 class="supheading">harness eoapi benefits</h5>
                 </header>
-                <div class="figure-collection">
+                <div class="figure-collection" id="eoapi-benefits">
                     <figure>
-                        <a href="how-to-guides/huggingface/pipeline/nlp/translation/">
-                            <img src="https://placehold.co/600x300" alt="Alt text" loading="lazy">
-                        </a>
+                        <img src="../img/downloaddeploy.png" alt="Download eoAPI and deploy anywhere" loading="lazy">
                         <figcaption class="md-typeset">
-                            <h2>Step 1: Download and Deploy</h2>
+                            <h2>Download and Deploy</h2>
                             <p>Get started by downloading all the eoAPI resources you need. With our easy-to-follow
                                 guides and documentation, you'll have eoAPI up and running in minutes.</p>
                         </figcaption>
                     </figure>
                     <figure>
-                        <a href="how-to-guides/huggingface/pipeline/nlp/translation/" title="GUI"
-                            style="--figureOrder: 1;">
-                            <img src="https://placehold.co/600x300" alt="Alt text" loading="lazy">
-                        </a>
+                        <img src="../img/ingestdata.png" alt="Ingest your data" loading="lazy" />
                         <figcaption class="md-typeset">
-                            <h2>Step 2: Ingest Your Data</h2>
+                            <h2>Ingest Data & Metadata</h2>
                             <p>Whether you're working with raster or vector data, eoAPI's flexible design allows you to
                                 easily ingest STAC Collections.
                             </p>
                         </figcaption>
                     </figure>
                     <figure>
-                        <a href="reference/restapi/" title="swagger-ui" tabindex="-1">
-                            <img src="https://placehold.co/600x300" alt="Alt text" loading="lazy">
-                        </a>
+                        <img src="../img/sharevisualize.png" alt="Share imagery" loading="lazy">
                         <figcaption class="md-typeset">
-                            <h2>Step 3: Share, Visualize, and Analyze Your Data</h2>
+                            <h2>Share, Visualize, and Analyze</h2>
                             <p>Now that your data is ingested, eoAPI provides you with the tools you need to share,
                                 visualize, and analyze it. From simple sharing options to advanced analytics
                                 capabilities, eoAPI is designed to help you make the most out of your geospatial data.
@@ -223,20 +217,19 @@ <h2>Step 3: Share, Visualize, and Analyze Your Data</h2>
     <!-- Why eoAPI section -->
     <section class="md-content secondary-section" data-md-color-scheme="default">
         <div class="md-grid" data-md-component="content">
-            <div class="md-content__inner text-centered centered width-160">
+            <div class="md-content__inner centered width-160">
                 <header class="md-typeset">
-                    <h5 id="why-eoapi" class="supheading">Why eoAPI</h5>
+                    <h5 id="why-eoapi" class="supheading text-centered">Why eoAPI</h5>
                     <h1><mark>We believe</mark> that the <mark>community</mark> of people who would benefit from STAC is
                         larger than the current
                         core
                         community and early adopters of STAC.</h1>
                 </header>
                 <p class="md-typeset">The potential of Earth Observation data is immense in helping us understand our
-                    ever-changing planet. To fulfill this potential, we need to provide EO data that can be easily
-                    integrated into modern applications and decision-making tools. It’s important that it’s easy to
+                    ever-changing planet. To fulfill this potential, we must provide EO data that can be easily
+                    integrated into modern applications and decision-making tools. It&apos;s important that it&apos;s easy to
                     discover, interoperable, ingestible, and optimized for applications. This is a significant challenge
-                    for
-                    many organizations, and it’s our mission at Development Seed to address this challenge.</p>
+                    for many organizations, and our mission at Development Seed is to address this challenge.</p>
             </div>
         </div>
     </section>
@@ -247,20 +240,20 @@ <h1><mark>We believe</mark> that the <mark>community</mark> of people who would
                 <header class="md-typeset text-centered">
                     <h5 id="eoapi-in-action" class="supheading">eoAPI in action</h5>
                 </header>
-                <div class="figure-collection">
+                <div class="figure-collection" id="eoAPI-examples">
                     <figure>
                         <figcaption class="md-typeset">
-                            <h3>NASA IMPACT’s VEDA Project</h3>
+                            <h2>NASA IMPACT&apos;s VEDA Project</h2>
                             <p>NASA IMPACT is leading the way for how NASA (and space agencies worldwide) can increase
                                 the
-                                societal impact of their data through cloud-optimized data distribution. They’ve
+                                societal impact of their data through cloud-optimized data distribution. They&apos;ve
                                 invested
                                 significant resources in advancing modern public EO data standards, tools, and
                                 platforms.
                                 You
-                                can see eoAPI services in action across</p>
+                                can see eoAPI services in action throughout the <a href="https://earthdata.nasa.gov/dashboard" rel="noopener" target="_blank">VEDA platform</a>.</p>
                         </figcaption>
-                        <img src="https://placehold.co/600x300" alt="Alt text" loading="lazy">
+                        <img src="../img/eoapi_veda.png" alt="NASA VEDA platform screenshot" loading="lazy">
                     </figure>
                 </div>
             </div>