Skip to content

Commit df335e4

Browse files
gaurav-nelsoncursoragent
gaurav-nelson
and
cursoragent
committed
feat: Add interactive demos gallery and feature Dell DR demo on homepage
Co-authored-by: Cursor <cursoragent@cursor.com>
1 parent f4dc7b4 commit df335e4

25 files changed

Lines changed: 844 additions & 0 deletions

‎content/demos/_index.md‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
---
2+
title: Interactive demos
3+
description: Hands-on interactive walkthroughs of Validated Patterns.
4+
menu:
5+
main:
6+
name: Demos
7+
weight: 22
8+
demos:
9+
- id: 5nsew2VgJfkkdd5sQ0Mr
10+
title: Deploy a Validated Pattern on RHDP
11+
thumbnail: /images/demos/deploy-pattern-on-rhdp.png
12+
description: Deploy a Validated Pattern on the Red Hat Demo Platform (RHDP) without provisioning your own cluster. Walk through the steps to launch a pattern in a pre-built environment.
13+
pattern_link: https://demo.redhat.com
14+
pattern_label: Red Hat Demo Platform
15+
- id: U3ztnJKzMjsNM05f0ff5
16+
title: Using the Validated Patterns UI
17+
thumbnail: /images/demos/validated-patterns-ui.png
18+
description: See how the Validated Patterns framework looks and feels once deployed. This walkthrough covers the GitOps-driven UI, ArgoCD application views, and how to navigate a running pattern.
19+
pattern_link: /patterns/multicloud-gitops/
20+
pattern_label: Multicloud GitOps pattern
21+
- id: UusleQSZch8ZZyimr7aj
22+
title: RAG VP UI — Red Hat Summit 2026
23+
thumbnail: /images/demos/rag-vp-ui-summit-2026.png
24+
description: A walkthrough of the RAG Validated Pattern UI as shown at Red Hat Summit 2026. See the end-to-end experience from cluster deployment to a running AI application.
25+
- id: 6SxOiDc3P7uMg38jAOLw
26+
title: RAG-LLM GitOps pattern on Microsoft Azure
27+
thumbnail: /images/demos/rag-llm-gitops-azure.png
28+
description: LLM-based document generation on Azure with Red Hat OpenShift AI, from vector database ingestion to a running chatbot interface.
29+
pattern_link: /patterns/azure-rag-llm-gitops/
30+
pattern_label: RAG-LLM pattern on Microsoft Azure
31+
- id: drMY04qRCqQuq2BkZWpn
32+
title: RAG AI and Quickstart VP UI
33+
thumbnail: /images/demos/rag-ai-application.png
34+
description: Tour the RAG-augmented chatbot UI. The RAG AI UI demo and RAG AI Quickstart VP UI use the same Arcade walkthrough (one share link). See how the application generates project proposals using Red Hat product documentation.
35+
pattern_link: /patterns/rag-llm-gitops/
36+
pattern_label: AI generation with LLM and RAG
37+
- id: WBiokIqAOZRlk7aXkvuU
38+
title: RAG LLM on Lenovo SNO
39+
thumbnail: /images/demos/rag-llm-lenovo-sno.png
40+
description: RAG LLM on a Lenovo Single Node OpenShift cluster — CPU-based RAG without GPU hardware on compact infrastructure.
41+
pattern_link: /patterns/rag-llm-cpu/
42+
pattern_label: RAG LLM Chatbot on CPU
43+
- id: Qla3IzaQVM9yQP27TWDU
44+
title: Performing disaster recovery with RamenDR backed by Dell PowerStore
45+
thumbnail: /images/demos/ramendr-dell-powerstore-dr.png
46+
description: Walk through regional disaster recovery for OpenShift Virtualization workloads using RamenDR with Dell PowerStore storage backing the recovery workflow.
47+
pattern_link: /patterns/ramendr-starter-kit/
48+
pattern_label: RamenDR Starter Kit
49+
next_steps:
50+
- url: /patterns/
51+
label: Explore all patterns
52+
text: browse the full catalog by tier and use case
53+
- url: /learn/quickstart/
54+
label: Read the quickstart guide
55+
text: step-by-step instructions for your first deployment
56+
- url: /learn/about-validated-patterns/
57+
label: Learn the concepts
58+
text: understand how the framework works
59+
---

‎content/patterns/azure-rag-llm-gitops/_index.adoc‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ links:
2222
install: getting-started
2323
bugs: https://github.com/validatedpatterns/rag-llm-gitops/issues
2424
feedback: https://docs.google.com/forms/d/e/1FAIpQLScI76b6tD1WyPu2-d_9CCVDr3Fu5jYERthqLKJDUGwqBg7Vcg/viewform
25+
demo: 6SxOiDc3P7uMg38jAOLw
2526
---
2627

2728
:toc:

