Redocly · adamaltman · Jan 26, 2021 · Jan 26, 2021 · Jan 26, 2021 · Jan 26, 2021
diff --git a/catalog/breakfast/breakfast.page.yaml b/catalog/breakfast/breakfast.page.yaml
@@ -0,0 +1,12 @@
+type: reference-docs
+definitionId: paper
+settings:
+  pagination: section
+  generateCodeSamples:
+    languages:
+      - lang: curl
+      - lang: JavaScript
+      - lang: Node.js
+      - lang: Python
+      - lang: C#
+      - lang: Java
diff --git a/catalog/breakfast/sidebars.yaml b/catalog/breakfast/sidebars.yaml
@@ -0,0 +1 @@
+- page: ./breakfast.page.yaml
diff --git a/catalog/dinner/dinner.page.yaml b/catalog/dinner/dinner.page.yaml
@@ -0,0 +1,12 @@
+type: reference-docs
+definitionId: paper
+settings:
+  pagination: section
+  generateCodeSamples:
+    languages:
+      - lang: curl
+      - lang: JavaScript
+      - lang: Node.js
+      - lang: Python
+      - lang: C#
+      - lang: Java
diff --git a/catalog/dinner/sidebars.yaml b/catalog/dinner/sidebars.yaml
@@ -0,0 +1 @@
+- page: ./dinner.page.yaml
diff --git a/catalog/games.mdx b/catalog/games.mdx
@@ -0,0 +1,27 @@
+---
+title: Games APIs
+description: Games APIs
+---
+
+import { WideTile, Flex } from '@redocly/developer-portal/ui';
+
+# Games APIs
+
+The Games APIs entertain.
+
+Prerequisites
+- Good attitude
+
+<div>
+  <Flex justifyContent="space-between" flexWrap="wrap">
+    <WideTile to="../separated/rock.page.yaml" header="Rock">
+      The hardest game
+    </WideTile>
+    <WideTile to="../separated/paper.page.yaml" header="Paper">
+      The lightest game
+    </WideTile>
+    <WideTile to="../separated/scissors.page.yaml" header="Scissors">
+      The sharpest game
+    </WideTile>
+  </Flex>
+</div>
diff --git a/catalog/index.mdx b/catalog/index.mdx
@@ -0,0 +1,32 @@
+---
+title: API catalog
+description: Our API catalog is composed of dozens of microservices organized into categories.
+---
+
+import { WideTile, Flex } from '@redocly/developer-portal/ui';
+
+# API catalog
+
+Welcome to a sample API catalog.
+
+There are many ways to organize information in Redocly.
+
+This pull request demonstrates:
+- separated sidebars
+- combined sidebars
+- drilldown sidebars
+
+This catalog view is a combination of combined sidebars and separate sidebars.
+
+Select a category such as games, and then select an API.
+
+<div>
+  <Flex justifyContent="space-between" flexWrap="wrap">
+    <WideTile to="./games.mdx" header="Games">
+      Entertainment
+    </WideTile>
+    <WideTile to="./meals.mdx" header="Meals">
+      Nutrition and energy
+    </WideTile>
+  </Flex>
+</div>
diff --git a/catalog/lunch/lunch.page.yaml b/catalog/lunch/lunch.page.yaml
@@ -0,0 +1,12 @@
+type: reference-docs
+definitionId: paper
+settings:
+  pagination: section
+  generateCodeSamples:
+    languages:
+      - lang: curl
+      - lang: JavaScript
+      - lang: Node.js
+      - lang: Python
+      - lang: C#
+      - lang: Java
diff --git a/catalog/lunch/sidebars.yaml b/catalog/lunch/sidebars.yaml
@@ -0,0 +1 @@
+- page: ./lunch.page.yaml
diff --git a/catalog/meals.mdx b/catalog/meals.mdx
@@ -0,0 +1,31 @@
+---
+title: Meals APIs
+description: Meals APIs
+---
+
+import { WideTile, Flex } from '@redocly/developer-portal/ui';
+
+# Meals APIs
+
+The Meals APIs satisfy hunger.
+
+Prerequisites
+- Mouth
+- Food
+
+<div>
+  <Flex justifyContent="space-between" flexWrap="wrap">
+    <WideTile to="./breakfast/breakfast.page.yaml" header="Breakfast">
+      The most important meal of the day
+    </WideTile>
+    <WideTile to="./lunch/lunch.page.yaml" header="Lunch">
+      Mid-day meal
+    </WideTile>
+    <WideTile to="./dinner/dinner.page.yaml" header="Dinner">
+      End the day with a dinner
+    </WideTile>
+    <WideTile to="./snacks/snacks.page.yaml" header="Snacks">
+      Recharge in between meals
+    </WideTile>
+  </Flex>
+</div>
diff --git a/catalog/sidebars.yaml b/catalog/sidebars.yaml
@@ -0,0 +1,3 @@
+- page: index.mdx
+- page: games.mdx
+- page: meals.mdx
diff --git a/catalog/snacks/sidebars.yaml b/catalog/snacks/sidebars.yaml
@@ -0,0 +1 @@
+- page: ./snacks.page.yaml
diff --git a/catalog/snacks/snacks.page.yaml b/catalog/snacks/snacks.page.yaml
@@ -0,0 +1,12 @@
+type: reference-docs
+definitionId: paper
+settings:
+  pagination: section
+  generateCodeSamples:
+    languages:
+      - lang: curl
+      - lang: JavaScript
+      - lang: Node.js
+      - lang: Python
+      - lang: C#
+      - lang: Java
diff --git a/combined/index.md b/combined/index.md
@@ -0,0 +1,15 @@
+# Combined sidebars
+
+This puts multiple APIs into a single visible sidebar.
+
+```yaml
+combined:
+  - page: combined/index.md
+  - page: combined/rock.page.yaml
+  - page: combined/paper.page.yaml
+  - page: combined/scissors.page.yaml
+```
+
+:::note Pagination
+We've paginated the rock, paper, and scissors APIs differently as well.
+:::
diff --git a/combined/paper.page.yaml b/combined/paper.page.yaml
@@ -0,0 +1,12 @@
+type: reference-docs
+definitionId: paper
+settings:
+  pagination: section
+  generateCodeSamples:
+    languages:
+      - lang: curl
+      - lang: JavaScript
+      - lang: Node.js
+      - lang: Python
+      - lang: C#
+      - lang: Java
diff --git a/combined/rock.page.yaml b/combined/rock.page.yaml
@@ -0,0 +1,10 @@
+type: reference-docs
+definitionId: rock
+settings:
+  pagination: none
+  generateCodeSamples:
+    languages:
+      - lang: curl
+      - lang: Go
+      - lang: PHP
+      - lang: Ruby
diff --git a/combined/scissors.page.yaml b/combined/scissors.page.yaml
@@ -0,0 +1,12 @@
+type: reference-docs
+definitionId: scissors
+settings:
+  pagination: item
+  generateCodeSamples:
+    languages:
+      - lang: curl
+      - lang: JavaScript
+      - lang: Node.js
+      - lang: Python
+      - lang: C#
+      - lang: Java
diff --git a/drilldown/index.md b/drilldown/index.md
@@ -0,0 +1,33 @@
+# Drilldown style of sidebars
+
+This shows the drilldown style of sidebars.
+
+Notice that the `/*` is appended to the `rock.page.yaml` and `paper.page.yaml` files to avoid an extra group.
+We remove the `/*` from the `scissors.page.yaml` file so you can see the difference.
+
+```yaml
+drilldown-style:
+  - page: drilldown/index.md
+  - group: Rock
+    menuStyle: drilldown
+    icon: images/rock.png
+    sublabel: Rock API docs
+    pages:
+      - page: openapi/rock.page.yaml/*
+  - group: Paper
+    menuStyle: drilldown
+    icon: images/paper.png
+    sublabel: Paper API docs
+    pages:
+      - page: openapi/paper.page.yaml/*
+  - group: Scissors
+    menuStyle: drilldown
+    icon: images/scissors.png
+    sublabel: Scissors API docs
+    pages:
+      - page: openapi/scissors.page.yaml
+```
+
+:::note Pagination
+We've paginated the rock, paper, and scissors APIs differently as well.
+:::
diff --git a/drilldown/paper.page.yaml b/drilldown/paper.page.yaml
@@ -0,0 +1,12 @@
+type: reference-docs
+definitionId: paper
+settings:
+  pagination: section
+  generateCodeSamples:
+    languages:
+      - lang: curl
+      - lang: JavaScript
+      - lang: Node.js
+      - lang: Python
+      - lang: C#
+      - lang: Java
diff --git a/drilldown/rock.page.yaml b/drilldown/rock.page.yaml
@@ -0,0 +1,10 @@
+type: reference-docs
+definitionId: rock
+settings:
+  pagination: none
+  generateCodeSamples:
+    languages:
+      - lang: curl
+      - lang: Go
+      - lang: PHP
+      - lang: Ruby
diff --git a/drilldown/scissors.page.yaml b/drilldown/scissors.page.yaml
@@ -0,0 +1,12 @@
+type: reference-docs
+definitionId: scissors
+settings:
+  pagination: item
+  generateCodeSamples:
+    languages:
+      - lang: curl
+      - lang: JavaScript
+      - lang: Node.js
+      - lang: Python
+      - lang: C#
+      - lang: Java
diff --git a/images/paper.png b/images/paper.png
diff --git a/images/rock.png b/images/rock.png
diff --git a/images/scissors.png b/images/scissors.png
diff --git a/index.mdx b/index.mdx
@@ -18,11 +18,9 @@ import {
   NavBar,
 } from '@redocly/developer-portal/ui';
 
