mirror of https://github.com/docker/docs.git
Merge pull request #18310 from dvdksn/style-dds-updates
styling updates
This commit is contained in:
David Karlsson
GitHub
commit
d5420c616e
|
|
@ -20,6 +20,11 @@
|
|||
display: none !important;
|
||||
}
|
||||
|
||||
:root {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.link {
|
||||
@apply text-blue-light dark:text-blue-dark underline-offset-2 underline;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,108 +0,0 @@
|
|||
{{ define "left" }}
|
||||
{{ partial "sidebar.html" . }}
|
||||
{{ end }}
|
||||
|
||||
{{ define "main" }}
|
||||
{{ partial "breadcrumbs-legacy.html" . }}
|
||||
<article class="prose max-w-none dark:prose-invert">
|
||||
<h1>{{ .Title }}</h1>
|
||||
{{ $openapi := index site.Data.api .Params.apidata }}
|
||||
{{ printf "## %s version %s" $openapi.info.title $openapi.info.version | .RenderString }}
|
||||
{{ .RenderString $openapi.info.description }}
|
||||
{{ range $path, $pathKeys := $openapi.paths }}
|
||||
{{ range $key, $properties := $pathKeys }}
|
||||
{{ if in "get put patch post delete" $key }}
|
||||
{{ if isset $properties "operationId" }}
|
||||
{{ printf "### %s {#%s}" $properties.summary $properties.operationId | $.RenderString }}
|
||||
{{ else }}
|
||||
{{ printf "### %s {#%s}" $properties.summary (urlize $properties.summary) | $.RenderString }}
|
||||
{{ end }}
|
||||
{{ $badgeColors := (dict
|
||||
"get" "bg-blue-light-500 dark:bg-blue-dark-300"
|
||||
"head" "bg-gray-light-500 dark:bg-gray-dark-300"
|
||||
"put" "bg-green-light-500 dark:bg-green-dark-300"
|
||||
"post" "bg-violet-light-500 dark:bg-violet-dark-300"
|
||||
"delete" "bg-red-light-500 dark:bg-red-dark-300"
|
||||
"patch" "bg-amber-light-500 dark:bg-amber-dark-500"
|
||||
)
|
||||
}}
|
||||
<span
|
||||
class="p-2 text-white {{ index $badgeColors $key }} rounded uppercase"
|
||||
>{{ $key }}</span
|
||||
> <code>{{ $path }}</code>
|
||||
{{ $curlExample := printf
|
||||
`curl -X %s \
|
||||
"%sapi%s"` ($key | upper) (index $openapi.servers 0).url $path
|
||||
}}
|
||||
{{ highlight $curlExample "console" }}
|
||||
{{ $properties.description | $.RenderString (dict "display" "block") }}
|
||||
{{ with $properties.parameters }}
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>{{ T "apiPropParam" }}</th>
|
||||
<th>{{ T "apiPropType" }}</th>
|
||||
<th>{{ T "apiPropValue" }}</th>
|
||||
<th>{{ T "apiPropReq" }}</th>
|
||||
<th>{{ T "apiPropDesc" }}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
{{ range . }}
|
||||
{{ $paramData := . }}
|
||||
{{ if (index . "$ref") }}
|
||||
{{ $refName := index (last 1 (split (index . "$ref") "/")) 0 }}
|
||||
{{ $paramData = index $openapi.components.parameters $refName }}
|
||||
{{ end }}
|
||||
<tr>
|
||||
<td>{{ $paramData.name }}</td>
|
||||
<td>{{ $paramData.in }}</td>
|
||||
<td>
|
||||
{{ if isset $paramData.schema "$ref" }}
|
||||
{{ $refName := index (last 1 (split (index $paramData.schema "$ref") "/")) 0 }}
|
||||
{{ range (index $openapi.components.schemas $refName).enum }}
|
||||
<code>{{ . }}</code>
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
{{ $paramData.schema.type }}
|
||||
{{ end }}
|
||||
</td>
|
||||
<td>{{ $paramData.required }}</td>
|
||||
<td>{{ $paramData.description | $.RenderString }}</td>
|
||||
</tr>
|
||||
{{ end }}
|
||||
</table>
|
||||
{{ end }}
|
||||
{{ range $responseCode, $responseDetails := $properties.responses }}
|
||||
{{ if isset $responseDetails "content" }}
|
||||
{{ range $exampleName, $example := (index $responseDetails.content "application/json").examples }}
|
||||
{{ if isset $example "schema" }}
|
||||
{{ $refPath := index (index $example "schema") "$ref" }}
|
||||
{{ range $index, $component := (split $refPath "/") }}
|
||||
{{ if (index $openapi.components.examples $component) }}
|
||||
<div>
|
||||
<span
|
||||
>{{ T "apiExampleResponseCode" }}:
|
||||
{{ $responseCode }}</span
|
||||
>
|
||||
<pre><code>{{ (index $openapi.components.examples $component).value | jsonify (dict "indent" " ") }}</code></pre>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
{{ T "apiExampleResponse" }}:
|
||||
<pre><code>
|
||||
{{- $example.value | jsonify (dict "indent" " ") }}
|
||||
</code></pre>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</article>
|
||||
{{ end }}
|
||||
|
||||
{{ define "right" }}
|
||||
{{ partial "api-aside.html" . }}
|
||||
{{ end }}
|
||||
|
|
@ -11,7 +11,7 @@
|
|||
{{ end }}
|
||||
{{ .Scratch.Set "headings" slice }}
|
||||
{{ .Scratch.Set "subheadings" slice }}
|
||||
{{ partial "breadcrumbs-legacy.html" . }}
|
||||
{{ partial "breadcrumbs.html" . }}
|
||||
<article class="prose max-w-none dark:prose-invert">
|
||||
<h1>{{ .Title }}</h1>
|
||||
{{ $data.short | .RenderString (dict "display" "block") }}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
{{ end }}
|
||||
|
||||
{{ define "main" }}
|
||||
{{ partial "breadcrumbs-legacy.html" . }}
|
||||
{{ partial "breadcrumbs.html" . }}
|
||||
<article class="prose max-w-none dark:prose-invert">
|
||||
<h1>{{ .Title }}</h1>
|
||||
<table>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
{{ end }}
|
||||
|
||||
{{ define "main" }}
|
||||
{{ partial "breadcrumbs-legacy.html" . }}
|
||||
{{ partial "breadcrumbs.html" . }}
|
||||
<article class="prose max-w-none dark:prose-invert">
|
||||
{{ with .Title }}
|
||||
<h1>{{ . }}</h1>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
{{ end }}
|
||||
|
||||
{{ define "main" }}
|
||||
{{ partial "breadcrumbs-legacy.html" . }}
|
||||
{{ partial "breadcrumbs.html" . }}
|
||||
<article class="prose max-w-none dark:prose-invert">
|
||||
{{ with .Title }}
|
||||
<h1>{{ . }}</h1>
|
||||
|
|
|
|||
|
|
@ -1,29 +0,0 @@
|
|||
{{ define "left" }}
|
||||
{{ partial "sidebar.html" . }}
|
||||
{{ end }}
|
||||
|
||||
{{ define "main" }}
|
||||
{{ partial "breadcrumbs-legacy.html" . }}
|
||||
<article class="prose max-w-none dark:prose-invert">
|
||||
<h1 class="flex items-center select-none">
|
||||
<span class="text-4xl material-symbols-rounded">tag</span>
|
||||
<span class="select-text">{{ .Title }}</span>
|
||||
</h1>
|
||||
{{ .Content }}
|
||||
{{ with (index site.Taxonomies.topics .Data.Term) }}
|
||||
<hr />
|
||||
<nav>
|
||||
<div class="text-xl">Pages about this topic:</div>
|
||||
<ul>
|
||||
{{ range . | first 5 }}
|
||||
<li>
|
||||
<a href="{{ .Page.Permalink }}"
|
||||
>{{ partial "utils/title.html" .Page }}</a
|
||||
>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
{{ end }}
|
||||
</article>
|
||||
{{ end }}
|
||||
|
|
@ -1,14 +0,0 @@
|
|||
{
|
||||
"title": "{{ .Title }}",
|
||||
"lead": "{{ .Params.lead }}",
|
||||
"description": {{ .Plain | jsonify }},
|
||||
"docs": [
|
||||
{{- range $i, $e := (index site.Taxonomies.tags .Data.Term) }}
|
||||
{{ if $i }},{{ end }}
|
||||
{
|
||||
"title": "{{ .Title }}",
|
||||
"url": "{{ .Permalink}}"
|
||||
}
|
||||
{{ end }}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
<nav class="p-5 space-x-2 text-sm flex items-center">
|
||||
{{- template "crumbtrail" (dict "p1" . "p2" .) -}}
|
||||
</nav>
|
||||
|
||||
{{ define "crumbtrail" }}
|
||||
{{ if and .p1.Parent .p2.Parent }}
|
||||
{{ template "crumbtrail" (dict "p1" .p1.Parent "p2" .p2 ) }}
|
||||
{{- end -}}
|
||||
<a
|
||||
class="link"
|
||||
title="{{ partial "utils/title" .p1 }}"
|
||||
href="{{ .p1.Permalink }}"
|
||||
>{{ if .p1.IsHome }}
|
||||
<span class="material-symbols-rounded">home</span>
|
||||
{{ else }}
|
||||
{{ partial "utils/title" .p1 }}
|
||||
{{ end }}</a
|
||||
>{{- if ne .p1 .p2 }}<span>/</span>{{- end -}}
|
||||
{{- end -}}
|
||||
|
|
@ -2,12 +2,8 @@
|
|||
{{ $ctx := . }}
|
||||
|
||||
|
||||
<nav class="py-2 gap-2 flex items-center overflow-hidden">
|
||||
<a class="link" href="{{ site.BaseURL }}"
|
||||
><span class="material-symbols-rounded">home</span></a
|
||||
>
|
||||
<nav class="py-4 gap-4 flex items-center overflow-hidden text-gray-light dark:text-gray-dark">
|
||||
{{ with ($scratch.GetSortedMapValues "sections") }}
|
||||
<span>/</span>
|
||||
{{ range $i, $e := . }}
|
||||
{{- if $i -}}
|
||||
<span>/</span>
|
||||
|
|
@ -17,6 +13,6 @@
|
|||
{{- end -}}
|
||||
{{- with $scratch.Get "lastsection" -}}
|
||||
<span>/</span>
|
||||
<a href="{{ .path }}" class="link whitespace-nowrap">{{ markdownify .title }}</a>
|
||||
<span>{{ markdownify .title }}</span>
|
||||
{{- end -}}
|
||||
</nav>
|
||||
|
|
@ -6,7 +6,7 @@
|
|||
{{ $firstSection := (index ($scratch.GetSortedMapValues "sections") 0).title }}
|
||||
|
||||
{{/* Render the top-nav in sidebar for small screens */}}
|
||||
<nav class="py-4 hidden gap-4 pl-3 md:flex flex-col justify-evenly">
|
||||
<nav class="text-sm py-4 hidden gap-4 pl-4 md:flex flex-col justify-evenly">
|
||||
<div class="text-gray-light dark:text-gray-dark">Main sections</div>
|
||||
{{ range site.Menus.main }}
|
||||
<div class="pl-2 underline-offset-8 decoration-2 hover:underline decoration-blue-light dark:decoration-blue-dark hover:opacity-75
|
||||
|
|
@ -19,8 +19,8 @@
|
|||
</nav>
|
||||
{{ if $firstSection }}
|
||||
<hr>
|
||||
<nav id="sectiontree" class="w-[300px] md:w-full flex flex-col gap-2">
|
||||
<div class="hidden md:block pl-3 pt-4 text-gray-light dark:text-gray-dark">This section</div>
|
||||
<nav id="sectiontree" class="text-sm w-[300px] md:w-full flex flex-col gap-2 px-3">
|
||||
<div class="hidden md:block pt-4 text-gray-light dark:text-gray-dark">This section</div>
|
||||
{{/* The current page is in the table of contents */}}
|
||||
<ul>
|
||||
{{/* Walk the toc.yaml nodes under the current main section */}}
|
||||
|
|
@ -37,12 +37,12 @@
|
|||
{{ if .entry.sectiontitle }}
|
||||
{{/* .entry is a section */}}
|
||||
<li x-data="{ expanded: false }" x-init="expanded = !!$el.querySelector('a[aria-current]')" :data-expanded="expanded">
|
||||
<button @click="expanded = ! expanded" class="sidebar-hover w-full flex items-center justify-between pr-3">
|
||||
<span class="pl-3 py-2 truncate">{{ markdownify .entry.sectiontitle }}</span>
|
||||
<span class="material-symbols-rounded -my-1 md:text-[28px]" x-text="expanded ? 'expand_more' : 'chevron_right'">
|
||||
<button @click="expanded = ! expanded" class="rounded px-4 sidebar-hover w-full flex items-center justify-between">
|
||||
<span class="py-2 truncate">{{ markdownify .entry.sectiontitle }}</span>
|
||||
<span class="material-symbols-rounded -my-1 md:text-[28px]" x-text="expanded ? 'expand_less' : 'expand_more'">
|
||||
</span>
|
||||
</button>
|
||||
<ul x-show="expanded" class="ml-3 md:ml-[21px]">
|
||||
<ul x-show="expanded" x-collapse class="ml-3 md:ml-[21px]">
|
||||
{{ range .entry.section }}
|
||||
{{ template "tocRender" (dict "entry" . "ctx" $ctx) }}
|
||||
{{ end }}
|
||||
|
|
@ -51,11 +51,10 @@
|
|||
{{ else }}
|
||||
{{/* .entry is a page */}}
|
||||
{{ $isCurrent := eq (urls.Parse $ctx.Permalink).Path .entry.path }}
|
||||
<li {{ if $isCurrent }} class="pl-3 box-border border-l-4 border-blue-light
|
||||
dark:border-blue-dark sidebar-hover bg-blue-light-200
|
||||
dark:bg-blue-dark-100" {{ else }} class="pl-3 sidebar-hover" {{ end }}>
|
||||
<li class="pl-4 sidebar-hover rounded
|
||||
{{ if $isCurrent }} bg-gray-light-200 dark:bg-gray-dark-200{{ end }}">
|
||||
<span class="flex items-center">
|
||||
<a {{ if $isCurrent }}aria-current="page" {{ end }} class="py-2 w-full truncate hover:font-medium"
|
||||
<a {{ if $isCurrent }}aria-current="page" {{ end }} class="py-2 w-full truncate"
|
||||
href="{{ .entry.path }}" title="{{ markdownify .entry.title }}">{{ markdownify .entry.title }}</a>
|
||||
</span>
|
||||
</li>
|
||||
|
|
|
|||
|
|
@ -2,15 +2,14 @@
|
|||
{{ $firstSection := (index ($scratch.GetSortedMapValues "sections") 0).title }}
|
||||
<div>
|
||||
<nav>
|
||||
<ul class="flex gap-4 md:hidden">
|
||||
<ul class="box-content flex mt-1 gap-4 md:hidden">
|
||||
{{ range site.Menus.main }}
|
||||
<li
|
||||
class="pb-1 mt-2 underline-offset-8 decoration-2 hover:underline hover:opacity-75
|
||||
{{- if eq $firstSection .Name }}
|
||||
underline
|
||||
<li class="opacity-100 border-b-4 hover:opacity-100
|
||||
{{- if not (eq $firstSection .Name) }}
|
||||
opacity-60 border-blue-light dark:border-blue-dark-200 hover:border-blue-light-600 dark:hover:border-blue-dark-100
|
||||
{{- end }}">
|
||||
<a href="{{ .URL }}">{{ .Name }}</a>
|
||||
</li>
|
||||
<a class="block py-1 px-2" href="{{ .URL }}">{{ .Name }}</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
{{ end }}
|
||||
|
||||
{{ define "main" }}
|
||||
{{ partial "breadcrumbs-legacy.html" . }}
|
||||
{{ partial "breadcrumbs.html" . }}
|
||||
<article class="prose max-w-none dark:prose-invert">
|
||||
<h1>{{ .Title }}</h1>
|
||||
<blockquote>
|
||||
|
|
|
|||
Loading…
Reference in New Issue