diff --git a/website/components/merch-desktop-client/img/apple-logo.svg b/website/components/merch-desktop-client/img/apple-logo.svg deleted file mode 100644 index 9ed72adff..000000000 --- a/website/components/merch-desktop-client/img/apple-logo.svg +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - - - - diff --git a/website/components/merch-desktop-client/img/darwin.svg b/website/components/merch-desktop-client/img/darwin.svg new file mode 100644 index 000000000..45070462b --- /dev/null +++ b/website/components/merch-desktop-client/img/darwin.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/website/components/merch-desktop-client/img/freebsd.svg b/website/components/merch-desktop-client/img/freebsd.svg new file mode 100644 index 000000000..f880497a7 --- /dev/null +++ b/website/components/merch-desktop-client/img/freebsd.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/website/components/merch-desktop-client/img/linux.svg b/website/components/merch-desktop-client/img/linux.svg new file mode 100644 index 000000000..3c62ccf88 --- /dev/null +++ b/website/components/merch-desktop-client/img/linux.svg @@ -0,0 +1,112 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/website/components/merch-desktop-client/img/openbsd.svg b/website/components/merch-desktop-client/img/openbsd.svg new file mode 100644 index 000000000..14bb3cc1d --- /dev/null +++ b/website/components/merch-desktop-client/img/openbsd.svg @@ -0,0 +1,742 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/website/components/merch-desktop-client/img/solaris.svg b/website/components/merch-desktop-client/img/solaris.svg new file mode 100644 index 000000000..0010ee174 --- /dev/null +++ b/website/components/merch-desktop-client/img/solaris.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/website/components/merch-desktop-client/img/windows.svg b/website/components/merch-desktop-client/img/windows.svg new file mode 100644 index 000000000..dd98c79c5 --- /dev/null +++ b/website/components/merch-desktop-client/img/windows.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/website/components/merch-desktop-client/index.jsx b/website/components/merch-desktop-client/index.jsx index b247464e9..168705652 100644 --- a/website/components/merch-desktop-client/index.jsx +++ b/website/components/merch-desktop-client/index.jsx @@ -4,29 +4,68 @@ import InlineSvg from '@hashicorp/react-inline-svg' export default function MerchDesktopDownload({ version, releases }) { const { builds } = releases.versions[version] + // Calculate all Operating Systems that we have versions for + // and place their respective builds under them + const operatingSystems = builds + .map((build) => { + return build.os + }) + .filter((value, index, self) => { + // Parse out duplicates + return self.indexOf(value) === index + }) + .map((os) => { + // Add the respective builds under their OS + return { + os: os, + builds: builds.filter((build) => { + return build.os === os + }), + } + }) + return (
- Desktop Client -
- - {version} -
-
- {builds.map((build) => ( - - .{getFileExtension(build.filename)} - - ))} -
+ Desktop Client - {version} +
) } +function humanArch(arch) { + if (arch === '386') { + return '32-bit' + } + if (arch === 'amd64') { + return '64-bit' + } + return arch +} + function getFileExtension(filename) { return filename.substring(filename.lastIndexOf('.') + 1, filename.length) } diff --git a/website/components/merch-desktop-client/merch-desktop-client.module.css b/website/components/merch-desktop-client/merch-desktop-client.module.css index 4ac7b3892..8d84eb068 100644 --- a/website/components/merch-desktop-client/merch-desktop-client.module.css +++ b/website/components/merch-desktop-client/merch-desktop-client.module.css @@ -5,48 +5,53 @@ justify-content: center; min-height: 193px; padding: 40px 50px; -} -.wrapper { - display: flex; - flex-direction: column; - justify-content: space-between; - align-content: center; - text-align: center; -} + & .wrapper { + display: flex; + flex-direction: column; + align-content: center; + text-align: center; -.title { - font-family: var(--font-display); - font-size: 12px; - line-height: 18px; - letter-spacing: 0.06em; - text-transform: uppercase; - color: var(--gray-4); - font-weight: bold; -} - -.platformVersion { - display: flex; - align-content: center; - justify-content: center; - - & .logo { - margin-right: 20px; + & .title { + font-family: var(--font-display); + font-size: 12px; + line-height: 18px; + letter-spacing: 0.06em; + text-transform: uppercase; + color: var(--gray-4); + font-weight: bold; + } } - & .version { - align-self: center; - } -} + & .downloadsList { + display: flex; + flex-direction: column; + list-style: none; + margin-top: 22px; + margin-bottom: 0; + padding: 0; -.downloadLinks { - color: var(--brand); + & > li { + display: flex; + align-items: center; + &:not(:last-of-type) { + margin-bottom: 12px; + } - & a { - margin-right: 20px; + & svg { + max-height: 40px; + } - &:last-child { - margin-right: 0; + & .versionsList { + display: flex; + flex-wrap: wrap; + list-style: none; + margin: 0; + padding: 0; + & > .versionDownload { + margin-left: 10px; + } + } } } }