‎content/patterns/multicloud-gitops/_index.adoc‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ links:
2020
arch: https://www.redhat.com/architect/portfolio/detail/8-hybrid-multicloud-management-with-gitops
2121
bugs: https://github.com/validatedpatterns/multicloud-gitops/issues
2222
feedback: https://docs.google.com/forms/d/e/1FAIpQLScI76b6tD1WyPu2-d_9CCVDr3Fu5jYERthqLKJDUGwqBg7Vcg/viewform
23+
demo: U3ztnJKzMjsNM05f0ff5
2324
ci: mcgitops
2425
---
2526
:toc:

‎content/patterns/rag-llm-cpu/_index.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ links:
2121
install: getting-started
2222
bugs: https://github.com/validatedpatterns-sandbox/rag-llm-cpu/issues
2323
feedback: https://docs.google.com/forms/d/e/1FAIpQLScI76b6tD1WyPu2-d_9CCVDr3Fu5jYERthqLKJDUGwqBg7Vcg/viewform
24+
demo: WBiokIqAOZRlk7aXkvuU
2425
---
2526

2627
# **CPU-based RAG LLM chatbot**

‎content/patterns/rag-llm-gitops/_index.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ links:
2424
install: getting-started
2525
bugs: https://github.com/validatedpatterns/rag-llm-gitops/issues
2626
feedback: https://docs.google.com/forms/d/e/1FAIpQLScI76b6tD1WyPu2-d_9CCVDr3Fu5jYERthqLKJDUGwqBg7Vcg/viewform
27+
demo: drMY04qRCqQuq2BkZWpn
2728
ci: ragllm
2829
---
2930

‎content/patterns/rag-quickstart/_index.adoc‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ links:
1515
install: getting-started
1616
bugs: https://github.com/validatedpatterns-sandbox/ai-quickstart-rag/issues
1717
feedback: https://docs.google.com/forms/d/e/1FAIpQLScI76b6tD1WyPu2-d_9CCVDr3Fu5jYERthqLKJDUGwqBg7Vcg/viewform
18+
demo: drMY04qRCqQuq2BkZWpn
1819
---
1920
:toc:
2021
:imagesdir: /images

‎content/patterns/ramendr-starter-kit/_index.adoc‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ links:
2323
install: getting-started
2424
bugs: https://github.com/validatedpatterns/ramendr-starter-kit/issues
2525
feedback: https://docs.google.com/forms/d/e/1FAIpQLScI76b6tD1WyPu2-d_9CCVDr3Fu5jYERthqLKJDUGwqBg7Vcg/viewform
26+
demo: Qla3IzaQVM9yQP27TWDU
2627
ci: ramendr-starter-kit
2728
---
2829

‎layouts/demos/list.html‎

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
{{ define "main" }}
2+
{{ $demos := .Params.demos }}
3+
{{ $heroMain := index $demos 0 }}
4+
<main class="pf-c-page__main" tabindex="0">
5+
<section class="pf-c-page__main-section pf-m-light pf-u-background-color-dark-300">
6+
<div class="pf-l-grid">
7+
<div class="pf-l-grid__item pf-m-12-col-on-sm pf-m-10-col-on-md pf-m-offset-1-col-on-md pf-m-10-col-on-lg pf-m-offset-1-col-on-lg pf-u-py-xl">
8+
<div class="pf-c-content">
9+
<h1 class="pf-c-title pf-m-3xl pf-u-color-light-100">{{ .Title }}</h1>
10+
{{ with .Description }}
11+
<p class="pf-u-font-size-lg pf-u-color-light-200">{{ . }}</p>
12+
{{ end }}
13+
</div>
14+
</div>
15+
</div>
16+
</section>
17+
18+
<section class="pf-c-page__main-section demos-page">
19+
<div class="pf-l-grid">
20+
<div class="pf-l-grid__item pf-m-12-col-on-sm pf-m-12-col-on-md pf-m-offset-0-col-on-md pf-m-12-col-on-lg pf-m-offset-0-col-on-lg pf-u-px-lg-on-lg pf-u-py-2xl">
21+
{{ if $demos }}
22+
<div class="demos-hero" data-demos-hero>
23+
<div class="demos-player" data-demos-player>
24+
{{ partial "arcade-embed.html" (dict "id" $heroMain.id "title" $heroMain.title "eager" true) }}
25+
</div>
26+
27+
<aside class="demos-hero__sidebar" aria-label="Demo playlist">
28+
<div class="demos-sidebar__scroll" data-demos-sidebar-scroll tabindex="0">
29+
{{ range $i, $demo := $demos }}
30+
<div class="demos-sidebar-item">
31+
{{ partial "demo-select-card.html" (dict "demo" $demo "variant" "sidebar" "active" (eq $i 0)) }}
32+
<p class="demos-sidebar-item__title">{{ $demo.title }}</p>
33+
</div>
34+
{{ end }}
35+
</div>
36+
</aside>
37+
38+
<div class="demos-hero__meta-main">
39+
<h2 class="demos-hero__title" data-demos-main-title>{{ $heroMain.title }}</h2>
40+
<p class="demos-hero__desc" data-demos-main-desc>{{ $heroMain.description }}</p>
41+
{{ if $heroMain.pattern_link }}
42+
<p class="demos-hero__pattern" data-demos-main-pattern>
43+
For more information, see: <a href="{{ $heroMain.pattern_link }}">{{ $heroMain.pattern_label | default "View pattern" }}</a>
44+
</p>
45+
{{ else }}
46+
<p class="demos-hero__pattern" data-demos-main-pattern hidden></p>
47+
{{ end }}
48+
</div>
49+
</div>
50+
{{ end }}
51+
52+
{{ with .Params.next_steps }}
53+
<div class="demos-next-steps pf-c-content">
54+
<h2>Next steps</h2>
55+
<ul>
56+
{{ range . }}
57+
<li><a href="{{ .url }}">{{ .label }}</a> — {{ .text }}</li>
58+
{{ end }}
59+
</ul>
60+
</div>
61+
{{ end }}
62+
</div>
63+
</div>
64+
</section>
65+
66+
{{ partial "footer.html" . }}
67+
</main>
68+
<link rel="stylesheet" href="{{ "css/demos.css" | relURL }}">
69+
<script src="{{ "js/demos.js" | relURL }}" defer></script>
70+
{{ end }}

