From 9412a8409b8d26483ea84685cbec15ddfd2ab4c2 Mon Sep 17 00:00:00 2001 From: Bryce Kalow Date: Thu, 5 May 2022 09:53:22 -0500 Subject: [PATCH] website: remove source code and related CI jobs (#12596) * remove website source code and related circle jobs * remove data files * updates platform-cli * update local instructions * updates package-lock --- .circleci/config.yml | 70 - website/.gitignore | 2 + website/Dockerfile | 8 - website/Makefile | 80 +- website/README.md | 28 +- website/components/basic-hero/index.jsx | 34 - website/components/basic-hero/style.css | 36 - .../case-study-carousel/case-study-slide.jsx | 44 - .../img/active-control-dot.svg | 1 - .../img/inactive-control-dot.svg | 1 - .../img/left-arrow-control.svg | 1 - .../case-study-carousel/img/quote.svg | 3 - .../img/right-arrow-control.svg | 1 - .../components/case-study-carousel/index.jsx | 90 - .../components/case-study-carousel/style.css | 251 - .../components/comparison-callouts/index.jsx | 38 - .../comparison-callouts/style.module.css | 60 - website/components/downloads-props/index.jsx | 38 - .../components/enterprise-info/img/arrow.svg | 4 - .../components/enterprise-info/img/basic.svg | 1 - .../enterprise-info/img/complex.svg | 1 - website/components/enterprise-info/index.jsx | 47 - website/components/enterprise-info/nomad.jsx | 37 - website/components/enterprise-info/style.css | 92 - website/components/features-list/index.jsx | 27 - website/components/features-list/style.css | 99 - website/components/footer/index.jsx | 29 - website/components/footer/style.css | 32 - website/components/homepage-hero/index.jsx | 33 - website/components/homepage-hero/style.css | 39 - .../components/io-card-container/index.tsx | 82 - .../io-card-container/style.module.css | 114 - website/components/io-card/index.tsx | 124 - website/components/io-card/product-logos.ts | 34 - website/components/io-card/style.module.css | 148 - website/components/io-dialog/index.tsx | 47 - website/components/io-dialog/style.module.css | 62 - .../io-home-call-to-action/index.tsx | 39 - .../io-home-call-to-action/style.module.css | 12 - .../components/io-home-case-studies/index.tsx | 80 - .../io-home-case-studies/style.module.css | 171 - website/components/io-home-feature/index.tsx | 71 - .../io-home-feature/style.module.css | 79 - website/components/io-home-hero/index.tsx | 135 - .../components/io-home-hero/style.module.css | 148 - .../components/io-home-in-practice/index.tsx | 86 - .../io-home-in-practice/style.module.css | 98 - website/components/io-home-intro/index.tsx | 151 - .../components/io-home-intro/style.module.css | 169 - .../components/io-home-pre-footer/index.tsx | 79 - .../io-home-pre-footer/style.module.css | 119 - .../io-usecase-call-to-action/index.tsx | 71 - .../style.module.css | 66 - .../components/io-usecase-customer/index.tsx | 86 - .../io-usecase-customer/style.module.css | 118 - website/components/io-usecase-hero/index.tsx | 41 - .../components/io-usecase-hero/pattern.svg | 1 - .../io-usecase-hero/style.module.css | 83 - .../components/io-usecase-section/index.tsx | 81 - .../io-usecase-section/style.module.css | 106 - website/components/io-video-callout/index.tsx | 84 - .../components/io-video-callout/play-icon.tsx | 23 - .../io-video-callout/style.module.css | 128 - website/components/mini-cta/index.jsx | 23 - website/components/mini-cta/style.css | 36 - website/components/placement-table/index.jsx | 42 - website/components/placement-table/style.css | 13 - website/components/subnav/index.jsx | 32 - website/components/subnav/style.module.css | 3 - website/components/use-case-page/index.jsx | 49 - website/components/use-case-page/style.css | 40 - website/data/alert-banner.js | 11 - website/data/metadata.js | 2 - website/data/subnav.js | 41 - website/data/version.js | 1 - website/global.d.ts | 1 - website/jsconfig.json | 6 - website/layouts/standard/index.tsx | 78 - website/layouts/standard/query.graphql | 6 - website/lib/consent-manager-services/index.ts | 15 - website/lib/utils.ts | 11 - website/next-env.d.ts | 5 - website/next.config.js | 34 - website/package-lock.json | 31549 +++++----------- website/package.json | 65 +- website/pages/404.jsx | 2 - website/pages/_app.js | 69 - website/pages/_document.js | 29 - website/pages/_error.jsx | 14 - website/pages/api-docs/[[...page]].jsx | 36 - website/pages/community/index.jsx | 49 - website/pages/community/style.module.css | 9 - website/pages/docs/[[...page]].jsx | 39 - website/pages/downloads/enterprise.jsx | 38 - website/pages/downloads/index.jsx | 30 - website/pages/downloads/style.module.css | 24 - website/pages/home/img/learn-nomad/cap.svg | 5 - website/pages/home/img/learn-nomad/cubes.svg | 9 - .../img/nomad-vs-kubernetes/alternative.svg | 1 - .../img/nomad-vs-kubernetes/supplement.svg | 1 - website/pages/home/img/partner-logos/cni.svg | 1 - website/pages/home/img/partner-logos/csi.svg | 1 - .../pages/home/img/partner-logos/datadog.svg | 1 - .../pages/home/img/partner-logos/github.svg | 1 - .../gitlab-logo-gray-stacked-rgb.svg | 1 - .../pages/home/img/partner-logos/jfrog.svg | 1 - .../pages/home/img/partner-logos/nvidia.svg | 1 - .../home/img/partner-logos/prometheus.svg | 1 - .../automated_service_networking_icon.svg | 1 - .../non-containerized_app_orch_icon.svg | 1 - .../simple_container_orchestration_icon.svg | 1 - .../pages/home/img/why-nomad/federation.svg | 1 - .../why-nomad/flexible-workload-support.svg | 1 - .../modernize-legacy-applications.svg | 1 - .../home/img/why-nomad/native-integration.svg | 1 - .../pages/home/img/why-nomad/performance.svg | 1 - website/pages/home/img/why-nomad/servers.svg | 1 - .../img/why-nomad/simple-and-lightweight.svg | 1 - website/pages/home/index.tsx | 180 - website/pages/home/query.graphql | 109 - website/pages/home/style.module.css | 15 - website/pages/index.jsx | 3 - website/pages/intro/[[...page]].jsx | 36 - website/pages/not-found/index.jsx | 30 - website/pages/not-found/style.module.css | 36 - website/pages/plugins/[[...page]].tsx | 27 - website/pages/print.css | 229 - website/pages/security/index.jsx | 10 - website/pages/style.css | 49 - website/pages/tools/[[...page]].tsx | 27 - website/pages/use-cases/[slug].tsx | 244 - website/pages/use-cases/query.graphql | 94 - website/pages/use-cases/style.module.css | 34 - website/scripts/index_search_content.js | 3 - website/scripts/website-build.sh | 31 + website/scripts/website-start.sh | 25 + website/tsconfig.json | 30 - 137 files changed, 9388 insertions(+), 28423 deletions(-) delete mode 100644 website/Dockerfile delete mode 100644 website/components/basic-hero/index.jsx delete mode 100644 website/components/basic-hero/style.css delete mode 100644 website/components/case-study-carousel/case-study-slide.jsx delete mode 100644 website/components/case-study-carousel/img/active-control-dot.svg delete mode 100644 website/components/case-study-carousel/img/inactive-control-dot.svg delete mode 100644 website/components/case-study-carousel/img/left-arrow-control.svg delete mode 100644 website/components/case-study-carousel/img/quote.svg delete mode 100644 website/components/case-study-carousel/img/right-arrow-control.svg delete mode 100644 website/components/case-study-carousel/index.jsx delete mode 100644 website/components/case-study-carousel/style.css delete mode 100644 website/components/comparison-callouts/index.jsx delete mode 100644 website/components/comparison-callouts/style.module.css delete mode 100644 website/components/downloads-props/index.jsx delete mode 100644 website/components/enterprise-info/img/arrow.svg delete mode 100644 website/components/enterprise-info/img/basic.svg delete mode 100644 website/components/enterprise-info/img/complex.svg delete mode 100644 website/components/enterprise-info/index.jsx delete mode 100644 website/components/enterprise-info/nomad.jsx delete mode 100644 website/components/enterprise-info/style.css delete mode 100644 website/components/features-list/index.jsx delete mode 100644 website/components/features-list/style.css delete mode 100644 website/components/footer/index.jsx delete mode 100644 website/components/footer/style.css delete mode 100644 website/components/homepage-hero/index.jsx delete mode 100644 website/components/homepage-hero/style.css delete mode 100644 website/components/io-card-container/index.tsx delete mode 100644 website/components/io-card-container/style.module.css delete mode 100644 website/components/io-card/index.tsx delete mode 100644 website/components/io-card/product-logos.ts delete mode 100644 website/components/io-card/style.module.css delete mode 100644 website/components/io-dialog/index.tsx delete mode 100644 website/components/io-dialog/style.module.css delete mode 100644 website/components/io-home-call-to-action/index.tsx delete mode 100644 website/components/io-home-call-to-action/style.module.css delete mode 100644 website/components/io-home-case-studies/index.tsx delete mode 100644 website/components/io-home-case-studies/style.module.css delete mode 100644 website/components/io-home-feature/index.tsx delete mode 100644 website/components/io-home-feature/style.module.css delete mode 100644 website/components/io-home-hero/index.tsx delete mode 100644 website/components/io-home-hero/style.module.css delete mode 100644 website/components/io-home-in-practice/index.tsx delete mode 100644 website/components/io-home-in-practice/style.module.css delete mode 100644 website/components/io-home-intro/index.tsx delete mode 100644 website/components/io-home-intro/style.module.css delete mode 100644 website/components/io-home-pre-footer/index.tsx delete mode 100644 website/components/io-home-pre-footer/style.module.css delete mode 100644 website/components/io-usecase-call-to-action/index.tsx delete mode 100644 website/components/io-usecase-call-to-action/style.module.css delete mode 100644 website/components/io-usecase-customer/index.tsx delete mode 100644 website/components/io-usecase-customer/style.module.css delete mode 100644 website/components/io-usecase-hero/index.tsx delete mode 100644 website/components/io-usecase-hero/pattern.svg delete mode 100644 website/components/io-usecase-hero/style.module.css delete mode 100644 website/components/io-usecase-section/index.tsx delete mode 100644 website/components/io-usecase-section/style.module.css delete mode 100644 website/components/io-video-callout/index.tsx delete mode 100644 website/components/io-video-callout/play-icon.tsx delete mode 100644 website/components/io-video-callout/style.module.css delete mode 100644 website/components/mini-cta/index.jsx delete mode 100644 website/components/mini-cta/style.css delete mode 100644 website/components/placement-table/index.jsx delete mode 100644 website/components/placement-table/style.css delete mode 100644 website/components/subnav/index.jsx delete mode 100644 website/components/subnav/style.module.css delete mode 100644 website/components/use-case-page/index.jsx delete mode 100644 website/components/use-case-page/style.css delete mode 100644 website/data/alert-banner.js delete mode 100644 website/data/metadata.js delete mode 100644 website/data/subnav.js delete mode 100644 website/data/version.js delete mode 100644 website/global.d.ts delete mode 100644 website/jsconfig.json delete mode 100644 website/layouts/standard/index.tsx delete mode 100644 website/layouts/standard/query.graphql delete mode 100644 website/lib/consent-manager-services/index.ts delete mode 100644 website/lib/utils.ts delete mode 100644 website/next-env.d.ts delete mode 100644 website/next.config.js delete mode 100644 website/pages/404.jsx delete mode 100644 website/pages/_app.js delete mode 100644 website/pages/_document.js delete mode 100644 website/pages/_error.jsx delete mode 100644 website/pages/api-docs/[[...page]].jsx delete mode 100644 website/pages/community/index.jsx delete mode 100644 website/pages/community/style.module.css delete mode 100644 website/pages/docs/[[...page]].jsx delete mode 100644 website/pages/downloads/enterprise.jsx delete mode 100644 website/pages/downloads/index.jsx delete mode 100644 website/pages/downloads/style.module.css delete mode 100644 website/pages/home/img/learn-nomad/cap.svg delete mode 100644 website/pages/home/img/learn-nomad/cubes.svg delete mode 100644 website/pages/home/img/nomad-vs-kubernetes/alternative.svg delete mode 100644 website/pages/home/img/nomad-vs-kubernetes/supplement.svg delete mode 100644 website/pages/home/img/partner-logos/cni.svg delete mode 100644 website/pages/home/img/partner-logos/csi.svg delete mode 100644 website/pages/home/img/partner-logos/datadog.svg delete mode 100644 website/pages/home/img/partner-logos/github.svg delete mode 100644 website/pages/home/img/partner-logos/gitlab-logo-gray-stacked-rgb.svg delete mode 100644 website/pages/home/img/partner-logos/jfrog.svg delete mode 100644 website/pages/home/img/partner-logos/nvidia.svg delete mode 100644 website/pages/home/img/partner-logos/prometheus.svg delete mode 100644 website/pages/home/img/use-cases/automated_service_networking_icon.svg delete mode 100644 website/pages/home/img/use-cases/non-containerized_app_orch_icon.svg delete mode 100644 website/pages/home/img/use-cases/simple_container_orchestration_icon.svg delete mode 100644 website/pages/home/img/why-nomad/federation.svg delete mode 100644 website/pages/home/img/why-nomad/flexible-workload-support.svg delete mode 100644 website/pages/home/img/why-nomad/modernize-legacy-applications.svg delete mode 100644 website/pages/home/img/why-nomad/native-integration.svg delete mode 100644 website/pages/home/img/why-nomad/performance.svg delete mode 100644 website/pages/home/img/why-nomad/servers.svg delete mode 100644 website/pages/home/img/why-nomad/simple-and-lightweight.svg delete mode 100644 website/pages/home/index.tsx delete mode 100644 website/pages/home/query.graphql delete mode 100644 website/pages/home/style.module.css delete mode 100644 website/pages/index.jsx delete mode 100644 website/pages/intro/[[...page]].jsx delete mode 100644 website/pages/not-found/index.jsx delete mode 100644 website/pages/not-found/style.module.css delete mode 100644 website/pages/plugins/[[...page]].tsx delete mode 100644 website/pages/print.css delete mode 100644 website/pages/security/index.jsx delete mode 100644 website/pages/style.css delete mode 100644 website/pages/tools/[[...page]].tsx delete mode 100644 website/pages/use-cases/[slug].tsx delete mode 100644 website/pages/use-cases/query.graphql delete mode 100644 website/pages/use-cases/style.module.css delete mode 100644 website/scripts/index_search_content.js create mode 100755 website/scripts/website-build.sh create mode 100755 website/scripts/website-start.sh delete mode 100644 website/tsconfig.json diff --git a/.circleci/config.yml b/.circleci/config.yml index bb58b0ac7..476aef4c3 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -158,43 +158,6 @@ commands: fi jobs: - website-docker-image: - docker: - - image: docker.mirror.hashicorp.services/circleci/buildpack-deps - shell: /usr/bin/env bash -euo pipefail -c - steps: - - checkout - - run: - name: Skip building if nothing changed - command: | - # There is an edge case that would cause an issue here - if dependencies are updated to an exact copy - # of a previous version, for example if packge-lock.json is reverted, we need to manually push the new - # image to the "latest" tag - # Ignore job if running an enterprise build - IMAGE_TAG=$(cat website/Dockerfile website/package-lock.json | sha256sum | awk '{print $1;}') - echo "Using $IMAGE_TAG" - - if [ "$CIRCLE_REPOSITORY_URL" != "git@github.com:hashicorp/nomad.git" ]; then - echo "Not Nomad OSS Repo, not building website docker image" - circleci-agent step halt - elif curl https://hub.docker.com/v2/repositories/hashicorp/nomad-website/tags/$IMAGE_TAG -fsL > /dev/null; then - echo "Dependencies have not changed, not building a new website docker image." - circleci-agent step halt - fi - - - setup_remote_docker - - run: - name: Build Docker Image - command: | - IMAGE_TAG=$(cat website/Dockerfile website/package-lock.json | sha256sum | awk '{print $1;}') - echo "Using $IMAGE_TAG" - - cd website/ - docker build -t hashicorp/nomad-website:$IMAGE_TAG . - docker tag hashicorp/nomad-website:$IMAGE_TAG hashicorp/nomad-website:latest - docker login -u $WEBSITE_DOCKER_USER -p $WEBSITE_DOCKER_PASS - docker push hashicorp/nomad-website - test-windows: executor: go-windows @@ -489,22 +452,6 @@ jobs: - store_artifacts: path: /tmp/ui-assets destination: /ui-assets - algolia_index: - docker: - - image: docker.mirror.hashicorp.services/node:14 - steps: - - checkout - - run: - name: Push content to Algolia Index - command: | - if [ "$CIRCLE_REPOSITORY_URL" != "git@github.com:hashicorp/nomad.git" ]; then - echo "Not Nomad OSS Repo, not indexing Algolia" - exit 0 - fi - - cd website/ - npm install - node scripts/index_search_content.js executors: go: working_directory: /go/src/github.com/hashicorp/nomad @@ -642,20 +589,3 @@ workflows: test_packages: "./client/fingerprint" goarch: "386" filters: *backend_test_branches_filter - website: - when: - equal: [ "https://github.com/hashicorp/nomad", << pipeline.project.git_url >> ] - jobs: - - website-docker-image: - context: static-sites - filters: - branches: - only: - - main - - - algolia_index: - context: static-sites - filters: - branches: - only: - - stable-website diff --git a/website/.gitignore b/website/.gitignore index f93e0e403..adaccf90d 100644 --- a/website/.gitignore +++ b/website/.gitignore @@ -7,3 +7,5 @@ out # As per Next.js conventions (https://nextjs.org/docs/basic-features/environment-variables#default-environment-variables) .env*.local !.env* + +website-preview diff --git a/website/Dockerfile b/website/Dockerfile deleted file mode 100644 index f8cbf4159..000000000 --- a/website/Dockerfile +++ /dev/null @@ -1,8 +0,0 @@ -FROM docker.mirror.hashicorp.services/node:14.17.0-alpine -RUN apk add --update --no-cache git make g++ automake autoconf libtool nasm libpng-dev - -COPY ./package.json /website/package.json -COPY ./package-lock.json /website/package-lock.json -WORKDIR /website -RUN npm install -g npm@latest -RUN npm install diff --git a/website/Makefile b/website/Makefile index 5b71c4b8a..05ac7f9a6 100644 --- a/website/Makefile +++ b/website/Makefile @@ -1,54 +1,38 @@ +.DEFAULT_GOAL := website + +PWD=$$(pwd) +DOCKER_IMAGE="hashicorp/dev-portal" +DOCKER_IMAGE_LOCAL="dev-portal-local" +DOCKER_RUN_FLAGS=-it \ + --publish "3000:3000" \ + --rm \ + --tty \ + --volume "$(PWD)/content:/app/content" \ + --volume "$(PWD)/public:/app/public" \ + --volume "$(PWD)/data:/app/data" \ + --volume "$(PWD)/redirects.js:/app/redirects.js" \ + --volume "next-dir:/app/website-preview/.next" \ + --volume "$(PWD)/.env:/app/.env" \ + -e "REPO=nomad" + # Default: run this if working on the website locally to run in watch mode. +.PHONY: website website: @echo "==> Downloading latest Docker image..." - @docker pull hashicorp/nomad-website - @echo "==> Starting website in Docker..." - @docker run \ - --interactive \ - --rm \ - --tty \ - --workdir "/website" \ - --volume "$(shell pwd):/website" \ - --volume "/website/node_modules" \ - --publish "3000:3000" \ - hashicorp/nomad-website \ - npm start + @docker pull $(DOCKER_IMAGE) + @echo "==> Starting website..." + @docker run $(DOCKER_RUN_FLAGS) $(DOCKER_IMAGE) -# This command will generate a static version of the website to the "out" folder. -build: - @echo "==> Downloading latest Docker image..." - @docker pull hashicorp/nomad-website - @echo "==> Starting build in Docker..." - @docker run \ - --interactive \ - --rm \ - --tty \ - --workdir "/website" \ - --volume "$(shell pwd):/website" \ - --volume "/website/node_modules" \ - hashicorp/nomad-website \ - npm run static +# Use this if you have run `website/build-local` to use the locally built image. +.PHONY: website/local +website/local: + @echo "==> Starting website from local image..." + @docker run $(DOCKER_RUN_FLAGS) $(DOCKER_IMAGE_LOCAL) -# If you are changing node dependencies locally, run this to generate a new -# local Docker image with the dependency changes included. -build-image: - @echo "==> Building Docker image..." - @docker build -t hashicorp-nomad-website-local . +# Run this to generate a new local Docker image. +.PHONY: website/build-local +website/build-local: + @echo "==> Building local Docker image" + @docker build https://github.com/hashicorp/dev-portal.git\#main \ + -t $(DOCKER_IMAGE_LOCAL) -# Use this if you have run `build-image` to use the locally built image -# rather than our CI-generated image to test dependency changes. -website-local: - @echo "==> Starting website in Docker..." - @docker run \ - --interactive \ - --rm \ - --tty \ - --workdir "/website" \ - --volume "$(shell pwd):/website" \ - --volume "/website/node_modules" \ - --publish "3000:3000" \ - hashicorp-nomad-website-local \ - npm start - -.DEFAULT_GOAL := website -.PHONY: build build-image website website-local diff --git a/website/README.md b/website/README.md index b5f3368d1..23bf2b6ae 100644 --- a/website/README.md +++ b/website/README.md @@ -1,6 +1,6 @@ # Nomad Documentation Website -This subdirectory contains the entire source for the [Nomad Website](https://nomadproject.io/). This is a [NextJS](https://nextjs.org/) project, which builds a static site from these source files. +This subdirectory contains the content for the [Nomad Website](https://nomadproject.io/). @@ -77,7 +90,6 @@ This file can be standard Markdown and also supports [YAML frontmatter](https:// title: 'My Title' description: "A thorough, yet succinct description of the page's contents" --- - ``` The significant keys in the YAML frontmatter are: diff --git a/website/components/basic-hero/index.jsx b/website/components/basic-hero/index.jsx deleted file mode 100644 index 5749779b4..000000000 --- a/website/components/basic-hero/index.jsx +++ /dev/null @@ -1,34 +0,0 @@ -import Button from '@hashicorp/react-button' - -export default function BasicHero({ heading, content, links }) { - return ( -
-
-

{heading}

-

{content}

- {links && ( -
- {links.map((link, stableIdx) => { - const buttonVariant = stableIdx === 0 ? 'primary' : 'secondary' - const linkType = link.type || 'inbound' - return ( -
- )} -
-
- ) -} diff --git a/website/components/basic-hero/style.css b/website/components/basic-hero/style.css deleted file mode 100644 index df341899f..000000000 --- a/website/components/basic-hero/style.css +++ /dev/null @@ -1,36 +0,0 @@ -.g-basic-hero { - padding: 88px 0; - - & .g-type-display-1 { - color: var(--gray-1); - text-align: center; - margin-left: auto; - margin-right: auto; - margin-top: 0; - max-width: 14em; - } - - & .g-type-body-large { - color: var(--gray-2); - margin: 0 auto 0 auto; - text-align: center; - max-width: 40em; - } - - & .links { - display: flex; - flex-wrap: wrap; - justify-content: center; - gap: 16px; - - /* - * Margins here compensate for extra 8px margin on buttons - * which are needed to center and space properly regardless of whether - * buttons are wrapping to multiple lines or not. - */ - margin-top: calc(32px - 8px); - @media (--large) { - margin-top: calc(40px - 8px); - } - } -} diff --git a/website/components/case-study-carousel/case-study-slide.jsx b/website/components/case-study-carousel/case-study-slide.jsx deleted file mode 100644 index 79e1dfda4..000000000 --- a/website/components/case-study-carousel/case-study-slide.jsx +++ /dev/null @@ -1,44 +0,0 @@ -import InlineSvg from '@hashicorp/react-inline-svg' -import Image from '@hashicorp/react-image' -import Button from '@hashicorp/react-button' -import QuoteMarksIcon from './img/quote.svg?include' - -export default function CaseStudySlide({ - caseStudy: { person, quote, company, caseStudyURL }, -}) { - return ( -
- -

{quote}

-
-
- {`${person.firstName} -
-
- {person.firstName} {person.lastName} -
-

- {person.title}, {company.name} -

-
-
- {company.name} -
-
- ) -} diff --git a/website/components/case-study-carousel/img/active-control-dot.svg b/website/components/case-study-carousel/img/active-control-dot.svg deleted file mode 100644 index ee15572f4..000000000 --- a/website/components/case-study-carousel/img/active-control-dot.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/website/components/case-study-carousel/img/inactive-control-dot.svg b/website/components/case-study-carousel/img/inactive-control-dot.svg deleted file mode 100644 index c28dc9680..000000000 --- a/website/components/case-study-carousel/img/inactive-control-dot.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/website/components/case-study-carousel/img/left-arrow-control.svg b/website/components/case-study-carousel/img/left-arrow-control.svg deleted file mode 100644 index 0cec5c4b6..000000000 --- a/website/components/case-study-carousel/img/left-arrow-control.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/website/components/case-study-carousel/img/quote.svg b/website/components/case-study-carousel/img/quote.svg deleted file mode 100644 index fcea4e107..000000000 --- a/website/components/case-study-carousel/img/quote.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/website/components/case-study-carousel/img/right-arrow-control.svg b/website/components/case-study-carousel/img/right-arrow-control.svg deleted file mode 100644 index eb390dd7c..000000000 --- a/website/components/case-study-carousel/img/right-arrow-control.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/website/components/case-study-carousel/index.jsx b/website/components/case-study-carousel/index.jsx deleted file mode 100644 index d2a1f2002..000000000 --- a/website/components/case-study-carousel/index.jsx +++ /dev/null @@ -1,90 +0,0 @@ -import { useState } from 'react' -import { isIE } from 'react-device-detect' - -import Carousel from 'nuka-carousel' -import CaseSlide from './case-study-slide' -import Image from '@hashicorp/react-image' -import InlineSvg from '@hashicorp/react-inline-svg' -import ActiveControlDot from './img/active-control-dot.svg?include' -import InactiveControlDot from './img/inactive-control-dot.svg?include' -import LeftArrow from './img/left-arrow-control.svg?include' -import RightArrow from './img/right-arrow-control.svg?include' - -export default function CaseStudyCarousel({ - caseStudies, - title, - featuredLogos, -}) { - const [slideIndex, setSlideIndex] = useState(0) - const caseStudySlides = caseStudies.map((caseStudy) => ( - - )) - function renderControls() { - return ( -
- {caseStudies.map((caseStudy, stableIdx) => { - return ( - - ) - })} -
- ) - } - - function sideControls(icon, direction) { - return ( - - ) - } - - return ( -
-

{title}

- {!isIE ? ( - renderControls()} - renderCenterLeftControls={({ previousSlide }) => { - return sideControls(LeftArrow, previousSlide) - }} - renderCenterRightControls={({ nextSlide }) => { - return sideControls(RightArrow, nextSlide) - }} - afterSlide={(slideIndex) => setSlideIndex(slideIndex)} - > - {caseStudySlides} - - ) : null} -
-
- {featuredLogos.map((featuredLogo) => ( - {featuredLogo.companyName} - ))} -
-
-
- ) -} diff --git a/website/components/case-study-carousel/style.css b/website/components/case-study-carousel/style.css deleted file mode 100644 index a96b6b482..000000000 --- a/website/components/case-study-carousel/style.css +++ /dev/null @@ -1,251 +0,0 @@ -.g-case-carousel { - display: flex; - flex-direction: column; - align-items: center; - position: relative; - padding-top: 0 !important; - padding-bottom: 0 !important; - - & h2 { - margin-top: 128px; - margin-bottom: 30px; - max-width: 600px; - text-align: center; - white-space: pre-wrap; - - @media (max-width: 800px) { - margin-top: 64px; - white-space: initial; - margin-left: 24px; - margin-right: 24px; - } - } - - &::after { - content: ''; - background: var(--gray-6); - width: 100%; - height: 500px; - position: absolute; - bottom: 0; - z-index: -1; - } - - & .background-section { - width: 100%; - background: var(--gray-6); - & .mono-logos { - display: flex; - justify-content: center; - max-width: 750px; - margin: 0 auto; - margin-top: 70px; - flex-wrap: wrap; - - & img { - max-height: 40px; - width: 33.33%; - padding: 0 30px; - margin: 24px 0; - - @media (max-width: 800px) { - padding: 0 20px; - max-height: 28px; - } - } - } - } - - & .slider-control-bottomcenter { - bottom: -35px !important; - } - - /* Begin `nuka-carousel` styles */ - & .slider { - max-width: 1200px; - - &:focus { - outline: none !important; - } - - @media (max-width: 800px) { - width: calc(100% - 48px) !important; - } - - & .slider-list { - margin-bottom: 50px !important; - - @media (max-width: 800px) { - margin-bottom: 30px !important; - } - } - - & .slider-frame:focus { - outline: none !important; - } - - & .slider-slide:focus { - outline: none !important; - } - } - - /* End `nuka-carousel` styles */ - - & .side-control { - border: none; - background: none; - margin: 20px; - - &:focus { - outline: none; - } - - &:hover:not([disabled]) { - cursor: pointer; - } - - @media (max-width: 991px) { - display: none; - } - - & svg path { - stroke: var(--gray-2); - } - - &:disabled svg path { - stroke: var(--gray-4); - } - } - - & .case-slide { - display: flex; - flex-wrap: wrap; - width: 100%; - background: var(--white); - padding: 64px; - box-shadow: 0 8px 22px #dedede; - - @media (max-width: 800px) { - box-shadow: none; - border: 1px solid var(--gray-5); - padding: 48px; - } - - @media (--medium-up) { - max-width: 750px; - } - - & button { - margin-top: 24px; - } - - & .quotes { - display: flex; - margin-bottom: 24px; - } - - & h4 { - margin: 0; - - &.case { - min-height: 130px; - margin-bottom: 24px; - color: var(--gray-2); - - @media (max-width: 800px) { - min-height: 155px; - font-size: 22px; - } - - @media (max-width: 650px) { - min-height: 190px; - } - - @media (max-width: 550px) { - font-size: 20px; - } - - @media (max-width: 400px) { - font-size: 18px; - line-height: 28px; - } - } - } - - & p { - margin: 0; - } - - & a { - margin-top: 24px; - } - - & .case-content { - display: flex; - justify-content: space-between; - width: 100%; - align-items: center; - } - - & .person-container { - display: flex; - align-items: center; - - & picture { - display: flex; - } - - & .person-photo { - border-radius: 50%; - max-height: 72px; - margin-right: 24px; - } - - & .person-name { - & h5 { - margin: 0; - - @media (max-width: 400px) { - font-size: 16px; - } - } - - @media (max-width: 400px) { - & p { - font-size: 15px; - } - } - } - } - - & .company-logo { - max-height: 40px; - max-width: 180px; - - @media (max-width: 800px) { - display: none; - } - } - - & .case { - color: var(--gray-4); - font-size: 24px; - line-height: 31px; /* Called for within the design, no custom property seemed appropriate */ - } - } - - & .carousel-controls { - width: 100%; - display: flex; - flex-wrap: nowrap; - justify-content: center; - - & .carousel-controls-button { - height: 20px; - background: transparent; - box-shadow: none; - cursor: pointer; - border: none; - } - } -} diff --git a/website/components/comparison-callouts/index.jsx b/website/components/comparison-callouts/index.jsx deleted file mode 100644 index 58999d677..000000000 --- a/website/components/comparison-callouts/index.jsx +++ /dev/null @@ -1,38 +0,0 @@ -import s from './style.module.css' -import Image from '@hashicorp/react-image' -import Button from '@hashicorp/react-button' - -export default function ComparisonCallouts({ heading, details, items }) { - return ( -
-
-
-

{heading}

-
{details}
-
- -
- {items.map((item) => ( - - ))} -
-
-
- ) -} - -function ComparisonItem({ imageUrl, title, description, link }) { - return ( -
- -

{title}

-

{description}

-
- ) -} diff --git a/website/components/comparison-callouts/style.module.css b/website/components/comparison-callouts/style.module.css deleted file mode 100644 index 8e89db534..000000000 --- a/website/components/comparison-callouts/style.module.css +++ /dev/null @@ -1,60 +0,0 @@ -.comparisonCallouts { - padding-top: 128px; - padding-bottom: 128px; - background: var(--gray-6); -} - -.content { - composes: g-grid-container from global; - text-align: center; -} - -.description { - margin-bottom: 64px; - - & h2 { - margin-top: 0; - margin-bottom: 24px; - } -} - -.details { - margin: 0 auto; - composes: g-type-body-large from global; - max-width: 560px; - - & a { - color: var(--nomad-link); - } -} - -.comparisonItems { - display: flex; - justify-content: center; - margin: 0 auto; -} - -.comparisonItem { - max-width: 280px; - padding: 48px 24px; - background-color: var(--white); - box-shadow: 0 2px 3px rgba(37, 41, 55, 0.08); - border: 1px solid var(--gray-5); - border-radius: 1px; - transition-duration: 0.25s; - transition-property: box-shadow, transform; - - &:first-child { - margin-right: 32px; - } - - &:hover { - box-shadow: 0 16px 28px rgba(37, 38, 45, 0.12); - transform: translateY(-4px); - } - - & h4 { - margin-top: 22px; - margin-bottom: 8px; - } -} diff --git a/website/components/downloads-props/index.jsx b/website/components/downloads-props/index.jsx deleted file mode 100644 index 7a2d1a677..000000000 --- a/website/components/downloads-props/index.jsx +++ /dev/null @@ -1,38 +0,0 @@ -import s from '../../pages/downloads/style.module.css' - -export default function DownloadsProps(preMerchandisingSlot) { - return { - getStartedDescription: - 'Follow step-by-step tutorials on the essentials of Nomad.', - getStartedLinks: [ - { - label: 'Getting Started', - href: 'https://learn.hashicorp.com/collections/nomad/get-started', - }, - { - label: 'Deploy and Manage Nomad Jobs', - href: 'https://learn.hashicorp.com/collections/nomad/manage-jobs', - }, - { - label: 'Explore the Nomad Web UI', - href: 'https://learn.hashicorp.com/collections/nomad/web-ui', - }, - { - label: 'View all Nomad tutorials', - href: 'https://learn.hashicorp.com/nomad', - }, - ], - logo: ( - Nomad - ), - tutorialLink: { - href: 'https://learn.hashicorp.com/nomad', - label: 'View Tutorials at HashiCorp Learn', - }, - merchandisingSlot: preMerchandisingSlot && preMerchandisingSlot, - } -} diff --git a/website/components/enterprise-info/img/arrow.svg b/website/components/enterprise-info/img/arrow.svg deleted file mode 100644 index 0e395bd6f..000000000 --- a/website/components/enterprise-info/img/arrow.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/website/components/enterprise-info/img/basic.svg b/website/components/enterprise-info/img/basic.svg deleted file mode 100644 index cf7591183..000000000 --- a/website/components/enterprise-info/img/basic.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/website/components/enterprise-info/img/complex.svg b/website/components/enterprise-info/img/complex.svg deleted file mode 100644 index 07963e22f..000000000 --- a/website/components/enterprise-info/img/complex.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/website/components/enterprise-info/index.jsx b/website/components/enterprise-info/index.jsx deleted file mode 100644 index afb175c38..000000000 --- a/website/components/enterprise-info/index.jsx +++ /dev/null @@ -1,47 +0,0 @@ -import Image from '@hashicorp/react-image' -import Button from '@hashicorp/react-button' -import InlineSvg from '@hashicorp/react-inline-svg' -import ArrowIcon from './img/arrow.svg?include' - -export default function EnterpriseInfo({ title, itemOne, itemTwo }) { - return ( -
-
-

{title}

- -
-
- -
{itemOne.label}
-

{itemOne.title}

- -

{itemOne.description}

-
-
-
- -
-
- -
{itemTwo.label}
-

{itemTwo.title}

- -

{itemTwo.description}

-
-
-
-
- ) -} diff --git a/website/components/enterprise-info/nomad.jsx b/website/components/enterprise-info/nomad.jsx deleted file mode 100644 index 94cbd1895..000000000 --- a/website/components/enterprise-info/nomad.jsx +++ /dev/null @@ -1,37 +0,0 @@ -import EnterpriseInfo from './index.jsx' - -const technicalComplexity = { - title: 'Technical Complexity', - label: 'Open Source', - imageUrl: require('./img/basic.svg?url'), - description: - 'Nomad Open Source addresses the technical complexity of workload orchestration across the cloud, on-prem, and hybrid infrastructure.', - link: { - text: 'View Open Source Features', - url: 'https://www.hashicorp.com/products/nomad/pricing/', - type: 'outbound', - }, -} - -const organizationalComplexity = { - title: 'Organizational Complexity', - label: 'Enterprise', - imageUrl: require('./img/complex.svg?url'), - description: - 'Nomad Enterprise addresses the complexity of collaboration and governance across multi-team and multi-cluster deployments.', - link: { - text: 'View Enterprise Features', - url: 'https://www.hashicorp.com/products/nomad/pricing/', - type: 'outbound', - }, -} - -export default function NomadEnterpriseInfo() { - return ( - - ) -} diff --git a/website/components/enterprise-info/style.css b/website/components/enterprise-info/style.css deleted file mode 100644 index f88e19c3a..000000000 --- a/website/components/enterprise-info/style.css +++ /dev/null @@ -1,92 +0,0 @@ -.g-enterprise-info { - padding-top: 128px; - padding-bottom: 128px; - background: var(--gray-6); - - & h2 { - text-align: center; - } - - @media (max-width: 800px) { - padding-top: 64px; - padding-bottom: 64px; - } - - & .complexity-container { - display: flex; - justify-content: space-between; - margin: 0 auto 64px auto; - - @media (max-width: 800px) { - flex-wrap: wrap; - } - & .item { - flex-basis: 50%; - justify-content: center; - text-align: center; - margin-top: 64px; - - @media (max-width: 800px) { - margin-top: 64px; - flex-basis: 100%; - } - - & .g-type-label-strong { - margin-top: 64px; - - @media (max-width: 800px) { - margin-top: 32px; - } - } - - & h4 { - white-space: pre; - margin-top: 24px; - margin-bottom: 8px; - - @media (max-width: 800px) { - margin-top: 16px; - } - } - - & picture { - display: inline-block; - } - - & img { - max-width: 160px; - max-height: 98px; - } - & p { - margin-top: 0; - margin-bottom: 24px; - - @media (max-width: 800px) { - max-width: 600px; - margin-right: auto; - margin-left: auto; - } - } - } - - & .spacer { - & .vertical-spacer { - height: 93px; - } - - & .arrow { - display: flex; - align-items: center; - } - - @media (max-width: 800px) { - display: none; - } - } - } - - & .more-features-link { - display: flex; - justify-content: center; - } -} diff --git a/website/components/features-list/index.jsx b/website/components/features-list/index.jsx deleted file mode 100644 index 12768818e..000000000 --- a/website/components/features-list/index.jsx +++ /dev/null @@ -1,27 +0,0 @@ -export default function FeaturesList({ title, items, intro }) { - return ( -
-

{title}

-
-
- {items.map(({ title, content, icon }) => ( -
-
- {title} -
-
-

{title}

-

-

-
- ))} -
-
- ) -} diff --git a/website/components/features-list/style.css b/website/components/features-list/style.css deleted file mode 100644 index 03a928f51..000000000 --- a/website/components/features-list/style.css +++ /dev/null @@ -1,99 +0,0 @@ -.g-features-list { - padding-top: 64px; - padding-bottom: 24px; - & h2 { - text-align: center; - margin-top: 0; - margin-bottom: 32px; - } - - & .intro-container { - text-align: center; - max-width: 600px; - margin: 0 auto; - margin-bottom: 64px; - - & a { - color: var(--nomad); - } - } - - & .items-container { - display: flex; - flex-wrap: wrap; - - & .item { - border: 1px solid var(--gray-5); - flex-basis: calc(50% - 16px); - margin-bottom: 32px; - padding: 40px; - display: flex; - - @media (max-width: 468px) { - flex-direction: column; - } - - & h4 { - margin: 0; - margin-bottom: 8px; - } - - & p { - margin: 0; - } - - & a { - color: var(--nomad-link); - } - - & .item-icon img { - width: 72px; - height: 72px; - margin-right: 32px; - - @media (max-width: 468px) { - margin-bottom: 18px; - } - } - - &:nth-child(odd) { - margin-right: 16px; - } - - &:nth-child(even) { - margin-left: 16px; - } - - @media (max-width: 1200px) { - padding: 32px; - & .item-icon img { - display: flex; - width: 50px; - height: 50px; - margin-right: 24px; - } - } - - @media (max-width: 991px) { - flex-basis: 100%; - padding: 32px; - margin-bottom: 36px; - - & .item-icon img { - display: flex; - width: 72px; - height: 72px; - margin-right: 24px; - } - - &:nth-child(odd) { - margin-right: 0; - } - - &:nth-child(even) { - margin-left: 0; - } - } - } - } -} diff --git a/website/components/footer/index.jsx b/website/components/footer/index.jsx deleted file mode 100644 index 287f9ac72..000000000 --- a/website/components/footer/index.jsx +++ /dev/null @@ -1,29 +0,0 @@ -import Link from 'next/link' - -export default function Footer({ openConsentManager }) { - return ( - - ) -} diff --git a/website/components/footer/style.css b/website/components/footer/style.css deleted file mode 100644 index 5f04743af..000000000 --- a/website/components/footer/style.css +++ /dev/null @@ -1,32 +0,0 @@ -.g-footer { - padding: 25px 0 17px 0; - flex-shrink: 0; - display: flex; - - & .g-grid-container { - display: flex; - justify-content: space-between; - flex-wrap: wrap; - } - - & a { - color: black; - opacity: 0.5; - transition: opacity 0.25s ease; - cursor: pointer; - display: inline-block; - - &:hover { - opacity: 1; - } - } - - & .left > a { - margin-right: 20px; - margin-bottom: 8px; - - &:last-child { - margin-right: 0; - } - } -} diff --git a/website/components/homepage-hero/index.jsx b/website/components/homepage-hero/index.jsx deleted file mode 100644 index 58b8971d5..000000000 --- a/website/components/homepage-hero/index.jsx +++ /dev/null @@ -1,33 +0,0 @@ -import Button from '@hashicorp/react-button' - -export default function HomepageHero({ title, description, links }) { - return ( -
-
-

- {title} -

-
-

- {description} -

-
- {links.map((link, index) => { - const brand = index === 0 ? 'nomad' : 'neutral' - const variant = index === 0 ? 'primary' : 'secondary' - return ( -
-
-
-
- ) -} diff --git a/website/components/homepage-hero/style.css b/website/components/homepage-hero/style.css deleted file mode 100644 index 0e3e52bb8..000000000 --- a/website/components/homepage-hero/style.css +++ /dev/null @@ -1,39 +0,0 @@ -.g-homepage-hero { - background-repeat: no-repeat; - background-color: var(--nomad-secondary); - width: 100%; - background-size: cover; - background-position: center; - padding: 88px 0; - - @media (--medium-up) { - background-image: url(/img/nomad-bg-pattern.svg); - } - - & h1 { - text-align: center; - white-space: pre-wrap; - } - - & p { - margin: 0 auto 0 auto; - text-align: center; - max-width: 40em; - } - - & .g-grid-container { - max-width: 700px; - } - - & .links { - display: flex; - flex-wrap: wrap; - justify-content: center; - margin-top: calc(32px - 8px); - margin-bottom: -8px; - - & a { - margin: 8px; - } - } -} diff --git a/website/components/io-card-container/index.tsx b/website/components/io-card-container/index.tsx deleted file mode 100644 index e71ab886e..000000000 --- a/website/components/io-card-container/index.tsx +++ /dev/null @@ -1,82 +0,0 @@ -import * as React from 'react' -import classNames from 'classnames' -import Button from '@hashicorp/react-button' -import IoCard, { IoCardProps } from 'components/io-card' -import s from './style.module.css' - -interface IoCardContaianerProps { - theme?: 'light' | 'dark' - heading?: string - description?: string - label?: string - cta?: { - url: string - text: string - } - cardsPerRow: 3 | 4 - cards: Array -} - -export default function IoCardContaianer({ - theme = 'light', - heading, - description, - label, - cta, - cardsPerRow = 3, - cards, -}: IoCardContaianerProps): React.ReactElement { - return ( -
- {heading || description ? ( -
- {heading ?

{heading}

: null} - {description ?

{description}

: null} -
- ) : null} - {cards.length ? ( - <> - {label || cta ? ( -
- {label ?

{label}

: null} - {cta ? ( -
- ) : null} -
    - {cards.map((card, index) => { - return ( - // Index is stable - // eslint-disable-next-line react/no-array-index-key -
  • - -
  • - ) - })} -
- - ) : null} -
- ) -} diff --git a/website/components/io-card-container/style.module.css b/website/components/io-card-container/style.module.css deleted file mode 100644 index b7b9b08d2..000000000 --- a/website/components/io-card-container/style.module.css +++ /dev/null @@ -1,114 +0,0 @@ -.cardContainer { - position: relative; - - & + .cardContainer { - margin-top: 64px; - - @media (--medium-up) { - margin-top: 132px; - } - } -} - -.header { - margin: 0 auto 64px; - text-align: center; - max-width: 600px; -} - -.heading { - margin: 0; - composes: g-type-display-2 from global; - - @nest .dark & { - color: var(--white); - } -} - -.description { - margin: 8px 0 0; - composes: g-type-body-large from global; - - @nest .dark & { - color: var(--gray-5); - } -} - -.subHeader { - margin: 0 0 32px; - display: flex; - align-items: center; - justify-content: space-between; - - @nest .dark & { - color: var(--gray-5); - } -} - -.label { - margin: 0; - composes: g-type-display-4 from global; -} - -.cardList { - list-style: none; - - --minCol: 250px; - --columns: var(--length); - - position: relative; - gap: 32px; - padding: 0; - - @media (--small) { - display: flex; - overflow-x: auto; - -ms-overflow-style: none; - scrollbar-width: none; - margin: 0; - padding: 6px 24px; - left: 50%; - margin-left: -50vw; - width: 100vw; - - /* This is to ensure there is overflow padding right on mobile. */ - &::after { - content: ''; - display: block; - width: 1px; - flex-shrink: 0; - } - } - - @media (--medium-up) { - display: grid; - grid-template-columns: repeat(var(--columns), minmax(var(--minCol), 1fr)); - } - - &.threeUp { - @media (--medium-up) { - --columns: 3; - --minCol: 0; - } - } - - &.fourUp { - @media (--medium-up) { - --columns: 3; - --minCol: 0; - } - - @media (--large) { - --columns: 4; - } - } - - & > li { - display: flex; - - @media (--small) { - flex-shrink: 0; - width: 250px; - } - } -} diff --git a/website/components/io-card/index.tsx b/website/components/io-card/index.tsx deleted file mode 100644 index 64baa4081..000000000 --- a/website/components/io-card/index.tsx +++ /dev/null @@ -1,124 +0,0 @@ -import * as React from 'react' -import Link from 'next/link' -import InlineSvg from '@hashicorp/react-inline-svg' -import classNames from 'classnames' -import { IconArrowRight24 } from '@hashicorp/flight-icons/svg-react/arrow-right-24' -import { IconExternalLink24 } from '@hashicorp/flight-icons/svg-react/external-link-24' -import { productLogos } from './product-logos' -import s from './style.module.css' - -export interface IoCardProps { - variant?: 'light' | 'gray' | 'dark' - products?: Array<{ - name: keyof typeof productLogos - }> - link: { - url: string - type: 'inbound' | 'outbound' - } - inset?: 'none' | 'sm' | 'md' - eyebrow?: string - heading?: string - description?: string - children?: React.ReactNode -} - -function IoCard({ - variant = 'light', - products, - link, - inset = 'md', - eyebrow, - heading, - description, - children, -}: IoCardProps): React.ReactElement { - const LinkWrapper = ({ className, children }) => - link.type === 'inbound' ? ( - - {children} - - ) : ( - - {children} - - ) - - return ( -
- - {children ? ( - children - ) : ( - <> - {eyebrow ? {eyebrow} : null} - {heading ? {heading} : null} - {description ? {description} : null} - - )} -
- {products && ( -
    - {products.map(({ name }, index) => { - const key = name.toLowerCase() - const version = variant === 'dark' ? 'neutral' : 'color' - return ( - // eslint-disable-next-line react/no-array-index-key -
  • - -
  • - ) - })} -
- )} - - {link.type === 'inbound' ? ( - - ) : ( - - )} - -
-
-
- ) -} - -interface EyebrowProps { - children: string -} - -function Eyebrow({ children }: EyebrowProps) { - return

{children}

-} - -interface HeadingProps { - as?: 'h2' | 'h3' | 'h4' - children: React.ReactNode -} - -function Heading({ as: Component = 'h2', children }: HeadingProps) { - return {children} -} - -interface DescriptionProps { - children: string -} - -function Description({ children }: DescriptionProps) { - return

{children}

-} - -IoCard.Eyebrow = Eyebrow -IoCard.Heading = Heading -IoCard.Description = Description - -export default IoCard diff --git a/website/components/io-card/product-logos.ts b/website/components/io-card/product-logos.ts deleted file mode 100644 index 9c24e3bf4..000000000 --- a/website/components/io-card/product-logos.ts +++ /dev/null @@ -1,34 +0,0 @@ -export const productLogos = { - boundary: { - color: require('@hashicorp/mktg-logos/product/boundary/logomark/color.svg?include'), - neutral: require('@hashicorp/mktg-logos/product/boundary/logomark/white.svg?include'), - }, - consul: { - color: require('@hashicorp/mktg-logos/product/consul/logomark/color.svg?include'), - neutral: require('@hashicorp/mktg-logos/product/consul/logomark/white.svg?include'), - }, - nomad: { - color: require('@hashicorp/mktg-logos/product/nomad/logomark/color.svg?include'), - neutral: require('@hashicorp/mktg-logos/product/nomad/logomark/white.svg?include'), - }, - packer: { - color: require('@hashicorp/mktg-logos/product/packer/logomark/color.svg?include'), - neutral: require('@hashicorp/mktg-logos/product/packer/logomark/white.svg?include'), - }, - terraform: { - color: require('@hashicorp/mktg-logos/product/terraform/logomark/color.svg?include'), - neutral: require('@hashicorp/mktg-logos/product/terraform/logomark/white.svg?include'), - }, - vagrant: { - color: require('@hashicorp/mktg-logos/product/vagrant/logomark/color.svg?include'), - neutral: require('@hashicorp/mktg-logos/product/vagrant/logomark/white.svg?include'), - }, - vault: { - color: require('@hashicorp/mktg-logos/product/vault/logomark/color.svg?include'), - neutral: require('@hashicorp/mktg-logos/product/vault/logomark/white.svg?include'), - }, - waypoint: { - color: require('@hashicorp/mktg-logos/product/waypoint/logomark/color.svg?include'), - neutral: require('@hashicorp/mktg-logos/product/waypoint/logomark/white.svg?include'), - }, -} diff --git a/website/components/io-card/style.module.css b/website/components/io-card/style.module.css deleted file mode 100644 index 44df36ced..000000000 --- a/website/components/io-card/style.module.css +++ /dev/null @@ -1,148 +0,0 @@ -.card { - /* Radii */ - --token-radius: 6px; - - /* Spacing */ - --token-spacing-03: 8px; - --token-spacing-04: 16px; - --token-spacing-05: 24px; - --token-spacing-06: 32px; - - /* Elevations */ - --token-elevation-mid: 0 2px 3px rgba(101, 106, 118, 0.1), - 0 8px 16px -10px rgba(101, 106, 118, 0.2); - --token-elevation-high: 0 2px 3px rgba(101, 106, 118, 0.15), - 0 16px 16px -10px rgba(101, 106, 118, 0.2); - - /* Transition */ - --token-transition: ease-in-out 0.2s; - - display: flex; - flex-direction: column; - flex-grow: 1; - min-height: 300px; - - & a { - display: flex; - flex-direction: column; - flex-grow: 1; - border-radius: var(--token-radius); - box-shadow: 0 0 0 1px rgba(38, 53, 61, 0.1), var(--token-elevation-mid); - transition: var(--token-transition); - transition-property: background-color, box-shadow; - - &:hover { - box-shadow: 0 0 0 2px rgba(38, 53, 61, 0.15), var(--token-elevation-high); - cursor: pointer; - } - - /* Variants */ - &.dark { - background-color: var(--gray-1); - - &:hover { - background-color: var(--gray-2); - } - } - - &.gray { - background-color: #f9f9fa; - } - - &.light { - background-color: var(--white); - } - - /* Spacing */ - &.none { - padding: 0; - } - - &.sm { - padding: var(--token-spacing-05); - } - - &.md { - padding: var(--token-spacing-06); - } - } -} - -.eyebrow { - margin: 0; - composes: g-type-label-small from global; - color: var(--gray-3); - - @nest .dark & { - color: var(--gray-5); - } -} - -.heading { - margin: 0; - composes: g-type-display-5 from global; - color: var(--black); - - @nest * + & { - margin-top: var(--token-spacing-05); - } - - @nest .dark & { - color: var(--white); - } -} - -.description { - margin: 0; - composes: g-type-body-small from global; - color: var(--gray-3); - - @nest * + & { - margin-top: var(--token-spacing-03); - } - - @nest .dark & { - color: var(--gray-5); - } -} - -.footer { - margin-top: auto; - display: flex; - justify-content: space-between; - align-items: flex-end; - padding-top: 32px; -} - -.products { - display: flex; - gap: 8px; - margin: 0; - padding: 0; - - & > li { - width: 32px; - height: 32px; - display: grid; - place-items: center; - } - - & .logo { - display: flex; - - & svg { - width: 32px; - height: 32px; - } - } -} - -.linkType { - margin-left: auto; - display: flex; - color: var(--black); - - @nest .dark & { - color: var(--white); - } -} diff --git a/website/components/io-dialog/index.tsx b/website/components/io-dialog/index.tsx deleted file mode 100644 index 14298b305..000000000 --- a/website/components/io-dialog/index.tsx +++ /dev/null @@ -1,47 +0,0 @@ -import * as React from 'react' -import { DialogOverlay, DialogContent, DialogOverlayProps } from '@reach/dialog' -import { AnimatePresence, motion } from 'framer-motion' -import s from './style.module.css' - -export interface IoDialogProps extends DialogOverlayProps { - label: string -} - -export default function IoDialog({ - isOpen, - onDismiss, - children, - label, -}: IoDialogProps): React.ReactElement { - const AnimatedDialogOverlay = motion(DialogOverlay) - return ( - - {isOpen && ( - -
- - - - {children} - - -
-
- )} -
- ) -} diff --git a/website/components/io-dialog/style.module.css b/website/components/io-dialog/style.module.css deleted file mode 100644 index 306619ac8..000000000 --- a/website/components/io-dialog/style.module.css +++ /dev/null @@ -1,62 +0,0 @@ -.dialogOverlay { - background-color: rgba(0, 0, 0, 0.75); - height: 100%; - left: 0; - overflow-y: auto; - position: fixed; - top: 0; - width: 100%; - z-index: 666666667 /* higher than global nav */; -} - -.dialogWrapper { - display: grid; - min-height: 100vh; - padding: 24px; - place-items: center; -} - -.dialogContent { - background-color: var(--gray-1); - color: var(--white); - max-width: 800px; - outline: none; - overflow-y: auto; - padding: 24px; - position: relative; - width: 100%; - - @media (min-width: 768px) { - padding: 48px; - } -} - -.dialogClose { - appearance: none; - background-color: transparent; - border: 0; - composes: g-type-display-5 from global; - cursor: pointer; - margin: 0; - padding: 0; - position: absolute; - color: var(--white); - right: 24px; - top: 24px; - z-index: 1; - - @media (min-width: 768px) { - right: 48px; - top: 48px; - } - - @nest html[dir='rtl'] & { - left: 24px; - right: auto; - - @media (min-width: 768px) { - left: 48px; - right: auto; - } - } -} diff --git a/website/components/io-home-call-to-action/index.tsx b/website/components/io-home-call-to-action/index.tsx deleted file mode 100644 index 7296b361b..000000000 --- a/website/components/io-home-call-to-action/index.tsx +++ /dev/null @@ -1,39 +0,0 @@ -import ReactCallToAction from '@hashicorp/react-call-to-action' -import { Products } from '@hashicorp/platform-product-meta' -import s from './style.module.css' - -interface IoHomeCallToActionProps { - brand: Products - heading: string - content: string - links: Array<{ - text: string - url: string - }> -} - -export default function IoHomeCallToAction({ - brand, - heading, - content, - links, -}: IoHomeCallToActionProps) { - return ( -
- { - return { - text, - url, - type: index === 1 ? 'inbound' : null, - } - })} - /> -
- ) -} diff --git a/website/components/io-home-call-to-action/style.module.css b/website/components/io-home-call-to-action/style.module.css deleted file mode 100644 index 76cb03446..000000000 --- a/website/components/io-home-call-to-action/style.module.css +++ /dev/null @@ -1,12 +0,0 @@ -.callToAction { - margin: 60px auto; - background-image: linear-gradient(52.3deg, #2c2d2f 39.83%, #626264 96.92%); - - @media (--medium-up) { - margin: 120px auto; - } - - & > * { - background-color: transparent; - } -} diff --git a/website/components/io-home-case-studies/index.tsx b/website/components/io-home-case-studies/index.tsx deleted file mode 100644 index b8c6d48d1..000000000 --- a/website/components/io-home-case-studies/index.tsx +++ /dev/null @@ -1,80 +0,0 @@ -import * as React from 'react' -import Image from 'next/image' -import { isInternalLink } from 'lib/utils' -import { IconExternalLink16 } from '@hashicorp/flight-icons/svg-react/external-link-16' -import { IconArrowRight16 } from '@hashicorp/flight-icons/svg-react/arrow-right-16' -import s from './style.module.css' - -interface IoHomeCaseStudiesProps { - heading: string - description: string - primary: Array<{ - thumbnail: { - url: string - alt: string - } - link: string - heading: string - }> - secondary: Array<{ - link: string - heading: string - }> -} - -export default function IoHomeCaseStudies({ - heading, - description, - primary, - secondary, -}: IoHomeCaseStudiesProps): React.ReactElement { - return ( -
-
-
-

{heading}

-

{description}

-
-
- - - -
-
-
- ) -} diff --git a/website/components/io-home-case-studies/style.module.css b/website/components/io-home-case-studies/style.module.css deleted file mode 100644 index cb650b38e..000000000 --- a/website/components/io-home-case-studies/style.module.css +++ /dev/null @@ -1,171 +0,0 @@ -.root { - position: relative; - margin: 0 auto; - margin: 60px auto; - max-width: 1600px; - - @media (--medium-up) { - margin: 120px auto; - } -} - -.container { - composes: g-grid-container from global; -} - -.header { - margin-bottom: 32px; - - @media (--medium-up) { - max-width: calc(100% * 5 / 12); - } -} - -.heading { - margin: 0; - composes: g-type-display-3 from global; -} - -.description { - margin: 8px 0 0; - composes: g-type-body from global; - color: var(--gray-3); -} - -.caseStudies { - --columns: 1; - - display: grid; - grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); - gap: 32px; - - @media (--medium-up) { - --columns: 12; - } -} - -.primary { - --columns: 1; - - grid-column: 1 / -1; - list-style: none; - margin: 0; - padding: 0; - display: grid; - grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); - gap: 32px; - - @media (--medium-up) { - --columns: 2; - } - - @media (--large) { - grid-column: 1 / 9; - } -} - -.primaryItem { - display: flex; -} - -.card { - position: relative; - overflow: hidden; - display: flex; - flex-direction: column; - flex-grow: 1; - justify-content: flex-end; - padding: 32px; - box-shadow: 0 8px 16px -10px rgba(101, 106, 118, 0.2); - background-color: #000; - border-radius: 6px; - color: var(--white); - transition: ease-in-out 0.2s; - transition-property: box-shadow; - min-height: 300px; - - &::before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: 10; - border-radius: 6px; - background-image: linear-gradient( - to bottom, - rgba(0, 0, 0, 0), - rgba(0, 0, 0, 0.45) - ); - transition: opacity ease-in-out 0.2s; - } - - &:hover { - box-shadow: 0 2px 3px rgba(101, 106, 118, 0.15), - 0 16px 16px -10px rgba(101, 106, 118, 0.2); - - &::before { - opacity: 0.75; - } - } -} - -.cardThumbnail { - transition: transform 0.4s; - - @nest .card:hover & { - transform: scale(1.04); - } -} - -.cardHeading { - margin: 0; - composes: g-type-display-4 from global; - z-index: 10; -} - -.secondary { - grid-column: 1 / -1; - list-style: none; - margin: 0; - padding: 0; - - @media (--large) { - margin-top: -32px; - grid-column: 9 / -1; - } -} - -.secondaryItem { - border-bottom: 1px solid var(--gray-5); -} - -.link { - display: flex; - width: 100%; - color: var(--black); -} - -.linkInner { - display: flex; - width: 100%; - justify-content: space-between; - padding-top: 32px; - padding-bottom: 32px; - transition: transform ease-in-out 0.2s; - - @nest .link:hover & { - transform: translateX(4px); - } - - & svg { - margin-top: 6px; - flex-shrink: 0; - } -} - -.linkHeading { - margin: 0 32px 0 0; - composes: g-type-display-6 from global; -} diff --git a/website/components/io-home-feature/index.tsx b/website/components/io-home-feature/index.tsx deleted file mode 100644 index dabb65937..000000000 --- a/website/components/io-home-feature/index.tsx +++ /dev/null @@ -1,71 +0,0 @@ -import * as React from 'react' -import Image from 'next/image' -import Link from 'next/link' -import { isInternalLink } from 'lib/utils' -import { IconArrowRight16 } from '@hashicorp/flight-icons/svg-react/arrow-right-16' -import s from './style.module.css' - -export interface IoHomeFeatureProps { - isInternalLink: (link: string) => boolean - link?: string - image: { - url: string - alt: string - } - heading: string - description: string -} - -export default function IoHomeFeature({ - isInternalLink, - link, - image, - heading, - description, -}: IoHomeFeatureProps): React.ReactElement { - return ( - -
- {image.alt} -
-
-

{heading}

-

{description}

- {link ? ( - - Learn more{' '} - - - - - ) : null} -
-
- ) -} - -function IoHomeFeatureWrap({ isInternalLink, href, children }) { - if (!href) { - return
{children}
- } - - if (isInternalLink(href)) { - return ( - - {children} - - ) - } - - return ( - - {children} - - ) -} diff --git a/website/components/io-home-feature/style.module.css b/website/components/io-home-feature/style.module.css deleted file mode 100644 index 70c2cc510..000000000 --- a/website/components/io-home-feature/style.module.css +++ /dev/null @@ -1,79 +0,0 @@ -.feature { - display: flex; - align-items: center; - flex-direction: column; - padding: 32px; - gap: 24px 64px; - border-radius: 6px; - background-color: #f9f9fa; - color: var(--black); - box-shadow: 0 2px 3px rgba(101, 106, 118, 0.1), - 0 8px 16px -10px rgba(101, 106, 118, 0.2); - - @media (--medium-up) { - flex-direction: row; - } -} - -.featureLink { - transition: box-shadow ease-in-out 0.2s; - - &:hover { - box-shadow: 0 2px 3px rgba(101, 106, 118, 0.15), - 0 16px 16px -10px rgba(101, 106, 118, 0.2); - } -} - -.featureMedia { - flex-shrink: 0; - display: flex; - width: 100%; - border-radius: 6px; - overflow: hidden; - border: 1px solid var(--gray-5); - - @media (--medium-up) { - width: 300px; - } - - @media (--large) { - width: 400px; - } - - & > * { - width: 100%; - } -} - -.featureContent { - max-width: 520px; -} - -.featureHeading { - margin: 0; - composes: g-type-display-4 from global; -} - -.featureDescription { - margin: 8px 0 24px; - composes: g-type-body-small from global; - color: var(--gray-3); -} - -.featureCta { - display: inline-flex; - align-items: center; - - & > span { - display: flex; - margin-left: 12px; - - & > svg { - transition: transform 0.2s; - } - } - - @nest .feature:hover & span svg { - transform: translateX(2px); - } -} diff --git a/website/components/io-home-hero/index.tsx b/website/components/io-home-hero/index.tsx deleted file mode 100644 index fabaafd37..000000000 --- a/website/components/io-home-hero/index.tsx +++ /dev/null @@ -1,135 +0,0 @@ -import * as React from 'react' -import { Products } from '@hashicorp/platform-product-meta' -import Button from '@hashicorp/react-button' -import classNames from 'classnames' -import s from './style.module.css' - -interface IoHomeHeroProps { - pattern: string - brand: Products | 'neutral' - heading: string - description: string - ctas: Array<{ - title: string - link: string - }> - cards: Array -} - -export default function IoHomeHero({ - pattern, - brand, - heading, - description, - ctas, - cards, -}: IoHomeHeroProps) { - const [loaded, setLoaded] = React.useState(false) - - React.useEffect(() => { - setTimeout(() => { - setLoaded(true) - }, 250) - }, []) - - return ( -
- -
-
-

{heading}

-

{description}

- {ctas && ( -
- {ctas.map((cta, index) => { - return ( -
- )} -
- {cards && ( -
- {cards.map((card, index) => { - return ( - - ) - })} -
- )} -
-
- ) -} - -interface IoHomeHeroCardProps { - index?: number - heading: string - description: string - cta: { - title: string - link: string - brand?: 'neutral' | Products - } - subText: string -} - -function IoHomeHeroCard({ - index, - heading, - description, - cta, - subText, -}: IoHomeHeroCardProps): React.ReactElement { - return ( -
-

{heading}

-

{description}

-
- ) -} diff --git a/website/components/io-home-hero/style.module.css b/website/components/io-home-hero/style.module.css deleted file mode 100644 index c7f47026f..000000000 --- a/website/components/io-home-hero/style.module.css +++ /dev/null @@ -1,148 +0,0 @@ -.hero { - position: relative; - padding-top: 64px; - padding-bottom: 64px; - background: linear-gradient(180deg, #f9f9fa 0%, #fff 28.22%, #fff 100%); - - @media (--medium-up) { - padding-top: 128px; - padding-bottom: 128px; - } -} - -.pattern { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - max-width: 1600px; - width: 100%; - margin: auto; - - @media (--medium-up) { - background-image: var(--pattern); - background-repeat: no-repeat; - background-position: top right; - } -} - -.container { - --columns: 1; - - composes: g-grid-container from global; - display: grid; - grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); - gap: 48px 32px; - - @media (--medium-up) { - --columns: 12; - } -} - -.content { - grid-column: 1 / -1; - - @media (--medium-up) { - grid-column: 1 / 6; - } - - & > * { - max-width: 415px; - } -} - -.heading { - margin: 0; - composes: g-type-display-1 from global; -} - -.description { - margin: 8px 0 0; - composes: g-type-body-small from global; - color: var(--gray-3); -} - -.ctas { - margin-top: 24px; - display: flex; - flex-direction: column; - align-items: flex-start; - gap: 24px; -} - -.cards { - --columns: 1; - - grid-column: 1 / -1; - align-self: start; - display: grid; - grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); - gap: 32px; - - @media (min-width: 600px) { - --columns: 2; - } - - @media (--medium-up) { - --columns: 1; - - grid-column: 7 / -1; - } - - @media (--large) { - --columns: 2; - - grid-column: 6 / -1; - } -} - -.card { - --token-radius: 6px; - --token-elevation-mid: 0 2px 3px rgba(101, 106, 118, 0.1), - 0 8px 16px -10px rgba(101, 106, 118, 0.2); - - opacity: 0; - padding: 40px 32px; - display: flex; - align-items: flex-start; - flex-direction: column; - flex-grow: 1; - background-color: var(--white); - border-radius: var(--token-radius); - box-shadow: 0 0 0 1px rgba(38, 53, 61, 0.1), var(--token-elevation-mid); - - @nest .loaded & { - animation-name: slideIn; - animation-duration: 0.5s; - animation-delay: calc(var(--index) * 0.1s); - animation-fill-mode: forwards; - } -} - -.cardHeading { - margin: 0; - composes: g-type-display-4 from global; -} - -.cardDescription { - margin: 8px 0 16px; - composes: g-type-display-6 from global; -} - -.cardSubText { - margin: 32px 0 0; - composes: g-type-body-small from global; - color: var(--gray-3); -} - -@keyframes slideIn { - from { - opacity: 0; - transform: translateY(50px); - } - to { - opacity: 1; - transform: translateY(0); - } -} diff --git a/website/components/io-home-in-practice/index.tsx b/website/components/io-home-in-practice/index.tsx deleted file mode 100644 index 6e145b2e9..000000000 --- a/website/components/io-home-in-practice/index.tsx +++ /dev/null @@ -1,86 +0,0 @@ -import * as React from 'react' -import Image from 'next/image' -import Button from '@hashicorp/react-button' -import { Products } from '@hashicorp/platform-product-meta' -import { IoCardProps } from 'components/io-card' -import IoCardContainer from 'components/io-card-container' -import s from './style.module.css' - -interface IoHomeInPracticeProps { - brand: Products - pattern: string - heading: string - description: string - cards: Array - cta: { - heading: string - description: string - link: string - image: { - url: string - alt: string - width: number - height: number - } - } -} - -export default function IoHomeInPractice({ - brand, - pattern, - heading, - description, - cards, - cta, -}: IoHomeInPracticeProps) { - return ( -
-
- - - {cta.heading ? ( -
-
-

{cta.heading}

- {cta.description ? ( -

{cta.description}

- ) : null} - {cta.link ? ( -
- {cta.image?.url ? ( -
- {cta.image.alt} -
- ) : null} -
- ) : null} -
-
- ) -} diff --git a/website/components/io-home-in-practice/style.module.css b/website/components/io-home-in-practice/style.module.css deleted file mode 100644 index 97fdf0b03..000000000 --- a/website/components/io-home-in-practice/style.module.css +++ /dev/null @@ -1,98 +0,0 @@ -.inPractice { - position: relative; - margin: 60px auto; - padding: 64px 0; - max-width: 1600px; - - @media (--medium-up) { - padding: 80px 0; - margin: 120px auto; - } - - &::before { - content: ''; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - background: var(--black); - background-image: url('/img/practice-pattern.svg'); - background-repeat: no-repeat; - background-size: 50%; - background-position: top 200px left; - - @media (--large) { - border-radius: 6px; - left: 24px; - right: 24px; - background-size: 35%; - background-position: top 64px left; - } - } -} - -.container { - composes: g-grid-container from global; -} - -.inPracticeCta { - --columns: 1; - - position: relative; - margin-top: 64px; - display: grid; - grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); - gap: 64px 32px; - - @media (--medium-up) { - --columns: 12; - } - - &::before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 100%; - bottom: -64px; - background-image: radial-gradient( - 42.33% 42.33% at 50% 100%, - #363638 0%, - #000 100% - ); - - @media (--medium-up) { - bottom: -80px; - } - } -} - -.inPracticeCtaContent { - position: relative; - grid-column: 1 / -1; - - @media (--medium-up) { - grid-column: 1 / 5; - } -} - -.inPracticeCtaMedia { - grid-column: 1 / -1; - - @media (--medium-up) { - grid-column: 6 / -1; - } -} - -.inPracticeCtaHeading { - margin: 0; - color: var(--white); - composes: g-type-display-3 from global; -} - -.inPracticeCtaDescription { - margin: 8px 0 32px; - color: var(--gray-5); - composes: g-type-body from global; -} diff --git a/website/components/io-home-intro/index.tsx b/website/components/io-home-intro/index.tsx deleted file mode 100644 index 493655c36..000000000 --- a/website/components/io-home-intro/index.tsx +++ /dev/null @@ -1,151 +0,0 @@ -import * as React from 'react' -import Image from 'next/image' -import classNames from 'classnames' -import { Products } from '@hashicorp/platform-product-meta' -import Button from '@hashicorp/react-button' -import IoVideoCallout, { - IoHomeVideoCalloutProps, -} from 'components/io-video-callout' -import IoHomeFeature, { IoHomeFeatureProps } from 'components/io-home-feature' -import s from './style.module.css' - -interface IoHomeIntroProps { - isInternalLink: (link: string) => boolean - brand: Products - heading: string - description: string - features?: Array - offerings?: { - image: { - src: string - width: number - height: number - alt: string - } - list: Array<{ - heading: string - description: string - }> - cta?: { - title: string - link: string - } - } - video?: IoHomeVideoCalloutProps -} - -export default function IoHomeIntro({ - isInternalLink, - brand, - heading, - description, - features, - offerings, - video, -}: IoHomeIntroProps) { - return ( -
-
-
-
-

{heading}

-

{description}

-
-
-
- - {features ? ( -
    - {features.map((feature, index) => { - return ( - // Index is stable - // eslint-disable-next-line react/no-array-index-key -
  • -
    - -
    -
  • - ) - })} -
- ) : null} - - {offerings ? ( -
- {offerings.image ? ( -
- {offerings.image.alt} -
- ) : null} -
-
    - {offerings.list.map((offering, index) => { - return ( - // Index is stable - // eslint-disable-next-line react/no-array-index-key -
  • -

    - {offering.heading} -

    -

    - {offering.description} -

    -
  • - ) - })} -
- {offerings.cta ? ( -
-
- ) : null} -
-
- ) : null} - - {video.youtubeId && video.thumbnail ? ( -
- -
- ) : null} -
- ) -} diff --git a/website/components/io-home-intro/style.module.css b/website/components/io-home-intro/style.module.css deleted file mode 100644 index 6227a49ba..000000000 --- a/website/components/io-home-intro/style.module.css +++ /dev/null @@ -1,169 +0,0 @@ -.root { - position: relative; - margin-bottom: 60px; - - @media (--medium-up) { - margin-bottom: 120px; - } - - &.withOfferings:not(.withFeatures)::before { - content: ''; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - background-image: radial-gradient( - 93.55% 93.55% at 50% 0%, - var(--gray-6) 0%, - rgba(242, 242, 243, 0) 100% - ); - - @media (--large) { - border-radius: 6px; - left: 24px; - right: 24px; - } - } -} - -.container { - composes: g-grid-container from global; -} - -.header { - padding-top: 64px; - padding-bottom: 64px; - text-align: center; - - @nest .withFeatures & { - background-color: var(--brand); - } - - @nest .withFeatures.consul & { - color: var(--white); - } -} - -.headerInner { - margin: auto; - - @media (--medium-up) { - max-width: calc(100% * 7 / 12); - } -} - -.heading { - margin: 0; - composes: g-type-display-2 from global; -} - -.description { - margin: 24px 0 0; - composes: g-type-body-large from global; - - @nest .withOfferings:not(.withFeatures) & { - color: var(--gray-3); - } -} - -/* - * Features - */ - -.features { - list-style: none; - margin: 0; - padding: 0; - display: grid; - gap: 32px; - - & li:first-of-type { - background-image: linear-gradient( - to bottom, - var(--brand) 50%, - var(--white) 50% - ); - } -} - -/* - * Offerings - */ - -.offerings { - --columns: 1; - - composes: g-grid-container from global; - display: grid; - grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); - gap: 64px 32px; - - @media (--medium-up) { - --columns: 12; - } - - @nest .features + & { - margin-top: 60px; - - @media (--medium-up) { - margin-top: 120px; - } - } -} - -.offeringsMedia { - grid-column: 1 / -1; - - @media (--medium-up) { - grid-column: 1 / 6; - } -} - -.offeringsContent { - grid-column: 1 / -1; - - @media (--medium-up) { - grid-column: 7 / -1; - } -} - -.offeringsList { - list-style: none; - margin: 0; - padding: 0; - display: grid; - grid-template-columns: repeat(2, 1fr); - gap: 32px; - - @media (--small) { - grid-template-columns: repeat(1, 1fr); - } -} - -.offeringsListHeading { - margin: 0; - composes: g-type-display-4 from global; -} - -.offeringsListDescription { - margin: 16px 0 0; - composes: g-type-body-small from global; -} - -.offeringsCta { - margin-top: 48px; -} - -/* - * Video - */ - -.video { - margin-top: 60px; - composes: g-grid-container from global; - - @media (--medium-up) { - margin-top: 120px; - } -} diff --git a/website/components/io-home-pre-footer/index.tsx b/website/components/io-home-pre-footer/index.tsx deleted file mode 100644 index 98127443d..000000000 --- a/website/components/io-home-pre-footer/index.tsx +++ /dev/null @@ -1,79 +0,0 @@ -import * as React from 'react' -import classNames from 'classnames' -import { Products } from '@hashicorp/platform-product-meta' -import { IconArrowRight16 } from '@hashicorp/flight-icons/svg-react/arrow-right-16' -import s from './style.module.css' - -interface IoHomePreFooterProps { - brand: Products - heading: string - description: string - ctas: [IoHomePreFooterCard, IoHomePreFooterCard, IoHomePreFooterCard] -} - -export default function IoHomePreFooter({ - brand, - heading, - description, - ctas, -}: IoHomePreFooterProps) { - return ( -
-
-
-

{heading}

-

{description}

-
-
- {ctas.map((cta, index) => { - return ( - - ) - })} -
-
-
- ) -} - -interface IoHomePreFooterCard { - brand?: string - link: string - heading: string - description: string - cta: string -} - -function IoHomePreFooterCard({ - brand, - link, - heading, - description, - cta, -}: IoHomePreFooterCard): React.ReactElement { - return ( - -

{heading}

-

{description}

- - {cta} - -
- ) -} diff --git a/website/components/io-home-pre-footer/style.module.css b/website/components/io-home-pre-footer/style.module.css deleted file mode 100644 index 19f314906..000000000 --- a/website/components/io-home-pre-footer/style.module.css +++ /dev/null @@ -1,119 +0,0 @@ -.preFooter { - margin: 60px auto; -} - -.container { - --columns: 1; - - composes: g-grid-container from global; - display: grid; - grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); - gap: 32px; - - @media (--medium-up) { - --columns: 12; - } -} - -.content { - grid-column: 1 / -1; - - @media (--medium-up) { - grid-column: 1 / 6; - } - - @media (--large) { - grid-column: 1 / 4; - } -} - -.heading { - margin: 0; - composes: g-type-display-1 from global; -} - -.description { - margin: 24px 0 0; - composes: g-type-body from global; - color: var(--gray-3); -} - -.cards { - grid-column: 1 / -1; - - --columns: 1; - - display: grid; - grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); - gap: 32px; - - @media (--medium-up) { - --columns: 3; - - grid-column: 1 / -1; - } - - @media (--large) { - grid-column: 5 / -1; - } -} - -.card { - display: flex; - flex-direction: column; - flex-grow: 1; - padding: 32px 24px; - background-color: var(--primary); - color: var(--black); - border-radius: 6px; - box-shadow: 0 2px 3px rgba(101, 106, 118, 0.1), - 0 8px 16px -10px rgba(101, 106, 118, 0.2); - transition: ease-in-out 0.2s; - transition-property: box-shadow; - - &:hover { - box-shadow: 0 2px 3px rgba(101, 106, 118, 0.15), - 0 16px 16px -10px rgba(101, 106, 118, 0.2); - } - - &:nth-of-type(1) { - @nest .consul & { - color: var(--white); - } - } - - &:nth-of-type(2) { - background-color: var(--secondary); - } - - &:nth-of-type(3) { - background-color: var(--gray-6); - } -} - -.cardHeading { - margin: 0; - composes: g-type-display-4 from global; -} - -.cardDescription { - margin: 8px 0 0; - padding-bottom: 48px; - composes: g-type-display-6 from global; -} - -.cardCta { - margin-top: auto; - display: inline-flex; - align-items: center; - composes: g-type-buttons-and-standalone-links from global; - - & svg { - margin-left: 12px; - transition: transform 0.2s; - } - - @nest .card:hover & svg { - transform: translate(2px); - } -} diff --git a/website/components/io-usecase-call-to-action/index.tsx b/website/components/io-usecase-call-to-action/index.tsx deleted file mode 100644 index a74f1df9c..000000000 --- a/website/components/io-usecase-call-to-action/index.tsx +++ /dev/null @@ -1,71 +0,0 @@ -import Image from 'next/image' -import * as React from 'react' -import { Products } from '@hashicorp/platform-product-meta' -import classNames from 'classnames' -import Button from '@hashicorp/react-button' -import s from './style.module.css' - -interface IoUsecaseCallToActionProps { - brand: Products - theme?: 'light' | 'dark' - heading: string - description: string - links: Array<{ - text: string - url: string - }> - // TODO document intended usage - pattern: string -} - -export default function IoUsecaseCallToAction({ - brand, - theme, - heading, - description, - links, - pattern, -}: IoUsecaseCallToActionProps): React.ReactElement { - return ( -
-

{heading}

-
-

{description}

-
- {links.map((link, index) => { - return ( -
-
-
- -
-
- ) -} diff --git a/website/components/io-usecase-call-to-action/style.module.css b/website/components/io-usecase-call-to-action/style.module.css deleted file mode 100644 index 1afcb903d..000000000 --- a/website/components/io-usecase-call-to-action/style.module.css +++ /dev/null @@ -1,66 +0,0 @@ -.callToAction { - --columns: 1; - - position: relative; - display: grid; - grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); - gap: 0 32px; - padding: 32px; - background-color: var(--background-color); - border-radius: 6px; - - &.light { - color: var(--black); - } - - &.dark { - color: var(--white); - } - - @media (--medium-up) { - --columns: 12; - - padding: 0; - } -} - -.heading { - grid-column: 1 / -1; - margin: 0 0 16px; - composes: g-type-display-3 from global; - - @media (--medium-up) { - grid-column: 1 / 6; - padding: 88px 32px 88px 64px; - } -} - -.content { - grid-column: 1 / -1; - - @media (--medium-up) { - grid-column: 6 / 11; - padding: 88px 0; - } -} - -.description { - margin: 0 0 32px; - composes: g-type-body-large from global; -} - -.links { - display: flex; - flex-wrap: wrap; - gap: 16px 32px; -} - -.pattern { - position: relative; - display: none; - - @media (--medium-up) { - grid-column: 11 / -1; - display: flex; - } -} diff --git a/website/components/io-usecase-customer/index.tsx b/website/components/io-usecase-customer/index.tsx deleted file mode 100644 index 288b953b8..000000000 --- a/website/components/io-usecase-customer/index.tsx +++ /dev/null @@ -1,86 +0,0 @@ -import * as React from 'react' -import Image from 'next/image' -import Button from '@hashicorp/react-button' -import s from './style.module.css' - -interface IoUsecaseCustomerProps { - media: { - src: string - width: string - height: string - alt: string - } - logo: { - src: string - width: string - height: string - alt: string - } - heading: string - description: string - stats?: Array<{ - value: string - key: string - }> - link: string -} - -export default function IoUsecaseCustomer({ - media, - logo, - heading, - description, - stats, - link, -}: IoUsecaseCustomerProps): React.ReactElement { - return ( -
-
-
-
- {/* eslint-disable-next-line jsx-a11y/alt-text */} - -
-
-
-
- {/* eslint-disable-next-line jsx-a11y/alt-text */} - -
- Customer case study -
-

{heading}

-

{description}

- {link ? ( -
-
- ) : null} -
-
- {stats.length > 0 ? ( -
    - {stats.map(({ key, value }, index) => { - return ( - // Index is stable - // eslint-disable-next-line react/no-array-index-key -
  • -

    {value}

    -

    {key}

    -
  • - ) - })} -
- ) : null} -
-
- ) -} diff --git a/website/components/io-usecase-customer/style.module.css b/website/components/io-usecase-customer/style.module.css deleted file mode 100644 index 3444e4a22..000000000 --- a/website/components/io-usecase-customer/style.module.css +++ /dev/null @@ -1,118 +0,0 @@ -.customer { - position: relative; - background-color: var(--black); - color: var(--white); - padding-bottom: 64px; - - @media (--medium-up) { - padding-bottom: 132px; - } -} - -.container { - composes: g-grid-container from global; -} - -.columns { - --columns: 1; - - display: grid; - grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); - gap: 64px 32px; - - @media (--medium-up) { - --columns: 12; - } -} - -.media { - margin-top: -64px; - grid-column: 1 / -1; - - @media (--medium-up) { - grid-column: 1 / 7; - } -} - -.content { - grid-column: 1 / -1; - - @media (--medium-up) { - padding-top: 64px; - grid-column: 8 / -1; - } -} - -.eyebrow { - display: flex; -} - -.eyebrowLogo { - display: flex; - max-width: 120px; -} - -.eyebrowLabel { - padding-top: 8px; - padding-bottom: 8px; - padding-left: 12px; - margin-left: 12px; - border-left: 1px solid var(--gray-5); - align-self: center; - composes: g-type-label-small-strong from global; -} - -.heading { - margin: 32px 0 24px; - composes: g-type-display-2 from global; -} - -.description { - margin: 0; - composes: g-type-body from global; -} - -.cta { - margin-top: 32px; -} - -.stats { - --columns: 1; - - list-style: none; - margin: 64px 0 0; - padding: 0; - display: grid; - grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); - gap: 32px; - - @media (--medium-up) { - --columns: 12; - - margin-top: 132px; - } - - & > li { - border-top: 1px solid var(--gray-2); - grid-column: span 4; - } -} - -.value { - margin: 0; - padding-top: 32px; - font-family: var(--font-display); - font-size: 50px; - font-weight: 700; - line-height: 1; - - @media (--large) { - font-size: 80px; - } -} - -.key { - margin: 12px 0 0; - composes: g-type-display-4 from global; - color: var(--gray-3); -} diff --git a/website/components/io-usecase-hero/index.tsx b/website/components/io-usecase-hero/index.tsx deleted file mode 100644 index 4838678e8..000000000 --- a/website/components/io-usecase-hero/index.tsx +++ /dev/null @@ -1,41 +0,0 @@ -import * as React from 'react' -import Image from 'next/image' -import s from './style.module.css' - -interface IoUsecaseHeroProps { - eyebrow: string - heading: string - description: string - pattern?: string -} - -export default function IoUsecaseHero({ - eyebrow, - heading, - description, - pattern, -}: IoUsecaseHeroProps): React.ReactElement { - return ( -
-
-
- {pattern ? ( - - ) : null} -
-
-

{eyebrow}

-

{heading}

-

{description}

-
-
-
- ) -} diff --git a/website/components/io-usecase-hero/pattern.svg b/website/components/io-usecase-hero/pattern.svg deleted file mode 100644 index f4b1ef3af..000000000 --- a/website/components/io-usecase-hero/pattern.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/website/components/io-usecase-hero/style.module.css b/website/components/io-usecase-hero/style.module.css deleted file mode 100644 index 5fd729c8e..000000000 --- a/website/components/io-usecase-hero/style.module.css +++ /dev/null @@ -1,83 +0,0 @@ -.hero { - position: relative; - max-width: 1600px; - margin-right: auto; - margin-left: auto; - - &::before { - content: ''; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - background-image: radial-gradient( - 95.97% 95.97% at 50% 100%, - #f2f2f3 0%, - rgba(242, 242, 243, 0) 100% - ); - - @media (--medium-up) { - border-radius: 6px; - left: 24px; - right: 24px; - } - } -} - -.container { - @media (--medium-up) { - display: grid; - grid-template-columns: 1fr max-content 1fr; - gap: 32px; - } -} - -.pattern { - margin-left: 24px; - transform: translateY(24px); - position: relative; - display: flex; - flex-direction: column; - justify-content: flex-end; - - @media (--small) { - display: none; - } - - @media (--medium) { - & > * { - display: none !important; - } - } -} - -.content { - position: relative; - max-width: 520px; - width: 100%; - margin-right: auto; - margin-left: auto; - padding: 64px 24px; - - @media (--medium-up) { - padding-top: 132px; - padding-bottom: 132px; - } -} - -.eyebrow { - margin: 0; - composes: g-type-label-strong from global; -} - -.heading { - margin: 24px 0; - composes: g-type-display-1 from global; -} - -.description { - margin: 0; - composes: g-type-body-large from global; - color: var(--gray-2); -} diff --git a/website/components/io-usecase-section/index.tsx b/website/components/io-usecase-section/index.tsx deleted file mode 100644 index 11ed7917f..000000000 --- a/website/components/io-usecase-section/index.tsx +++ /dev/null @@ -1,81 +0,0 @@ -import * as React from 'react' -import { Products } from '@hashicorp/platform-product-meta' -import classNames from 'classnames' -import Image from 'next/image' -import Button from '@hashicorp/react-button' -import s from './style.module.css' - -interface IoUsecaseSectionProps { - brand?: Products | 'neutral' - bottomIsFlush?: boolean - eyebrow: string - heading: string - description: string - media?: { - src: string - width: string - height: string - alt: string - } - cta?: { - text: string - link: string - } -} - -export default function IoUsecaseSection({ - brand = 'neutral', - bottomIsFlush = false, - eyebrow, - heading, - description, - media, - cta, -}: IoUsecaseSectionProps): React.ReactElement { - return ( -
-
-

{eyebrow}

-
-
-

{heading}

- {media?.src ? ( -
- ) : null} - {cta?.link && cta?.text ? ( -
-
- ) : null} -
-
- {media?.src ? ( - // eslint-disable-next-line jsx-a11y/alt-text - - ) : ( -
- )} -
-
-
-
- ) -} diff --git a/website/components/io-usecase-section/style.module.css b/website/components/io-usecase-section/style.module.css deleted file mode 100644 index a2b56d1f5..000000000 --- a/website/components/io-usecase-section/style.module.css +++ /dev/null @@ -1,106 +0,0 @@ -.section { - position: relative; - max-width: 1600px; - margin-right: auto; - margin-left: auto; - padding-top: 64px; - padding-bottom: 64px; - - @media (--medium-up) { - padding-top: 132px; - padding-bottom: 132px; - } - - & + .section { - padding-bottom: 132px; - - &::before { - content: ''; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - background-color: var(--gray-6); - opacity: 0.4; - - @media (--medium-up) { - border-radius: 6px; - left: 24px; - right: 24px; - } - } - } - - &.isFlush { - padding-bottom: 96px; - - @media (--medium-up) { - padding-bottom: 164px; - } - - &::before { - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; - } - } -} - -.container { - composes: g-grid-container from global; -} - -.columns { - --columns: 1; - - display: grid; - grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); - gap: 32px; - - @media (--medium-up) { - --columns: 12; - } -} - -.column { - &:nth-child(1) { - @media (--medium-up) { - grid-column: 1 / 7; - } - } - - &:nth-child(2) { - @media (--medium-up) { - grid-column: 8 / -1; - padding-top: 16px; - } - } -} - -.eyebrow { - margin: 0; - composes: g-type-display-5 from global; -} - -.heading { - margin: 16px 0 32px; - padding-bottom: 32px; - composes: g-type-display-3 from global; - border-bottom: 1px solid var(--black); -} - -.description { - composes: g-type-body from global; - - & > p { - margin: 0; - - & + p { - margin-top: 16px; - } - } -} - -.cta { - margin-top: 32px; -} diff --git a/website/components/io-video-callout/index.tsx b/website/components/io-video-callout/index.tsx deleted file mode 100644 index 3f516d185..000000000 --- a/website/components/io-video-callout/index.tsx +++ /dev/null @@ -1,84 +0,0 @@ -import * as React from 'react' -import Image from 'next/image' -import ReactPlayer from 'react-player' -import VisuallyHidden from '@reach/visually-hidden' -import IoDialog from 'components/io-dialog' -import PlayIcon from './play-icon' -import s from './style.module.css' - -export interface IoHomeVideoCalloutProps { - youtubeId: string - thumbnail: string - heading: string - description: string - person?: { - avatar: string - name: string - description: string - } -} - -export default function IoVideoCallout({ - youtubeId, - thumbnail, - heading, - description, - person, -}: IoHomeVideoCalloutProps): React.ReactElement { - const [showDialog, setShowDialog] = React.useState(false) - const showVideo = () => setShowDialog(true) - const hideVideo = () => setShowDialog(false) - return ( - <> -
- -
-

{heading}

-

{description}

- {person && ( -
- {person.avatar ? ( -
- {`${person.name} -
- ) : null} -
- {person.name ? ( -

{person.name}

- ) : null} - {person.description ? ( -

{person.description}

- ) : null} -
-
- )} -
-
- -

{heading}

-
- -
-
- - ) -} diff --git a/website/components/io-video-callout/play-icon.tsx b/website/components/io-video-callout/play-icon.tsx deleted file mode 100644 index 37395ba2b..000000000 --- a/website/components/io-video-callout/play-icon.tsx +++ /dev/null @@ -1,23 +0,0 @@ -import * as React from 'react' - -export default function PlayIcon(): React.ReactElement { - return ( - - - - - ) -} diff --git a/website/components/io-video-callout/style.module.css b/website/components/io-video-callout/style.module.css deleted file mode 100644 index 815601ff0..000000000 --- a/website/components/io-video-callout/style.module.css +++ /dev/null @@ -1,128 +0,0 @@ -.videoCallout { - --columns: 1; - - margin: 0; - display: grid; - grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); - gap: 32px; - background-color: var(--black); - border-radius: 6px; - overflow: hidden; - - @media (--medium-up) { - --columns: 12; - } -} - -.thumbnail { - position: relative; - display: grid; - place-items: center; - grid-column: 1 / -1; - background-color: transparent; - border: 0; - cursor: pointer; - padding: 96px 32px; - min-height: 300px; - - @media (--medium-up) { - grid-column: 1 / 7; - } - - @media (--large) { - grid-column: 1 / 9; - } - - & > svg { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - z-index: 1; - - @media (--small) { - width: 52px; - height: 52px; - } - } - - &::after { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background-color: #000; - opacity: 0.45; - transition: opacity ease-in-out 0.2s; - } - - &:hover::after { - opacity: 0.2; - } -} - -.content { - padding: 32px; - grid-column: 1 / -1; - - @media (--medium-up) { - padding: 80px 32px; - grid-column: 7 / -1; - } - - @media (--large) { - grid-column: 9 / -1; - } -} - -.heading { - margin: 0; - composes: g-type-display-4 from global; - color: var(--white); -} - -.description { - margin: 8px 0 0; - composes: g-type-body-small from global; - color: var(--white); -} - -.person { - margin-top: 64px; - display: flex; - align-items: center; - gap: 16px; -} - -.personThumbnail { - display: flex; - border-radius: 9999px; - overflow: hidden; -} - -.personName { - margin: 0; - composes: g-type-body-strong from global; - color: var(--white); -} - -.personDescription { - margin: 4px 0 0; - composes: g-type-label-strong from global; - color: var(--gray-3); -} - -.videoHeading { - margin-top: 0; - margin-bottom: 32px; - padding-right: 100px; - composes: g-type-display-4 from global; -} - -.video { - position: relative; - background-color: var(--gray-2); - aspect-ratio: 16 / 9; -} diff --git a/website/components/mini-cta/index.jsx b/website/components/mini-cta/index.jsx deleted file mode 100644 index c2bf87630..000000000 --- a/website/components/mini-cta/index.jsx +++ /dev/null @@ -1,23 +0,0 @@ -import Button from '@hashicorp/react-button' - -export default function MiniCTA({ title, description, link }) { - return ( -
-
-
-
{title}
- {description &&

{description}

} -
-
- ) -} diff --git a/website/components/mini-cta/style.css b/website/components/mini-cta/style.css deleted file mode 100644 index 8f76813ac..000000000 --- a/website/components/mini-cta/style.css +++ /dev/null @@ -1,36 +0,0 @@ -.g-mini-cta { - background: var(--gray-6); - text-align: center; - padding-bottom: 64px; - padding-top: 48px; - - & hr { - width: 64px; - color: var(--gray-4); - margin: 0 auto 64px auto; - - @media (max-width: 800px) { - margin: 0 auto 24px auto; - } - } - - & h5 { - margin: 0; - margin-bottom: 14px; - } - - & p { - margin: 0; - margin-bottom: 24px; - - @media (max-width: 800px) { - margin-bottom: 16px; - } - } - - & .g-btn { - & span { - font-weight: 500; - } - } -} diff --git a/website/components/placement-table/index.jsx b/website/components/placement-table/index.jsx deleted file mode 100644 index c906e6064..000000000 --- a/website/components/placement-table/index.jsx +++ /dev/null @@ -1,42 +0,0 @@ -import { Fragment } from 'react' - -export default function PlacementTable({ groups = [] }) { - return ( - - - - - - - -
- Placement - - {Array.isArray(groups[0]) ? ( - groups.map((subgroup) => { - return ( - - '), - }} - /> -
-
- ) - }) - ) : ( - '), - }} - /> - )} -
- ) -} - -function wrapLastItem(arr, wrapper) { - arr[arr.length - 1] = `<${wrapper}>${arr[arr.length - 1]}` - return arr -} diff --git a/website/components/placement-table/style.css b/website/components/placement-table/style.css deleted file mode 100644 index 107c572aa..000000000 --- a/website/components/placement-table/style.css +++ /dev/null @@ -1,13 +0,0 @@ -.g-placement-table { - box-sizing: border-box; - - & td, - & th { - padding: 8px 20px; - border-right: 1px solid #ddd; - } - - & .head { - font-weight: bold; - } -} diff --git a/website/components/subnav/index.jsx b/website/components/subnav/index.jsx deleted file mode 100644 index 341ae8475..000000000 --- a/website/components/subnav/index.jsx +++ /dev/null @@ -1,32 +0,0 @@ -import Subnav from '@hashicorp/react-subnav' -import { useRouter } from 'next/router' -import s from './style.module.css' - -export default function NomadSubnav({ menuItems }) { - const router = useRouter() - return ( - - ) -} diff --git a/website/components/subnav/style.module.css b/website/components/subnav/style.module.css deleted file mode 100644 index 5cb3cbccd..000000000 --- a/website/components/subnav/style.module.css +++ /dev/null @@ -1,3 +0,0 @@ -.subnav { - border-top: 1px solid transparent; -} diff --git a/website/components/use-case-page/index.jsx b/website/components/use-case-page/index.jsx deleted file mode 100644 index 7df244cd6..000000000 --- a/website/components/use-case-page/index.jsx +++ /dev/null @@ -1,49 +0,0 @@ -import CallToAction from '@hashicorp/react-call-to-action' -import NomadEnterpriseInfo from 'components/enterprise-info/nomad' -import BasicHero from 'components/basic-hero' - -export default function UseCaseLayout({ title, description, children }) { - return ( -
- -
-

Features

-
- {children} - - -
- ) -} diff --git a/website/components/use-case-page/style.css b/website/components/use-case-page/style.css deleted file mode 100644 index 27e222ebf..000000000 --- a/website/components/use-case-page/style.css +++ /dev/null @@ -1,40 +0,0 @@ -#p-use-case { - & .features-header { - text-align: center; - margin-bottom: 0; - } - - /* Overriding the g-text-split component to have - * a header size closer to a h3 than a h2, as within - * the context of this page this text-split is more deeply - * nested within the page than we normally have it. - * */ - & .g-text-split { - & h2 { - font-size: 1.5rem; - letter-spacing: -0.004em; - line-height: 1.375em; - - @media (--medium-up) { - font-size: 1.75rem; - line-height: 1.321em; - } - - @media (--large) { - font-size: 2rem; - letter-spacing: -0.006em; - line-height: 1.313em; - } - } - } - - & .with-border { - & .g-text-split { - & .children { - border-width: 1px; - border-color: rgba(174, 176, 183, 0.45); - border-style: solid; - } - } - } -} diff --git a/website/data/alert-banner.js b/website/data/alert-banner.js deleted file mode 100644 index f5bb02226..000000000 --- a/website/data/alert-banner.js +++ /dev/null @@ -1,11 +0,0 @@ -export const ALERT_BANNER_ACTIVE = true -// https://github.com/hashicorp/web-components/tree/master/packages/alert-banner -export default { - tag: 'Survey', - url: 'https://docs.google.com/forms/d/e/1FAIpQLSeyDEyQXzkijZnkXjj8qVb_5IydajRkFnOrPjDNoysFs-6jDQ/viewform', - text: 'Using Nomad for edge workloads? We want to hear about it!', - linkText: 'Fill out our user survey', - // Set the expirationDate prop with a datetime string (e.g. '2020-01-31T12:00:00-07:00') - // if you'd like the component to stop showing at or after a certain date - expirationDate: '2022-02-08T23:00:00-07:00', -} diff --git a/website/data/metadata.js b/website/data/metadata.js deleted file mode 100644 index 2a0c093fa..000000000 --- a/website/data/metadata.js +++ /dev/null @@ -1,2 +0,0 @@ -export const productName = 'Nomad' -export const productSlug = 'nomad' diff --git a/website/data/subnav.js b/website/data/subnav.js deleted file mode 100644 index ce213fc78..000000000 --- a/website/data/subnav.js +++ /dev/null @@ -1,41 +0,0 @@ -const subnavData = [ - { text: 'Overview', url: '/', type: 'inbound' }, - { - text: 'Enterprise', - url: 'https://www.hashicorp.com/products/nomad/', - type: 'outbound', - }, - 'divider', - { - text: 'Tutorials', - url: 'https://learn.hashicorp.com/nomad', - type: 'outbound', - }, - { - text: 'Docs', - url: '/docs', - type: 'inbound', - }, - { - text: 'API', - url: '/api-docs', - type: 'inbound', - }, - { - text: 'Plugins', - url: '/plugins', - type: 'inbound', - }, - { - text: 'Tools', - url: '/tools', - type: 'inbound', - }, - { - text: 'Community', - url: '/community', - type: 'inbound', - }, -] - -export default subnavData diff --git a/website/data/version.js b/website/data/version.js deleted file mode 100644 index 4800677a1..000000000 --- a/website/data/version.js +++ /dev/null @@ -1 +0,0 @@ -export default '1.2.6' diff --git a/website/global.d.ts b/website/global.d.ts deleted file mode 100644 index 110e4fff2..000000000 --- a/website/global.d.ts +++ /dev/null @@ -1 +0,0 @@ -/// diff --git a/website/jsconfig.json b/website/jsconfig.json deleted file mode 100644 index 135bd5248..000000000 --- a/website/jsconfig.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "compilerOptions": { - "baseUrl": "." - }, - "exclude": ["node_modules", ".next", "out"] -} diff --git a/website/layouts/standard/index.tsx b/website/layouts/standard/index.tsx deleted file mode 100644 index fcd4c4042..000000000 --- a/website/layouts/standard/index.tsx +++ /dev/null @@ -1,78 +0,0 @@ -import query from './query.graphql' -import ProductSubnav from 'components/subnav' -import Footer from 'components/footer' -import { open } from '@hashicorp/react-consent-manager' - -export default function StandardLayout(props: Props): React.ReactElement { - const { useCaseNavItems } = props.data - return ( - <> - { - return { - text: item.text, - url: `/use-cases/${item.url}`, - } - }), - ].sort((a, b) => a.text.localeCompare(b.text)), - }, - { - text: 'Enterprise', - url: 'https://www.hashicorp.com/products/nomad/', - type: 'outbound', - }, - 'divider', - { - text: 'Tutorials', - url: 'https://learn.hashicorp.com/nomad', - type: 'outbound', - }, - { - text: 'Docs', - url: '/docs', - type: 'inbound', - }, - { - text: 'API', - url: '/api-docs', - type: 'inbound', - }, - { - text: 'Plugins', - url: '/plugins', - type: 'inbound', - }, - { - text: 'Tools', - url: '/tools', - type: 'inbound', - }, - { - text: 'Community', - url: '/community', - type: 'inbound', - }, - ]} - /> - {props.children} -