-import icon1 from './images/icon1.png';
-import launchFastIcon from './images/launch-fast.svg';
-import icon3 from './images/icon3.png';
-import bookManagementIcon from './images/book-management.svg';
-import foundOrPrivate from './images/found-or-private.svg';
+import rock from './images/rock.png';
+import paper from './images/paper.png';
+import scissors from './images/scissors.png';
 
 export default LandingLayout;
 
@@ -44,26 +42,17 @@ export default LandingLayout;
 </Jumbotron>
 <Box my={25}>
   <SectionHeader>
-    Create your <Emphasis> developer portal </Emphasis> today!
+    Browse our <Emphasis> API catalog </Emphasis> today!
   </SectionHeader>
   <FlexSection justifyContent="space-around" flexWrap="wrap">
-    <ThinTile to="developer-portal/index.md" icon={icon1} header="Rock">
-        Lorem ipsum dolor sit amet, pri putent oportere quaerendum in, ea mea justo invenire
-        aliquando. Usu modo suavitate ea. Et sed labitur epicurei adipiscing. Nibh zril labitur
-        an usu.Lorem ipsum dolor sit amet, pri putent oportere quaerendum in, ea mea justo
-        invenire aliquando. Usu modo suavitate ea. Et sed labitur epicurei adipiscing. Nibh zril
-        labitur an usu.Lorem ipsum dolor sit amet, pri putent oportere quaerendum in, ea mea
-        justo invenire aliquando. Usu modo suavitate ea. Et sed labitur epicurei adipiscing.
+    <ThinTile to="openapi/rock.page.yaml" icon={rock} header="Rock">
+        This is the Rock API. It thinks it is better than the Scissors API. But it has to watch out for paper.
     </ThinTile>