‎layouts/index.html‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,40 @@
1616
</div>
1717
</div>
1818
</section>
19+
<!-- Featured Interactive Demo Section -->
20+
<section id="featured-demo" class="pf-c-page__main-section pf-u-background-color-dark-300">
21+
<div class="pf-l-grid">
22+
<div class="pf-l-grid__item pf-m-12-col-on-sm pf-m-12-col-on-md pf-m-12-col-on-lg pf-u-py-2xl">
23+
<div class="pf-c-content pf-u-text-align-center homepage-featured-demo" style="max-width: 1280px; margin: 0 auto;">
24+
<div class="homepage-featured-demo__wrap">
25+
<div class="homepage-featured-demo__shell">
26+
<div class="homepage-featured-demo__ambient" aria-hidden="true"></div>
27+
<iframe
28+
src="https://demo.arcade.software/Qla3IzaQVM9yQP27TWDU?embed&embed_mobile=tab&embed_desktop=inline&squared=true&show_copy_link=true"
29+
title="Performing disaster recovery with RamenDR backed by Dell PowerStore"
30+
frameborder="0"
31+
loading="lazy"
32+
webkitallowfullscreen
33+
mozallowfullscreen
34+
allowfullscreen
35+
allow="clipboard-write"
36+
onload="this.closest('.homepage-featured-demo__shell').classList.add('is-loaded')"
37+
class="homepage-featured-demo__iframe">
38+
</iframe>
39+
</div>
40+
</div>
41+
<h2 class="pf-c-title pf-m-2xl pf-u-color-light-100 pf-u-mb-md">Interactive demo: disaster recovery with RamenDR and Dell PowerStore</h2>
42+
<p class="pf-u-color-light-200 pf-u-font-size-lg pf-u-mb-lg">
43+
See how regional failover works for OpenShift Virtualization workloads using RamenDR and Dell PowerStore.
44+
</p>
45+
<div class="pf-u-display-flex pf-u-flex-direction-column pf-u-flex-direction-row-on-md pf-u-justify-content-center">
46+
<a href="/demos/" class="pf-c-button pf-m-primary pf-u-mr-md-on-md pf-u-mb-md pf-u-mb-0-on-md">Explore all demos</a>
47+
<a href="/patterns/ramendr-starter-kit/" class="pf-c-button pf-m-secondary">View RamenDR pattern</a>
48+
</div>
49+
</div>
50+
</div>
51+
</div>
52+
</section>
1953
<!-- Social Proof Section -->
2054
<section id="social-proof" class="pf-c-page__main-section">
2155
<div class="pf-l-grid">

‎layouts/partials/arcade-embed.html‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
{{- /*
2+
Arcade iframe with skeleton placeholder.
3+
Params: id (required), title, eager (bool), compact (bool)
4+
*/ -}}
5+
{{- $id := .id -}}
6+
{{- $title := .title | default "Interactive demo" -}}
7+
{{- $eager := .eager | default false -}}
8+
{{- $compact := .compact | default false -}}
9+
{{- $src := printf "https://demo.arcade.software/%s?embed&embed_mobile=tab&embed_desktop=inline&squared=true&show_copy_link=true" $id -}}
10+
<div class="arcade-embed{{ if $compact }} arcade-embed--compact{{ end }}" data-arcade-embed>
11+
<div class="arcade-embed__skeleton" aria-hidden="true"></div>
12+
<iframe
13+
class="arcade-embed__iframe"
14+
{{- if $eager }}src="{{ $src }}"{{ else }}data-src="{{ $src }}"{{ end }}
15+
title="{{ $title }}"
16+
frameborder="0"
17+
loading="{{ if $eager }}eager{{ else }}lazy{{ end }}"
18+
allow="clipboard-write"
19+
allowfullscreen
20+
></iframe>
21+
</div>

0 commit comments

Comments
 (0)