Skip to content

Commit

Permalink
Turn the download buttons into dropdowns (#676)
Browse files Browse the repository at this point in the history
  • Loading branch information
@javisperez
javisperez authored Jan 7, 2025
1 parent 4ba1aba commit 526e972
Show file tree
Hide file tree
Showing 2 changed files with 68 additions and 13 deletions.
3 changes: 2 additions & 1 deletion docs/.vitepress/theme/assets/css/tailwind.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -193,7 +193,8 @@
letter-spacing: 2.7px;
}

&:not(:disabled):hover {
&:not(:disabled):hover,
&:not(:disabled):focus {
@apply text-white;
background-color: var(--color-gold);
background-size: 0% 0%;
Expand Down
78 changes: 66 additions & 12 deletions docs/.vitepress/theme/components/Home.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -113,19 +113,73 @@ onMounted(() => {
<p class="h4 !font-normal !text-off-white">Simple, secure, and reproducible packaging for AI/ML projects</p>
<h1 class="mt-4">The missing link in your AI pipeline</h1>

<div class="flex flex-col lg:flex-row justify-center items-center gap-10 lg:gap-4 mt-10 md:mt-14 xl:mt-22">
<a href="/docs/cli/installation.html#%F0%9F%AA%9F-windows-install" class="kit-button flex items-center gap-2">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 fill-white" viewBox="0 0 4875 4875"><path d="M0 0h2311v2310H0zm2564 0h2311v2310H2564zM0 2564h2311v2311H0zm2564 0h2311v2311H2564"/></svg>
Download
</a>
<a href="/docs/cli/installation.html#%F0%9F%8D%8E-macos-install" class="kit-button flex items-center gap-2">
<div class="hidden lg:flex flex-col lg:flex-row justify-center items-center gap-10 lg:gap-4 mt-10 md:mt-14 xl:mt-22">
<div class="relative inline-block text-left group">
<button class="kit-button flex items-center gap-2">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 fill-white" viewBox="0 0 4875 4875">
<path d="M0 0h2311v2310H0zm2564 0h2311v2310H2564zM0 2564h2311v2311H0zm2564 0h2311v2311H2564"/>
</svg>
Download
</button>
<div class="absolute right-0 pt-2 whitespace-nowrap min-w-52 hidden group-hover:block group-focus-within:block">
<div class="py-1 bg-night border border-off-white mt-2" role="menu" aria-orientation="vertical" aria-labelledby="options-menu">
<a href="https://github.com/jozu-ai/kitops/releases/latest/download/kitops-windows-x86_64.zip"
target="_blank" class="block px-4 py-2 text-white hocus:text-night font-bold hocus:bg-gold" role="menuitem">
Intel / AMD, 64-bit
</a>
<a href="https://github.com/jozu-ai/kitops/releases/latest/download/kitops-windows-arm64.zip"
target="_blank" class="block px-4 py-2 text-white hocus:text-night font-bold hocus:bg-gold" role="menuitem">
ARM 64-bit
</a>
<a href="https://github.com/jozu-ai/kitops/releases/latest/download/kitops-windows-i386.zip"
target="_blank" class="block px-4 py-2 text-white hocus:text-night font-bold hocus:bg-gold" role="menuitem">
Intel / AMD, 32-bit
</a>
</div>
</div>
</div>

<div class="relative inline-block text-left group">
<button class="kit-button flex items-center gap-2">
<svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 fill-white" viewBox="0 0 814 1000"><path d="M788 341c-6 4-108 62-108 190 0 149 130 201 134 203-1 3-21 71-69 141-42 62-87 124-155 124s-86-40-164-40c-77 0-104 41-166 41s-106-57-156-127A612 612 0 0 1 0 542c0-195 126-298 251-298 66 0 121 44 163 44 39 0 101-46 176-46 28 0 131 2 198 99zM554 159c31-37 53-88 53-139 0-7 0-14-2-20-50 2-110 34-147 76-28 32-55 83-55 135l2 18 14 2c45 0 102-31 135-72z"/></svg>
Download
</a>
<a href="/docs/cli/installation.html#%F0%9F%90%A7-linux-install" class="kit-button flex items-center gap-2">
<svg xmlns="http://www.w3.org/2000/svg" version="1.0" class="w-5 h-5 fill-white" viewBox="0 0 266 312"><path d="m129 79-1 1h-1l-2-2-1-2 1-1 2 1 2 3m-18-10c0-5-2-8-5-8l-1 1v2h3l1 5h2m35-5c2 0 3 2 4 5h2l-1-3-1-3-3-2-2 1 1 2m-30 16-1-1 1-3 3-1 1 1-3 4h-1m-11-1c-4-2-5-5-5-10 0-3 0-5 2-7 1-2 3-3 5-3s3 1 5 3l2 9v2h1v-1l1-6c0-3 0-6-2-9s-4-5-8-5c-3 0-6 2-7 5-2 4-3 7-3 12 0 4 2 8 6 12l3-2m125 141 1-1c0-2-1-5-4-8s-8-5-14-5l-2-1h-6c3-10 4-18 4-25 0-10-2-17-6-23s-8-9-13-10l-1 2c5 2 10 6 13 12 3 7 4 13 4 20 0 6-1 14-5 25-4 1-8 5-11 11l1 1 2-3 5-5 8-2c5 0 10 0 13 2 4 1 6 3 7 4l3 4 1 2M138 75l-1-5c0-4 0-6 2-9l6-3c3 0 5 2 7 4l2 8c0 5-2 8-6 9l2 1 5 2 2-15c0-6-1-10-3-13-3-3-6-4-10-4l-9 3c-2 3-3 5-3 8 0 5 1 9 3 13l3 1m12 16c-13 9-23 13-31 13-7 0-14-3-20-8l3 5 6 6c4 4 9 6 14 6 7 0 15-4 25-11l9-6c2-2 4-4 4-7l-1-2c-1-2-6-5-16-8-9-4-16-6-20-6-3 0-8 2-15 6-6 4-10 8-10 12l2 3c6 5 12 8 18 8 8 0 18-4 31-14v2l1 1m23 202a21 21 0 0 0 25 10l5-1 3-2 3-2 17-15 13-8 10-5 7-4 2-6c0-2-2-5-4-6l-6-4-7-5c-2-2-4-6-5-11l-1-5-2-6-1-1-4 3-6 6-6 5-8 3c-8 0-12-2-15-7l-4-11c-2-2-3-2-5-2-5 0-7 5-7 15v31l-1 6-1 11-2 11m-145-5c9 1 20 4 32 9l22 6c7 0 13-3 18-9l1-7c0-9-6-21-18-35l-6-10-6-8-5-9a27 27 0 0 0-15-12c-4 1-7 2-9 4s-2 4-2 7l-2 4-5 1h-5c-6 0-9 1-11 2-3 3-4 6-4 10l1 8 1 9-3 12c-3 4-4 7-4 10 1 4 8 6 20 8m33-91c0-7 2-14 5-23 4-9 8-15 11-19l-1-1-1-1c-3 3-7 10-11 20-4 9-6 17-6 23l3 12c2 3 7 8 16 14l10 7c12 10 18 16 18 20 0 3-1 5-4 7l-7 4h-1l3 6c5 6 14 9 26 9 22 0 39-9 52-27l-1-10v-3c0-7 1-12 3-15s4-5 7-5l6 3 1-21c0-9 0-16-2-23l-5-15-6-9-5-9-2-12-8-15-6-14-9 7c-10 7-18 10-25 10-6 0-11-1-14-5l-6-5-3 11-7 12-4 14-1 4-8 15c-8 15-12 28-12 40l1 7c-5-3-7-7-7-13m72 95c-13 0-23 1-30 5-5 6-11 9-19 9-5 0-12-2-23-6a272 272 0 0 0-48-13c-3 0-5-1-6-3l-2-4 1-5 2-3 2-3 1-3 1-3v-3l-1-9-1-10c0-5 1-8 3-11s5-4 7-4h11l5-1 1-4 1-3 1-2 1-2-1-4v-2c0-4 2-9 6-16l3-6 7-14 5-18c2-7 6-14 12-21l7-9c6-6 9-11 11-15s3-9 3-13l-2-18a297 297 0 0 1 1-46c1-5 3-10 7-14 3-4 7-8 13-10a66 66 0 0 1 42 1 41 41 0 0 1 21 20l5 20 2 17 1 13 2 12 4 11 7 12 11 16c9 10 16 21 20 32a84 84 0 0 1 5 57c2 0 3 1 4 3l3 9 1 7c1 2 2 4 5 6l7 5 7 4 3 6c0 4-1 6-3 8l-7 4-12 6-15 11-10 8-11 9c-3 2-7 3-11 3l-7-1c-8-2-13-6-16-12l-37-3"/></svg>
Download
</a>
Download
</button>
<div class="absolute right-0 pt-2 whitespace-nowrap min-w-52 hidden group-hover:block group-focus-within:block">
<div class="py-1 bg-night border border-off-white mt-2" role="menu" aria-orientation="vertical" aria-labelledby="options-menu">
<a href="https://github.com/jozu-ai/kitops/releases/latest/download/kitops-darwin-arm64.zip"
target="_blank" class="block px-4 py-2 text-white hocus:text-night font-bold hocus:bg-gold" role="menuitem">
Apple Silicon / ARM64
</a>
<a href="https://github.com/jozu-ai/kitops/releases/latest/download/kitops-darwin-x86_64.zip"
target="_blank" class="block px-4 py-2 text-white hocus:text-night font-bold hocus:bg-gold" role="menuitem">
Intel / x86_64
</a>
</div>
</div>
</div>

<div class="relative inline-block text-left group">
<button class="kit-button flex items-center gap-2">
<svg xmlns="http://www.w3.org/2000/svg" version="1.0" class="w-5 h-5 fill-white" viewBox="0 0 266 312"><path d="m129 79-1 1h-1l-2-2-1-2 1-1 2 1 2 3m-18-10c0-5-2-8-5-8l-1 1v2h3l1 5h2m35-5c2 0 3 2 4 5h2l-1-3-1-3-3-2-2 1 1 2m-30 16-1-1 1-3 3-1 1 1-3 4h-1m-11-1c-4-2-5-5-5-10 0-3 0-5 2-7 1-2 3-3 5-3s3 1 5 3l2 9v2h1v-1l1-6c0-3 0-6-2-9s-4-5-8-5c-3 0-6 2-7 5-2 4-3 7-3 12 0 4 2 8 6 12l3-2m125 141 1-1c0-2-1-5-4-8s-8-5-14-5l-2-1h-6c3-10 4-18 4-25 0-10-2-17-6-23s-8-9-13-10l-1 2c5 2 10 6 13 12 3 7 4 13 4 20 0 6-1 14-5 25-4 1-8 5-11 11l1 1 2-3 5-5 8-2c5 0 10 0 13 2 4 1 6 3 7 4l3 4 1 2M138 75l-1-5c0-4 0-6 2-9l6-3c3 0 5 2 7 4l2 8c0 5-2 8-6 9l2 1 5 2 2-15c0-6-1-10-3-13-3-3-6-4-10-4l-9 3c-2 3-3 5-3 8 0 5 1 9 3 13l3 1m12 16c-13 9-23 13-31 13-7 0-14-3-20-8l3 5 6 6c4 4 9 6 14 6 7 0 15-4 25-11l9-6c2-2 4-4 4-7l-1-2c-1-2-6-5-16-8-9-4-16-6-20-6-3 0-8 2-15 6-6 4-10 8-10 12l2 3c6 5 12 8 18 8 8 0 18-4 31-14v2l1 1m23 202a21 21 0 0 0 25 10l5-1 3-2 3-2 17-15 13-8 10-5 7-4 2-6c0-2-2-5-4-6l-6-4-7-5c-2-2-4-6-5-11l-1-5-2-6-1-1-4 3-6 6-6 5-8 3c-8 0-12-2-15-7l-4-11c-2-2-3-2-5-2-5 0-7 5-7 15v31l-1 6-1 11-2 11m-145-5c9 1 20 4 32 9l22 6c7 0 13-3 18-9l1-7c0-9-6-21-18-35l-6-10-6-8-5-9a27 27 0 0 0-15-12c-4 1-7 2-9 4s-2 4-2 7l-2 4-5 1h-5c-6 0-9 1-11 2-3 3-4 6-4 10l1 8 1 9-3 12c-3 4-4 7-4 10 1 4 8 6 20 8m33-91c0-7 2-14 5-23 4-9 8-15 11-19l-1-1-1-1c-3 3-7 10-11 20-4 9-6 17-6 23l3 12c2 3 7 8 16 14l10 7c12 10 18 16 18 20 0 3-1 5-4 7l-7 4h-1l3 6c5 6 14 9 26 9 22 0 39-9 52-27l-1-10v-3c0-7 1-12 3-15s4-5 7-5l6 3 1-21c0-9 0-16-2-23l-5-15-6-9-5-9-2-12-8-15-6-14-9 7c-10 7-18 10-25 10-6 0-11-1-14-5l-6-5-3 11-7 12-4 14-1 4-8 15c-8 15-12 28-12 40l1 7c-5-3-7-7-7-13m72 95c-13 0-23 1-30 5-5 6-11 9-19 9-5 0-12-2-23-6a272 272 0 0 0-48-13c-3 0-5-1-6-3l-2-4 1-5 2-3 2-3 1-3 1-3v-3l-1-9-1-10c0-5 1-8 3-11s5-4 7-4h11l5-1 1-4 1-3 1-2 1-2-1-4v-2c0-4 2-9 6-16l3-6 7-14 5-18c2-7 6-14 12-21l7-9c6-6 9-11 11-15s3-9 3-13l-2-18a297 297 0 0 1 1-46c1-5 3-10 7-14 3-4 7-8 13-10a66 66 0 0 1 42 1 41 41 0 0 1 21 20l5 20 2 17 1 13 2 12 4 11 7 12 11 16c9 10 16 21 20 32a84 84 0 0 1 5 57c2 0 3 1 4 3l3 9 1 7c1 2 2 4 5 6l7 5 7 4 3 6c0 4-1 6-3 8l-7 4-12 6-15 11-10 8-11 9c-3 2-7 3-11 3l-7-1c-8-2-13-6-16-12l-37-3"/></svg>
Download
</button>
<div class="absolute right-0 pt-2 whitespace-nowrap min-w-52 hidden group-hover:block group-focus-within:block">
<div class="py-1 bg-night border border-off-white mt-2" role="menu" aria-orientation="vertical" aria-labelledby="options-menu">
<a href="https://github.com/jozu-ai/kitops/releases/latest/download/kitops-linux-x86_64.tar.gz"
target="_blank" class="block px-4 py-2 text-white hocus:text-night font-bold hocus:bg-gold" role="menuitem">
Intel / AMD, 64-bit
</a>
<a href="https://github.com/jozu-ai/kitops/releases/latest/download/kitops-linux-arm64.tar.gz"
target="_blank" class="block px-4 py-2 text-white hocus:text-night font-bold hocus:bg-gold" role="menuitem">
ARM 64-bit
</a>
<a href="https://github.com/jozu-ai/kitops/releases/latest/download/kitops-linux-i386.tar.gz"
target="_blank" class="block px-4 py-2 text-white hocus:text-night font-bold hocus:bg-gold" role="menuitem">
Intel / AMD, 32-bit
</a>
</div>
</div>
</div>
</div>
</div>

Expand Down

0 comments on commit 526e972

Please sign in to comment.