+
+
+## Test endpoints
+
+Explore endpoints interactively via Swagger - served by your own instance.
+
+```text
+https://
/swaggerui/
+```
+
+:::div{.hint}
+Our docs cover the latest version of the Octopus REST API. If you're on a Long Term Support (LTS) version, some endpoints and values may differ. Use the Swagger UI served by your own instance (see above) as the source of truth for your version.
+:::
+
+## Common tasks
+
+
+
+
+
+
+
+
+
+
+
+
+## API clients
+
+
+
+
+
+
+
+
+
+## More resources
+
+
+
+
+
+
+
+
+
diff --git a/src/styles/api.css b/src/styles/api.css
index 8704c05377..45c78b71f7 100644
--- a/src/styles/api.css
+++ b/src/styles/api.css
@@ -240,3 +240,27 @@ section so its examples can sit beside it. */
mask-image: url('../assets/icons/pen-line.svg');
mask-size: 90% 80%;
}
+
+/* ----- The API hub page (/docs/api) ----- */
+
+/* The hub is a landing page, not an endpoint reference: its content nests
+ inside .api-hub rather than sitting at the top level of .page-content,
+ which keeps plugins/satteri-api-examples.js from regrouping its headings
+ into the two-column endpoint layout above (that plugin only touches
+ headings that are direct children of the document root). It gets the
+ design's own width instead of the endpoint body measure. */
+.content-group--api .page-content > .api-hub {
+ max-width: 1140px;
+}
+
+/* h2's own margin-block-start (56px, set in main.css) plus this padding gives
+ each hub section an 80px gap from the one before it. */
+.api-hub h2 {
+ padding-block-start: var(--space24);
+}
+
+/* The header (title + subtitle) sits outside .page-content, so it needs its
+ own rule to match the same width. */
+.article--api-hub .header {
+ max-width: 1140px;
+}
diff --git a/src/styles/main.css b/src/styles/main.css
index 63d8cf83b9..65eedb52c6 100644
--- a/src/styles/main.css
+++ b/src/styles/main.css
@@ -1617,6 +1617,16 @@ a[data-youtube] {
padding-block-start: var(--space32);
}
+.page-content:has(> :is(a, button, h1, h2, h3, h4, h5, h6):first-child),
+.page-content:has(
+ > .api-hub > :is(a, button, h1, h2, h3, h4, h5, h6):first-child
+) {
+ /* The API hub page's content nests inside .api-hub (see api.css) rather
+ than sitting directly in .page-content, so its own first child needs
+ checking too. */
+ padding-block-start: var(--space0);
+}
+
/* Paging */
.post-paging {