mirror of https://github.com/docker/docs.git
263 lines
12 KiB
HTML
263 lines
12 KiB
HTML
<!doctype html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
{{ partial "head.html" . }}
|
||
</head>
|
||
|
||
<body class="flex h-max flex-col bg-background-light text-base dark:bg-background-dark dark:text-white">
|
||
<div class="absolute -z-10 w-full">
|
||
<svg class="dark:hidden" viewBox="0 0 1616 797" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||
<path d="M1066.69 797L0 136.789V0H1616V488.038L1066.69 797Z" fill="#EFEFF2" />
|
||
</svg>
|
||
<svg class="hidden dark:block" viewBox="0 0 1616 797" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||
<path d="M1066.69 797L0 136.789V0H1616V488.038L1066.69 797Z" fill="#080B0E" fill-opacity="0.3" />
|
||
</svg>
|
||
</div>
|
||
{{ partial "header.html" . }}
|
||
<main class="flex min-h-screen w-full flex-col items-stretch self-center">
|
||
<div class="flex xl:w-[1200px] flex-col items-stretch gap-20 self-center py-20 w-full px-4">
|
||
<div class="bg-pattern-blue relative overflow-hidden rounded drop-shadow">
|
||
<div class="flex h-full flex-col items-start justify-between gap-4 p-8">
|
||
<div class="flex items-center gap-6">
|
||
<span class="icon-svg text-violet-light dark:text-violet-dark">
|
||
{{ partial "icon" "play_circle" }}</span>
|
||
<h1 class="text-2xl">Get Docker</h1>
|
||
</div>
|
||
<p>
|
||
Learn how to install Docker for Mac, Windows, or Linux and explore
|
||
our developer tools.
|
||
</p>
|
||
<a href="/get-started/get-docker/"
|
||
class="mt-20 flex cursor-pointer items-center gap-2 rounded bg-blue-light p-2 px-4 text-white transition duration-300 hover:bg-blue-light-400 dark:bg-blue-dark-400 dark:hover:bg-blue-dark">
|
||
<span class="icon-svg">{{ partial "icon" "download"}}</span>
|
||
Get Docker
|
||
</a>
|
||
</div>
|
||
<div class="absolute bottom-0 right-0 origin-bottom-right scale-50 lg:scale-100">
|
||
<img class="dark:hidden" alt="Low-fi desktop app" src="/assets/images/app-wf-light-1.svg" />
|
||
<img class="hidden dark:block" alt="Low-fi desktop app" src="/assets/images/app-wf-dark-1.svg" />
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<div class="grid grid-cols-1 gap-4 lg:grid-cols-4">
|
||
|
||
<div>
|
||
<a class="h-full" href="/get-started/">
|
||
<div
|
||
class="flex h-full flex-col gap-2 rounded border border-gray-light-100 bg-white p-4 drop-shadow-sm hover:border-gray-light-200 hover:drop-shadow-lg dark:border-gray-dark-400 dark:bg-gray-dark-200 hover:dark:border-gray-dark">
|
||
<div class="flex items-center gap-4">
|
||
<span class="icon-svg text-violet-light dark:text-violet-dark">
|
||
{{ partial "icon" "rocket" }}
|
||
</span>
|
||
<div>
|
||
<div class="text-xl leading-snug text-gray-light-800 dark:text-white">
|
||
Get started
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="leading-snug text-gray-light-500 dark:text-gray-dark-700">
|
||
Learn Docker basics and the benefits of containerization.
|
||
</div>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
|
||
<div>
|
||
<a class="h-full" href="/guides/">
|
||
<div
|
||
class="flex h-full flex-col gap-2 rounded border border-gray-light-100 bg-white p-4 drop-shadow-sm hover:border-gray-light-200 hover:drop-shadow-lg dark:border-gray-dark-400 dark:bg-gray-dark-200 hover:dark:border-gray-dark">
|
||
<div class="flex items-center gap-4">
|
||
<span class="icon-svg text-violet-light dark:text-violet-dark">
|
||
{{ partial "icon" "developer_guide" }}
|
||
</span>
|
||
<div>
|
||
<div class="text-xl leading-snug text-gray-light-800 dark:text-white">
|
||
Guides
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="leading-snug text-gray-light-500 dark:text-gray-dark-700">
|
||
Learn how Docker can optimize your development workflows.
|
||
</div>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
|
||
<div>
|
||
<a class="h-full" href="/manuals/">
|
||
<div
|
||
class="flex h-full flex-col gap-2 rounded border border-gray-light-100 bg-white p-4 drop-shadow-sm hover:border-gray-light-200 hover:drop-shadow-lg dark:border-gray-dark-400 dark:bg-gray-dark-200 hover:dark:border-gray-dark">
|
||
<div class="flex items-center gap-4">
|
||
<span class="icon-svg text-violet-light dark:text-violet-dark">
|
||
{{ partial "icon" "description" }}
|
||
</span>
|
||
<div>
|
||
<div class="text-xl leading-snug text-gray-light-800 dark:text-white">
|
||
Manuals
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="leading-snug text-gray-light-500 dark:text-gray-dark-700">
|
||
Learn how to install, set up, configure, and use Docker
|
||
products.
|
||
</div>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
|
||
<div>
|
||
<a class="h-full" href="/reference/">
|
||
<div
|
||
class="flex h-full flex-col gap-2 rounded border border-gray-light-100 bg-white p-4 drop-shadow-sm hover:border-gray-light-200 hover:drop-shadow-lg dark:border-gray-dark-400 dark:bg-gray-dark-200 hover:dark:border-gray-dark">
|
||
<div class="flex items-center gap-4">
|
||
<span class="icon-svg text-violet-light dark:text-violet-dark">
|
||
{{ partial "icon" "terminal" }}
|
||
</span>
|
||
<div>
|
||
<div class="text-xl leading-snug text-gray-light-800 dark:text-white">
|
||
Reference
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="leading-snug text-gray-light-500 dark:text-gray-dark-700">
|
||
Browse the CLI and API documentation.
|
||
</div>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="z-10 grid grid-cols-1 gap-20 lg:grid-cols-2">
|
||
<div class="bg-pattern-verde relative rounded p-6 drop-shadow">
|
||
<div class="flex h-full flex-col items-start justify-between gap-12">
|
||
<div class="flex flex-col gap-4">
|
||
<h2 class="font-medium">Gen AI catalog {{ partial
|
||
"components/badge.html" (dict "color" "blue" "content" "New")
|
||
}}</h2>
|
||
<p class="text-xl">
|
||
Integrate AI solutions into your apps with minimal effort
|
||
</p>
|
||
</div>
|
||
<div class="flex flex-col xl:flex-row gap-4 items-start">
|
||
<a href="https://hub.docker.com/catalogs/gen-ai"
|
||
class="flex cursor-pointer items-center gap-2 rounded bg-blue-light p-2 px-4 text-white transition duration-300 hover:bg-blue-light-400 dark:bg-blue-dark-400 dark:hover:bg-blue-dark">
|
||
Explore on Docker Hub
|
||
</a>
|
||
<a href="/docker-hub/image-library/catalogs/"
|
||
class="flex-grow-0 flex cursor-pointer items-center gap-2 rounded bg-blue-light p-2 px-4 text-white transition duration-300 hover:bg-blue-light-400 dark:bg-blue-dark-400 dark:hover:bg-blue-dark">
|
||
Read the docs
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="absolute bottom-0 right-0 origin-bottom-right scale-75 md:scale-100">
|
||
<img class="dark:hidden" alt="Low-fi desktop app" src="/assets/images/app-wf-light-2.svg" />
|
||
<img class="hidden dark:block" alt="Low-fi desktop app" src="/assets/images/app-wf-dark-2.svg" />
|
||
</div>
|
||
</div>
|
||
<div class="rounded-[6px] bg-gradient-to-br from-blue-light-400 to-magenta-light-400 dark:from-blue-dark-400 dark:to-magenta-dark-400 p-[2px] drop-shadow">
|
||
<div class="bg-pattern-purple rounded p-6">
|
||
<div class="flex flex-col gap-12">
|
||
<div class="flex flex-col gap-4">
|
||
<h2 class="font-medium">
|
||
Docker Model Runner
|
||
{{ partial "components/badge.html" (dict "color" "blue" "content" "Beta") }}
|
||
</h2>
|
||
<p class="text-xl">
|
||
Run, test, and serve AI models locally in seconds — no setup, no hassle.
|
||
</p>
|
||
<p>
|
||
Whether you’re experimenting with the latest LLMs or deploying to production,
|
||
Docker Model Runner brings the performance and control you need, without the friction.
|
||
|
||
</p>
|
||
</div>
|
||
<div class="flex flex-col xl:flex-row gap-4 items-start">
|
||
<a href="/desktop/features/model-runner/"
|
||
class="max-w-fit cursor-pointer rounded bg-blue-light px-4 py-2 text-white transition duration-300 hover:bg-blue-light-400 dark:bg-blue-dark-400 dark:hover:bg-blue-dark">Read the docs</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<h2 class="mb-4 text-xl">Browse by section</h2>
|
||
<div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
|
||
{{ range .Params.grid }}
|
||
<div>
|
||
<div
|
||
class="flex h-full flex-col gap-2 rounded border border-gray-light-100 bg-white p-4 drop-shadow-sm dark:border-gray-dark-400 dark:bg-gray-dark-200">
|
||
<div class="flex items-center gap-4">
|
||
<span class="icon-svg text-gray-light dark:text-gray-dark">{{ partial "icon" .icon }}</span>
|
||
<div>
|
||
<div class="text-xl">{{ .title }}</div>
|
||
</div>
|
||
</div>
|
||
<div class="flex h-full flex-col justify-between gap-4">
|
||
<p>{{ .description | markdownify }}</p>
|
||
<nav class="flex flex-col gap-2">
|
||
{{ range .links }}
|
||
<div>
|
||
<span class="icon-svg text-gray-light dark:text-gray-dark">{{ partial "icon" "arrow_right" }}</span>
|
||
<a class="link" href="{{ .url }}">{{ .text }}</a>
|
||
</div>
|
||
{{ end }}
|
||
</nav>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{{ end }}
|
||
</div>
|
||
</div>
|
||
<div class="flex flex-col gap-4">
|
||
<h2 class="mb-4 text-xl">Browse by tag</h2>
|
||
<div class="flex flex-wrap gap-4">
|
||
{{ $tags := slice }}
|
||
{{- range site.Taxonomies.tags }}
|
||
{{ $tags = $tags | append .Page }}
|
||
{{ end }}
|
||
{{ partial "tags.html" $tags }}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div
|
||
class="relative flex md:h-[334px] items-center justify-center overflow-hidden bg-gray-light-100 dark:bg-gray-dark-200 h-full py-8">
|
||
<div class="w-[1200px] px-4">
|
||
<div class="flex md:max-w-[66%] flex-col gap-8 max-w-full">
|
||
<h2 class="text-2xl">Community resources</h2>
|
||
<p>
|
||
Find fellow Docker enthusiasts, engage in insightful discussions,
|
||
share knowledge, and collaborate on projects. Our communities
|
||
offer a rich online experience for developers to create valuable
|
||
connections that challenge and inspire!
|
||
</p>
|
||
<div class="flex gap-4 flex-col md:flex-row">
|
||
<a href="https://forums.docker.com/"
|
||
class="cursor-pointer rounded bg-white px-4 py-2 text-blue-light hover:bg-gray-light-100 dark:bg-gray-dark-400 dark:text-white dark:hover:bg-gray-dark-500">
|
||
Visit Docker Forum
|
||
</a>
|
||
<a href="https://dockr.ly/comm-slack"
|
||
class="cursor-pointer rounded bg-white px-4 py-2 text-blue-light hover:bg-gray-light-100 dark:bg-gray-dark-400 dark:text-white dark:hover:bg-gray-dark-500">
|
||
Join Docker Slack
|
||
</a>
|
||
<a href="https://www.docker.com/community/captains/"
|
||
class="cursor-pointer rounded bg-white px-4 py-2 text-blue-light hover:bg-gray-light-100 dark:bg-gray-dark-400 dark:text-white dark:hover:bg-gray-dark-500">
|
||
Find your Docker Captain
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="absolute right-0 top-0 hidden md:block">
|
||
{{- (resources.Get "images/home-abstract-faint.svg").Content | safe.HTML -}}
|
||
</div>
|
||
</div>
|
||
</main>
|
||
<footer>{{ partialCached "footer.html" . }}</footer>
|
||
</body>
|
||
|
||
</html>
|