diff --git a/docs/src/components/Elements/dropdown.js b/docs/src/components/Elements/dropdown.js index d895e21f2..95835575e 100644 --- a/docs/src/components/Elements/dropdown.js +++ b/docs/src/components/Elements/dropdown.js @@ -4,9 +4,26 @@ import { Menu, Transition } from "@headlessui/react"; import { ChevronDownIcon } from "@heroicons/react/20/solid"; const items = [ - { name: "Download for Mac (Intel)", href: "#" }, - { name: "Download for Windows", href: "#" }, - { name: "Download for Linux", href: "#" }, + { + name: "Download for Mac (M1/M2)", + href: "#", + logo: require("@site/static/img/apple-logo-white.png").default, + }, + { + name: "Download for Mac (Intel)", + href: "#", + logo: require("@site/static/img/apple-logo-white.png").default, + }, + { + name: "Download for Windows", + href: "#", + logo: require("@site/static/img/windows-logo-white.png").default, + }, + { + name: "Download for Linux", + href: "#", + logo: require("@site/static/img/linux-logo-white.png").default, + }, ]; function classNames(...classes) { @@ -15,7 +32,8 @@ function classNames(...classes) { export default function Dropdown() { return ( -
+
+ {/* TODO dynamically detect users OS through browser */}
{/* Desktop screenshot image full width */} diff --git a/docs/static/img/linux-logo-white.png b/docs/static/img/linux-logo-white.png new file mode 100644 index 000000000..453a84332 Binary files /dev/null and b/docs/static/img/linux-logo-white.png differ diff --git a/docs/static/img/windows-logo-white.png b/docs/static/img/windows-logo-white.png new file mode 100644 index 000000000..9986428ad Binary files /dev/null and b/docs/static/img/windows-logo-white.png differ