mirror of
https://github.com/docker/docs.git
synced 2026-10-23 18:09:02 +03:00
9b1f7de05f
@netlify /reference/api/ [Preview the API reference](https://deploy-preview-26048--docsdocker.netlify.app/reference/api/) Adds a shared API reference experience for Hub, DVP, and Registry: a catalog, operation navigation, linked schemas, request and response examples, and matching HTML and Markdown output. A validation and generation pipeline prepares the reference data for Hugo and runs as part of Docker and Netlify builds. Migrates the three specifications to OpenAPI 3.2, correcting response shapes, nullable fields, and authentication and token examples. The Hub migration also corrects SCIM contracts and CSV exports; DVP gains complete report response schemas and examples. Registry keeps its documented Hub-specific subset, with authentication and media negotiation expressed through OpenAPI security and content fields. Validation is strict for both checks and generation, with no exception baseline or bypass flag. The build uses the migrated sources directly, without migration scripts or records. Page and specification URLs remain stable, including the DVP alias. Operation and schema anchors change. Engine and Governance retain their existing references. Validated locally with Go tests, strict validation of all three specifications (zero diagnostics), scoped formatting and lint, and a full Hugo build checking all 176 HTML/Markdown page pairs, example parity, reference links, and byte-identical published specifications. A browser check confirmed raw CSV rendering and the generated request header. No live API requests were made.
597 lines
12 KiB
CSS
597 lines
12 KiB
CSS
/* Scoped reference tokens inherit Docker's palette and installed typefaces. */
|
|
.api-reference,
|
|
.api-nav {
|
|
--api-text: var(--color-gray-800, #2c333f);
|
|
--api-muted: var(--color-gray-600, #566581);
|
|
--api-line: var(--color-gray-100, #e7eaef);
|
|
--api-surface: var(--color-background-light, #f9f9fa);
|
|
--api-paper: #fff;
|
|
--api-link: var(--color-blue-600, #0d4df2);
|
|
--api-selected: var(--color-blue-50, #f6f8fe);
|
|
--api-mono: "Roboto Mono", ui-monospace, monospace;
|
|
color: var(--api-text);
|
|
}
|
|
.dark .api-reference,
|
|
.dark .api-nav {
|
|
--api-text: var(--color-gray-100, #e7eaef);
|
|
--api-muted: var(--color-gray-300, #a9b4c6);
|
|
--api-line: var(--color-gray-800, #2c333f);
|
|
--api-surface: var(--color-gray-900, #1e2129);
|
|
--api-paper: var(--color-background-dark, #10151b);
|
|
--api-link: var(--color-blue-300, #7ba4f4);
|
|
--api-selected: #17243b;
|
|
color-scheme: dark;
|
|
}
|
|
.api-reference {
|
|
max-width: 1440px;
|
|
margin: auto;
|
|
font-size: 15px;
|
|
line-height: 1.7;
|
|
overflow-wrap: anywhere;
|
|
}
|
|
.api-reference h1 {
|
|
font-size: 32px;
|
|
font-weight: 550;
|
|
letter-spacing: -0.025em;
|
|
line-height: 1.25;
|
|
margin: 28px 0 20px;
|
|
text-wrap: balance;
|
|
}
|
|
.api-reference h2 {
|
|
font-size: 20px;
|
|
font-weight: 550;
|
|
letter-spacing: -0.015em;
|
|
line-height: 1.4;
|
|
margin: 36px 0 14px;
|
|
}
|
|
.api-reference h3,
|
|
.api-reference h4 {
|
|
font-size: 15px;
|
|
font-weight: 550;
|
|
line-height: 1.5;
|
|
margin: 20px 0 8px;
|
|
}
|
|
.api-reference p {
|
|
margin: 10px 0;
|
|
max-width: 72ch;
|
|
}
|
|
.api-reference .prose {
|
|
color: var(--api-text);
|
|
font-size: inherit;
|
|
line-height: inherit;
|
|
max-width: 72ch;
|
|
}
|
|
.api-reference .prose > :first-child {
|
|
margin-top: 0;
|
|
}
|
|
.api-reference .prose > :last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
.api-reference .prose li > p {
|
|
margin: 6px 0;
|
|
}
|
|
.api-reference .prose :is(h1, h2, h3, h4, h5, h6) > a {
|
|
color: inherit;
|
|
text-decoration: none;
|
|
}
|
|
.api-reference .prose :is(h1, h2, h3, h4, h5, h6) > a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
.api-overview {
|
|
max-width: 72ch;
|
|
margin: 32px 0;
|
|
}
|
|
.api-reference .api-overview .prose :is(h3, h4) {
|
|
font-size: 17px;
|
|
font-weight: 550;
|
|
line-height: 1.4;
|
|
margin: 28px 0 12px;
|
|
}
|
|
.api-reference a,
|
|
.api-nav a {
|
|
color: var(--api-link);
|
|
text-underline-offset: 3px;
|
|
}
|
|
.api-reference a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
.api-reference :is(a, button, input, select, summary):focus-visible,
|
|
.api-nav a:focus-visible {
|
|
outline: 2px solid var(--api-link);
|
|
outline-offset: 4px;
|
|
border-radius: 3px;
|
|
}
|
|
.api-reference code {
|
|
font-family: var(--api-mono);
|
|
font-size: 13px;
|
|
font-weight: 400;
|
|
overflow-wrap: anywhere;
|
|
}
|
|
.api-reference .prose code::before,
|
|
.api-reference .prose code::after {
|
|
content: none;
|
|
}
|
|
.api-reference pre {
|
|
background: var(--api-surface);
|
|
color: var(--api-text);
|
|
border: 1px solid var(--api-line);
|
|
padding: 18px 20px;
|
|
border-radius: 6px;
|
|
overflow: auto;
|
|
font-family: var(--api-mono);
|
|
font-size: 13px;
|
|
line-height: 1.75;
|
|
max-height: 34rem;
|
|
margin: 14px 0;
|
|
tab-size: 2;
|
|
}
|
|
.api-reference pre code {
|
|
font: inherit;
|
|
padding: 0;
|
|
background: none;
|
|
color: inherit;
|
|
}
|
|
.api-reference summary {
|
|
cursor: pointer;
|
|
padding: 6px 0;
|
|
font-size: 13px;
|
|
color: var(--api-muted);
|
|
}
|
|
.api-reference summary::marker {
|
|
color: var(--api-muted);
|
|
font-size: 10px;
|
|
}
|
|
.api-reference summary:hover {
|
|
color: var(--api-link);
|
|
}
|
|
.api-eyebrow,
|
|
.api-label {
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
color: var(--api-muted);
|
|
}
|
|
.api-reference .api-eyebrow {
|
|
margin-top: 28px;
|
|
margin-bottom: -16px;
|
|
}
|
|
.api-lead {
|
|
font-size: 17px;
|
|
color: var(--api-muted);
|
|
}
|
|
.api-cards {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 16px;
|
|
margin: 32px 0;
|
|
}
|
|
.api-card {
|
|
display: block;
|
|
border: 1px solid var(--api-line);
|
|
border-radius: 10px;
|
|
padding: 26px;
|
|
}
|
|
.api-card:hover {
|
|
background: var(--api-selected);
|
|
border-color: var(--api-link);
|
|
text-decoration: none !important;
|
|
}
|
|
.api-card h2 {
|
|
margin: 12px 0;
|
|
color: var(--api-text);
|
|
}
|
|
.api-card p {
|
|
color: var(--api-muted);
|
|
}
|
|
.api-card > span:last-child {
|
|
display: inline-block;
|
|
margin-top: 10px;
|
|
font-size: 14px;
|
|
}
|
|
.api-crumbs {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 8px;
|
|
align-items: center;
|
|
color: var(--api-muted);
|
|
font-size: 13px;
|
|
margin-bottom: 12px;
|
|
}
|
|
.api-crumbs a {
|
|
color: var(--api-muted);
|
|
}
|
|
.api-tools {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 12px 24px;
|
|
align-items: center;
|
|
font-size: 13px;
|
|
padding-bottom: 20px;
|
|
border-bottom: 1px solid var(--api-line);
|
|
}
|
|
.api-tools > label {
|
|
margin-right: auto;
|
|
}
|
|
.api-reference label {
|
|
font-size: 13px;
|
|
color: var(--api-muted);
|
|
}
|
|
.api-reference select,
|
|
.api-reference input {
|
|
border: 1px solid var(--api-line);
|
|
border-radius: 6px;
|
|
background: var(--api-paper);
|
|
padding: 8px 10px;
|
|
color: var(--api-text);
|
|
font: inherit;
|
|
font-size: 14px;
|
|
max-width: 100%;
|
|
}
|
|
.api-reference select {
|
|
margin-left: 8px;
|
|
}
|
|
.api-reference input::placeholder {
|
|
color: var(--api-muted);
|
|
}
|
|
.api-connection {
|
|
max-width: 72ch;
|
|
margin: 32px 0;
|
|
}
|
|
.api-filter-label {
|
|
display: block;
|
|
margin: 16px 0 24px;
|
|
}
|
|
.api-filter-label input {
|
|
display: block;
|
|
width: 100%;
|
|
max-width: 36rem;
|
|
margin: 8px 0;
|
|
}
|
|
.api-operation-row {
|
|
display: grid;
|
|
grid-template-columns: 64px minmax(0, 1.2fr) minmax(0, 1fr);
|
|
align-items: start;
|
|
gap: 16px;
|
|
padding: 16px 8px;
|
|
border-bottom: 1px solid var(--api-line);
|
|
font-size: 14px;
|
|
}
|
|
.api-operation-row > span:last-child {
|
|
color: var(--api-muted);
|
|
}
|
|
.api-operation-row:hover {
|
|
background: var(--api-selected);
|
|
text-decoration: none !important;
|
|
}
|
|
.api-method {
|
|
display: inline-block;
|
|
font-size: 11px;
|
|
font-weight: 650;
|
|
background: var(--api-selected);
|
|
color: var(--api-link);
|
|
border-radius: 4px;
|
|
padding: 4px 8px;
|
|
line-height: 1.5;
|
|
white-space: nowrap;
|
|
width: fit-content;
|
|
flex-shrink: 0;
|
|
}
|
|
.api-method[data-method="POST"] {
|
|
background: #ebf9ee;
|
|
color: #216e4b;
|
|
}
|
|
.api-method[data-method="DELETE"] {
|
|
background: #fff0ef;
|
|
color: #ad3039;
|
|
}
|
|
.api-method[data-method="PATCH"],
|
|
.api-method[data-method="PUT"] {
|
|
background: #fff5e0;
|
|
color: #865514;
|
|
}
|
|
.dark .api-method[data-method="POST"] {
|
|
background: #173728;
|
|
color: #a9e5bd;
|
|
}
|
|
.dark .api-method[data-method="DELETE"] {
|
|
background: #3d2229;
|
|
color: #f5b6b6;
|
|
}
|
|
.dark .api-method[data-method="PATCH"],
|
|
.dark .api-method[data-method="PUT"] {
|
|
background: #392e1c;
|
|
color: #edcd96;
|
|
}
|
|
.api-signature {
|
|
display: flex;
|
|
align-items: baseline;
|
|
gap: 14px;
|
|
background: var(--api-surface);
|
|
border: 1px solid var(--api-line);
|
|
border-radius: 6px;
|
|
padding: 14px 18px;
|
|
margin: 0 0 28px;
|
|
}
|
|
.api-signature code {
|
|
font-size: 14px;
|
|
}
|
|
.api-operation-grid {
|
|
display: grid;
|
|
grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
|
|
gap: 40px;
|
|
align-items: start;
|
|
}
|
|
.api-reading {
|
|
min-width: 0;
|
|
}
|
|
.api-description {
|
|
margin-bottom: 32px;
|
|
}
|
|
.api-description:empty {
|
|
display: none;
|
|
}
|
|
.api-request {
|
|
position: sticky;
|
|
top: 88px;
|
|
max-height: calc(100dvh - 112px);
|
|
overflow: auto;
|
|
min-width: 0;
|
|
border: 1px solid var(--api-line);
|
|
border-radius: 8px;
|
|
padding: 20px;
|
|
background: var(--api-surface);
|
|
font-size: 13px;
|
|
line-height: 1.65;
|
|
}
|
|
.api-request-heading {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 16px;
|
|
}
|
|
.api-request-heading h2 {
|
|
margin: 0;
|
|
font-size: 15px;
|
|
letter-spacing: 0;
|
|
}
|
|
.api-request-heading > span {
|
|
color: var(--api-muted);
|
|
font-size: 12px;
|
|
}
|
|
.api-request > p {
|
|
color: var(--api-muted);
|
|
margin: 12px 0;
|
|
}
|
|
.api-request pre {
|
|
background: var(--api-paper);
|
|
padding: 16px;
|
|
white-space: pre-wrap;
|
|
overflow-wrap: anywhere;
|
|
}
|
|
.api-request pre code {
|
|
word-break: break-all;
|
|
}
|
|
.api-request button {
|
|
border: 1px solid var(--api-line);
|
|
background: var(--api-paper);
|
|
color: var(--api-text);
|
|
padding: 7px 12px;
|
|
border-radius: 5px;
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
cursor: pointer;
|
|
}
|
|
.api-request button:hover {
|
|
border-color: var(--api-link);
|
|
color: var(--api-link);
|
|
}
|
|
.api-source-details {
|
|
border-top: 1px solid var(--api-line);
|
|
margin-top: 16px;
|
|
padding-top: 8px;
|
|
}
|
|
.api-field {
|
|
border-top: 1px solid var(--api-line);
|
|
padding: 16px 0;
|
|
margin: 0;
|
|
}
|
|
.api-field h3 {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 10px;
|
|
align-items: baseline;
|
|
margin: 0 0 10px;
|
|
}
|
|
.api-field h3 code,
|
|
.api-field > summary code {
|
|
color: var(--api-text);
|
|
font-weight: 500;
|
|
}
|
|
.api-field small {
|
|
font-size: 12px;
|
|
font-weight: 400;
|
|
color: var(--api-muted);
|
|
}
|
|
.api-field .api-required {
|
|
color: var(--api-text);
|
|
font-size: 12px;
|
|
}
|
|
.api-field .api-field {
|
|
border-top: 0;
|
|
border-left: 1px solid var(--api-line);
|
|
margin: 12px 0 0 4px;
|
|
padding: 0 0 0 16px;
|
|
}
|
|
.api-type,
|
|
.api-ref,
|
|
.api-constraints {
|
|
font-size: 13px;
|
|
color: var(--api-muted);
|
|
}
|
|
.api-variant {
|
|
border-top: 1px solid var(--api-line);
|
|
margin-top: 24px;
|
|
padding-top: 20px;
|
|
}
|
|
.api-variant > h3 {
|
|
display: flex;
|
|
gap: 10px;
|
|
align-items: baseline;
|
|
margin-top: 0;
|
|
}
|
|
.api-status {
|
|
border: 1px solid var(--api-line);
|
|
padding: 1px 6px;
|
|
border-radius: 4px;
|
|
}
|
|
.api-media {
|
|
color: var(--api-muted);
|
|
}
|
|
.api-schema-links {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
|
|
gap: 0 28px;
|
|
margin: 0;
|
|
padding: 0;
|
|
list-style: none;
|
|
}
|
|
.api-schema-links li {
|
|
min-width: 0;
|
|
border-bottom: 1px solid var(--api-line);
|
|
}
|
|
.api-schema-links a {
|
|
display: flex;
|
|
align-items: center;
|
|
height: 100%;
|
|
min-height: 44px;
|
|
padding: 10px 8px;
|
|
}
|
|
.api-schema-links a:hover {
|
|
background: var(--api-selected);
|
|
}
|
|
.api-nav {
|
|
padding: 20px 8px;
|
|
font-size: 14px;
|
|
line-height: 1.5;
|
|
}
|
|
.api-nav a {
|
|
display: block;
|
|
padding: 7px 10px;
|
|
margin: 2px 0;
|
|
color: var(--api-muted);
|
|
}
|
|
.api-nav a:hover {
|
|
color: var(--api-link);
|
|
background: var(--api-selected);
|
|
}
|
|
.api-nav a[aria-current="page"] {
|
|
background: var(--api-selected);
|
|
color: var(--api-link);
|
|
font-weight: 500;
|
|
box-shadow: inset 2px 0 var(--api-link);
|
|
}
|
|
.api-nav h2 {
|
|
font-size: 16px;
|
|
font-weight: 550;
|
|
margin: 24px 10px 4px;
|
|
}
|
|
.api-nav .api-nav-version {
|
|
color: var(--api-muted);
|
|
font-size: 13px;
|
|
margin: 0 10px 16px;
|
|
}
|
|
.api-nav h3 {
|
|
font-size: 13px;
|
|
font-weight: 550;
|
|
margin: 26px 10px 8px;
|
|
}
|
|
.api-nav .api-nav-operation {
|
|
display: grid;
|
|
grid-template-columns: 42px minmax(0, 1fr);
|
|
gap: 8px;
|
|
align-items: baseline;
|
|
}
|
|
.api-nav small {
|
|
font-size: 11px;
|
|
font-weight: 600;
|
|
color: var(--api-link);
|
|
}
|
|
.api-nav small[data-method="POST"] {
|
|
color: #216e4b;
|
|
}
|
|
.api-nav small[data-method="DELETE"] {
|
|
color: #ad3039;
|
|
}
|
|
.api-nav small[data-method="PATCH"],
|
|
.api-nav small[data-method="PUT"] {
|
|
color: #865514;
|
|
}
|
|
.dark .api-nav small[data-method="POST"] {
|
|
color: #a9e5bd;
|
|
}
|
|
.dark .api-nav small[data-method="DELETE"] {
|
|
color: #f5b6b6;
|
|
}
|
|
.dark .api-nav small[data-method="PATCH"],
|
|
.dark .api-nav small[data-method="PUT"] {
|
|
color: #edcd96;
|
|
}
|
|
.api-nav .api-nav-back {
|
|
font-size: 13px;
|
|
color: var(--api-link);
|
|
}
|
|
.api-reference [hidden] {
|
|
display: none !important;
|
|
}
|
|
.api-reference[data-api-view="schema"] > .prose {
|
|
margin-bottom: 24px;
|
|
}
|
|
.api-reference[data-api-view="schema"] > .api-field {
|
|
max-width: 80ch;
|
|
}
|
|
@media (max-width: 1199px) {
|
|
.api-operation-grid {
|
|
grid-template-columns: 1fr;
|
|
gap: 28px;
|
|
}
|
|
.api-request {
|
|
position: static;
|
|
max-height: none;
|
|
overflow: visible;
|
|
grid-row: 1;
|
|
}
|
|
}
|
|
@media (max-width: 767px) {
|
|
main > div:has(> .api-reference) {
|
|
padding: 24px 20px;
|
|
}
|
|
.api-cards {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
.api-reference h1 {
|
|
font-size: 28px;
|
|
}
|
|
.api-operation-row {
|
|
grid-template-columns: 56px minmax(0, 1fr);
|
|
gap: 6px 12px;
|
|
}
|
|
.api-operation-row > span:last-child {
|
|
grid-column: 2;
|
|
}
|
|
.api-tools {
|
|
gap: 14px 20px;
|
|
}
|
|
.api-tools > label {
|
|
flex-basis: 100%;
|
|
}
|
|
.api-signature {
|
|
padding: 12px;
|
|
gap: 10px;
|
|
}
|
|
.api-signature code {
|
|
font-size: 13px;
|
|
}
|
|
.api-request {
|
|
padding: 16px;
|
|
}
|
|
}
|