-    <ThinTile to="developer-portal/index.md" icon={launchFastIcon} header="Paper">
-        Lorem ipsum dolor sit amet, pri putent oportere quaerendum in, ea mea justo invenire
-        aliquando. Usu modo suavitate ea. Et sed labitur epicurei adipiscing. Nibh zril labitur
-        an usu.
+    <ThinTile to="openapi/paper.page.yaml" icon={paper} header="Paper">
+        The Paper API frightens the Rock API.
     </ThinTile>
-    <ThinTile to="contact.mdx" icon={icon3} header="Scissors">
-        Lorem ipsum dolor sit amet, pri putent oportere quaerendum in, ea mea justo invenire
-        aliquando. Usu modo suavitate ea. Et sed labitur epicurei adipiscing. Nibh zril labitur
-        an usu.
+    <ThinTile to="openapi/scissors.page.yaml" icon={scissors} header="Scissors">
+        The Scissors API is great as long as it stays away from the Rock API.
     </ThinTile>
   </FlexSection>
   {/* <Jumbotron parallaxEffect bgImage={icon1}>

diff --git a/openapi/paper.page.yaml b/openapi/paper.page.yaml
@@ -0,0 +1,12 @@
+type: reference-docs
+definitionId: paper
+settings:
+  pagination: section
+  generateCodeSamples:
+    languages:
+      - lang: curl
+      - lang: JavaScript
+      - lang: Node.js
+      - lang: Python
+      - lang: C#
+      - lang: Java
diff --git a/openapi/rock.page.yaml b/openapi/rock.page.yaml
@@ -0,0 +1,10 @@
+type: reference-docs
+definitionId: rock
+settings:
+  pagination: none
+  generateCodeSamples:
+    languages:
+      - lang: curl
+      - lang: Go
+      - lang: PHP
+      - lang: Ruby
diff --git a/openapi/scissors.page.yaml b/openapi/scissors.page.yaml
@@ -0,0 +1,12 @@
+type: reference-docs
+definitionId: scissors
+settings:
+  pagination: item
+  generateCodeSamples:
+    languages:
+      - lang: curl
+      - lang: JavaScript
+      - lang: Node.js
+      - lang: Python
+      - lang: C#
+      - lang: Java
diff --git a/separated/index.md b/separated/index.md
@@ -0,0 +1,29 @@
+# Separate sidebars
+
+This makes separate sidebars (all within a single `sidebars.yaml` file).
+
+Notice we use the `/*` to eliminate one grouping level in the scissors and rock APIs.
+You will visually see the difference between those and the paper API.
+
+```yaml
+## different sidebars
+rock:
+  - page: separated/rock-quickstart.md
+  - page: separated/rock.page.yaml/*
+paper:
+  - page: separated/paper.page.yaml
+scissors:
+  - page: separated/scissors.page.yaml/*
+
+```
+
+Use these links to visit those APIs:
+
+- [Rock](./rock-quickstart.md)
+- [Paper](./paper.page.yaml)
+- [Scissors](./scissors.page.yaml)
+
+
+:::note Pagination
+We've paginated the rock, paper, and scissors APIs differently as well.
+:::