Skip to content

Commit 4a3f9e3

Browse files
homepage: update download component (#23978)
<!--Delete sections as needed --> ## Description This might be a my computer thing (because my computer probably isn't the fastest), but the component often flickers on load. - ~Removed x-collapse and~ added x-cloak to prevent the drop-down from appearing expanded before the js loads. - Changed the button text to static, so it's not waiting for the OS detection to load. ## Related issues or tickets ENGDOCS-3149 ## Reviews <!-- Notes for reviewers here --> <!-- List applicable reviews (optionally @tag reviewers) --> - [ ] Editorial review --------- Signed-off-by: Craig Osterhout <craig.osterhout@docker.com>
1 parent 319848a commit 4a3f9e3

1 file changed

Lines changed: 2 additions & 6 deletions

File tree

layouts/index.html

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -60,10 +60,6 @@
6060
'linux': 'Docker Desktop for Linux'
6161
};
6262
return labels[os === 'linux' ? 'linux' : `${os}-${arch}`] || 'Docker Desktop';
63-
},
64-
getPrimaryLabel() {
65-
if (this.os === 'unknown') return 'Download Docker Desktop';
66-
return this.getOsLabel(this.os, this.arch);
6763
}
6864
}"
6965
@click.outside="open = false">
@@ -83,7 +79,7 @@ <h1 class="text-xl">Get Docker</h1>
8379
<a :href="getDownloadUrl(os, arch)"
8480
class="bg-blue flex cursor-pointer items-center gap-2 p-2 px-4 text-white transition duration-300 hover:bg-blue-500 dark:bg-blue-500 dark:hover:bg-blue-400 whitespace-nowrap">
8581
<span class="icon-svg icon-sm">{{ partial "icon" "download" }}</span>
86-
<span x-text="getPrimaryLabel()">Download Docker Desktop</span>
82+
<span>Download Docker Desktop</span>
8783
</a>
8884
<button @click="open = !open" type="button"
8985
class="bg-blue flex items-center justify-center px-3 text-white border-l border-blue-400 hover:bg-blue-500 dark:bg-blue-500 dark:hover:bg-blue-400 transition duration-300"
@@ -93,7 +89,7 @@ <h1 class="text-xl">Get Docker</h1>
9389
</svg>
9490
</button>
9591
</div>
96-
<div x-show="open" x-collapse
92+
<div x-show="open" x-collapse x-cloak
9793
class="absolute top-full left-0 mt-1 min-w-full bg-white dark:bg-gray-800 rounded-sm shadow-lg overflow-hidden z-50">
9894
<a href="https://desktop.docker.com/mac/main/arm64/Docker.dmg?utm_source=docker&utm_medium=webreferral&utm_campaign=docs-driven-download-mac-arm64"
9995
class="block px-4 py-2 text-sm text-gray-700 dark:text-gray-200 hover:bg-gray-100 dark:hover:bg-gray-700 whitespace-nowrap">

0 commit comments

Comments
 (0)