Update docs-site landing page with Scion explainer deck content#286
Conversation
Incorporate key messaging from the Scion intro slides into the landing page. Adds a new "Scion Core" pipeline section showing the five-part orchestration flow (Define, Run, Spawn, Notify, Sync) and expands the feature cards with detailed descriptions from each slide topic (Agent Definition, Runtime, Collaborators, Notifications, Shared Filesystem). Other changes: - Replace "Boot" with "Run" per requested terminology change - Update "grove" to "project" in the how-it-works steps - Replace Google Slides embed with the HTML slides deck URL - Reorder sections: pipeline → features → video → slides → quickstart
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request updates the documentation landing page (landing.astro) to integrate detailed content from the Scion explainer slide deck, introducing a new five-step 'Scion Core' pipeline section, expanding the feature cards with bulleted sub-features, updating terminology, and embedding the interactive HTML slides. Feedback on these changes suggests improving the mobile responsiveness of the new pipeline grid by switching to a single-column layout on small screens, and optimizing page load performance by adding lazy loading to the embedded slides iframe.
| .pipeline-grid { | ||
| grid-template-columns: 1fr 1fr; | ||
| } |
There was a problem hiding this comment.
On small mobile screens (640px and below), a 2-column layout (1fr 1fr) for the 5-step pipeline cards is extremely cramped. With 1.5rem padding on each card, the content area becomes too narrow, causing long words like "configurations" or "notifications" to wrap awkwardly or overflow. Additionally, a 5-item grid in a 2-column layout leaves the final item unbalanced on its own row. Changing this to a single-column layout (1fr) on mobile viewports will significantly improve readability and visual balance.
.pipeline-grid {
grid-template-columns: 1fr;
}
| <iframe | ||
| src="https://docs.google.com/presentation/d/1h2yS_LTqTKqSsQqqaNNt34yMtAybAaRUz1PgZScBMdw/embed?start=false&loop=false&delayms=3000" | ||
| src="https://storage.googleapis.com/scion-intro-slides/index.html" | ||
| title="Scion Overview Deck" | ||
| allowfullscreen | ||
| ></iframe> |
There was a problem hiding this comment.
The interactive HTML slides deck loaded from Google Cloud Storage is a heavy resource that can block the main thread and delay the initial page load. Since this iframe is located near the bottom of the landing page, adding loading="lazy" is highly recommended to defer loading until the user scrolls near it, improving the page's Core Web Vitals and overall performance.
<iframe
src="https://storage.googleapis.com/scion-intro-slides/index.html"
title="Scion Overview Deck"
loading="lazy"
allowfullscreen
></iframe>
…leCloudPlatform#286) * Update docs-site landing page with Scion explainer deck content Incorporate key messaging from the Scion intro slides into the landing page. Adds a new "Scion Core" pipeline section showing the five-part orchestration flow (Define, Run, Spawn, Notify, Sync) and expands the feature cards with detailed descriptions from each slide topic (Agent Definition, Runtime, Collaborators, Notifications, Shared Filesystem). Other changes: - Replace "Boot" with "Run" per requested terminology change - Update "grove" to "project" in the how-it-works steps - Replace Google Slides embed with the HTML slides deck URL - Reorder sections: pipeline → features → video → slides → quickstart * Add project log entry for docs landing page update
1 participant
Summary
Content sourced from: https://storage.googleapis.com/scion-intro-slides/index.html
Test plan
/landing