chore: add get started guide cards

@theme/styles.css

@@ -732,6 +732,18 @@
     }
 }
 
+[className="rocket-icon"] {
+    path {
+        fill: #1A1C21;
+    }
+}
+
+.dark [className="rocket-icon"] {
+    path {
+        fill: #FBFBFC;
+    }
+}
+
 tr td:first-child code {
     word-break: normal;
 }

docs/index.md

@@ -8,6 +8,19 @@ seo:
 Welcome to the official Redocly Documentation.
 Ready to build something amazing?
 
+{% cards %}
+  {% card
+    title="Get started guide"
+    layout="horizontal"
+    align="start"
+    to="/docs/realm/get-started/index.md"
+    icon="./images/rocket-icon.svg"
+    iconVariant="filled"
+  %}
+    Go live with your docs in minutes using our guided setup
+  {% /card %}
+{% /cards %}
+
 ## Products
 
 {% cards columns=2 cardMinWidth=300 %}

package.json

@@ -13,7 +13,7 @@
   "author": "[email protected]",
   "license": "UNLICENSED",
   "dependencies": {
-    "@redocly/marketing-pages": "0.1.44",
+    "@redocly/marketing-pages": "0.1.46",
     "@redocly/realm": "0.129.0-next.2",
     "buffer": "^6.0.3",
     "highlight-words-core": "^1.2.3",

pages/learning-center/cards.ts

@@ -5,12 +5,28 @@ import apiTestingThumbnail from './images/api-testing-thumbnail.svg';
 import apiSecurityThumbnail from './images/api-security-thumbnail.svg';
 import arazzoThumbnail from './images/arazzo-thumbnail.svg';
 import aiForDocsThumbnail from './images/ai-for-docs-thumbnail.svg';
+import getStartedThumbnail from './images/get-started-thumbnail.svg';
 
 export const cards = [
   {
     id: 1,
+    key: 'get-started',
+    title: 'Get started',
+    description: 'Everything you need to build, validate, and ship great API documentation.',
+    thumbnail: getStartedThumbnail,
+    moreItems: '',
+    landingPage: '/learn/openapi/learning-openapi',
+    items: [
+      { title: 'Get started with the Reunite editor', link: '/docs/realm/get-started/start-reunite-editor' },
+      { title: 'Start with local development', link: '/docs/realm/get-started/start-local-dev' },
+      { title: 'Migrate from legacy', link: '/docs/realm/get-started/migrate-api-reference' },
+      { title: 'Upgrade product version', link: '/docs/realm/get-started/upgrade-realm-version' },
+    ],
+  },
+  {
+    id: 2,
     key: 'open-api',
-    title: 'OpenAPI',
+    title: 'Learn OpenAPI',
     description: 'Resources for learning more about OpenAPI and how to use it.',
     thumbnail: openApiThumbnail,
     moreItems: '40 more topics',
@@ -23,9 +39,9 @@ export const cards = [
     ],
   },
   {
-    id: 2,
+    id: 3,
     key: 'arazzo',
-    title: 'Arazzo',
+    title: 'Learn Arazzo',
     description:
       'Learn how to use Arazzo to describe practical API workflows.',
     thumbnail: arazzoThumbnail,
@@ -39,9 +55,9 @@ export const cards = [
     ],
   },
   {
-    id: 3,
+    id: 4,
     key: 'markdoc',
-    title: 'Markdoc',
+    title: 'Learn Markdoc',
     description: 'Next-generation markup resources and detailed tag library.',
     thumbnail: markdocThumbnail,
     moreItems: '11 more topics',
@@ -54,9 +70,9 @@ export const cards = [
     ],
   },
   {
-    id: 4,
+    id: 5,
     key: 'yaml',
-    title: 'YAML',
+    title: 'Learn YAML',
     description: 'Learn how to use YAML in your API documentation and configuration.',
     thumbnail: yamlThumbnail,
     moreItems: '4 more topics',
@@ -69,7 +85,7 @@ export const cards = [
     ],
   },
   // {
-  //   id: 5,
+  //   id: 6,
   //   key: 'api-governance',
   //   title: 'API governance',
   //   description: 'Use our interactive tool to build linting rules for your API.',
@@ -84,9 +100,9 @@ export const cards = [
   //   ],
   // },
   {
-    id: 5,
+    id: 6,
     key: 'api-testing',
-    title: 'API Testing',
+    title: 'Learn API Testing',
     description:
       'Master API testing fundamentals with tools, techniques, and best practices.',
     thumbnail: apiTestingThumbnail,
@@ -98,9 +114,9 @@ export const cards = [
     ],
   },
   {
-    id: 6,
+    id: 7,
     key: 'api-security',
-    title: 'API Security',
+    title: 'Learn API Security',
     description:
       'Gain insights into securing your APIs with essential resources, tools, and best practices to protect your applications.',
     thumbnail: apiSecurityThumbnail,
@@ -115,9 +131,9 @@ export const cards = [
     ],
   },
   {
-    id: 7,
+    id: 8,
     key: 'ai-for-docs',
-    title: 'AI for Docs',
+    title: 'Learn AI for Docs',
     description:
       'Learn how to use AI to improve your API documentation.',
     thumbnail: aiForDocsThumbnail,
@@ -130,7 +146,7 @@ export const cards = [
     ],
   },
   // {
-  //   id: 8,
+  //   id: 9,
   //   key: 'graphql',
   //   title: 'GraphQL',
   //   description: