// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Home index creates snapshot 1`] = `
<DocumentFragment>
  <div
    class="d-flex flex-column flex-grow-1 home"
  >
    <div
      class="jumbotron mb-0 text-center jumbotron"
    >
      <div
        class="display-4 text-center font-weight-light mainTitle"
        role="heading"
      >
        Find, install and publish
        <br />
        Kubernetes packages
      </div>
      <div
        class="mt-5 text-center"
      >
        <div
          class="position-relative m-auto w-50 search"
        >
          <div
            class="d-flex align-items-strecht overflow-hidden searchBar big"
          >
            <div
              class="d-none d-sm-flex align-items-center iconWrapper"
              data-testid="searchBarIcon"
            >
              <svg
                fill="none"
                height="1em"
                stroke="currentColor"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
                viewBox="0 0 24 24"
                width="1em"
                xmlns="http://www.w3.org/2000/svg"
              >
                <circle
                  cx="11"
                  cy="11"
                  r="8"
                />
                <line
                  x1="21"
                  x2="16.65"
                  y1="21"
                  y2="16.65"
                />
              </svg>
            </div>
            <input
              aria-label="Search"
              autocapitalize="none"
              autocomplete="off"
              autocorrect="off"
              class="flex-grow-1 pl-sm-0 pl-3 input"
              disabled=""
              placeholder="Search packages"
              spellcheck="false"
              type="text"
              value=""
            />
            <button
              aria-label="Close"
              class="close inputClean invisible"
              data-testid="cleanBtn"
              type="button"
            >
              <span
                aria-hidden="true"
              >
                ×
              </span>
            </button>
          </div>
          <div
            class="position-absolute text-light loading"
          >
            <span
              class="spinner-border spinner-border-lg"
              data-testid="searchBarSpinning"
            />
          </div>
        </div>
        <div />
        <div
          class="d-inline-block d-md-none text-center mt-3"
        >
          - or -
          <a
            class="btn btn-link text-light font-weight-bold py-0 pb-1 pl-1"
            href="/packages/search"
          >
            <u>
              browse all packages
            </u>
          </a>
        </div>
        <div
          class="d-none d-md-inline-block text-center mt-5"
        >
          You can also 
          <a
            class="btn btn-link text-light font-weight-bold py-0 pb-1 pl-1"
            href="/packages/search"
          >
            <u>
              browse all packages
            </u>
          </a>
           - or - 
          <span
            class="ml-3"
          >
            try one of the sample queries:
          </span>
        </div>
        <div
          class="d-none d-md-flex flex-row align-items-end justify-content-center flex-wrap"
        >
          <a
            class="badge badge-pill badge-secondary border border-light font-weight-normal mx-2 mt-3"
            data-testid="sampleFilter"
            href="/packages/search?page=1&ts_query_web=database&kind=3"
          >
            OLM operators for databases
          </a>
          <a
            class="badge badge-pill badge-secondary border border-light font-weight-normal mx-2 mt-3"
            data-testid="sampleFilter"
            href="/packages/search?page=1&kind=0&org=bitnami"
          >
            Helm Charts provided by Bitnami
          </a>
          <a
            class="badge badge-pill badge-secondary border border-light font-weight-normal mx-2 mt-3"
            data-testid="sampleFilter"
            href="/packages/search?page=1&ts_query_web=etcd"
          >
            Packages of any kind related to etcd
          </a>
        </div>
        <div
          class="d-none d-md-flex flex-row align-items-start justify-content-center flex-wrap"
        >
          <a
            class="badge badge-pill badge-secondary border border-light font-weight-normal mx-2 mt-3"
            data-testid="sampleFilter"
            href="/packages/search?page=1&ts_query_web=CVE&kind=1"
          >
            Falco rules for CVE
          </a>
          <a
            class="badge badge-pill badge-secondary border border-light font-weight-normal mx-2 mt-3"
            data-testid="sampleFilter"
            href="/packages/search?page=1&ts_query=monitoring&kind=3"
          >
            OLM operators in the monitoring category
          </a>
        </div>
      </div>
      <div
        class="d-flex align-items-center justify-content-center mt-4 mt-md-5"
      >
        <div
          class="text-center counterWrapper"
        >
          <div
            class="h3 counter"
          >
            <div
              class="spinner-grow text-primary"
              role="status"
            />
          </div>
          <small
            class="text-uppercase"
          >
            packages
          </small>
        </div>
        <div
          class="mx-3 mx-md-5 separator"
        />
        <div
          class="text-center counterWrapper"
        >
          <div
            class="h3 counter"
          >
            <div
              class="spinner-grow text-primary"
              role="status"
            />
          </div>
          <small
            class="text-uppercase"
          >
            releases
          </small>
        </div>
      </div>
      <div
        class="text-center h5 my-4 mt-md-5 legend"
      >
        Artifact Hub is an 
        <b>
          Open Source
        </b>
         project
      </div>
      <div
        class="mb-4 mb-md-2 text-center"
      >
        <a
          class="link btn btn-secondary socialBtn"
          href="https://github.com/cncf/hub"
          rel="noopener noreferrer"
          role="button"
          target="_blank"
        >
          <div
            class="d-flex align-items-center justify-content-center"
          >
            <svg
              class="mr-2"
              fill="currentColor"
              height="1em"
              stroke="currentColor"
              stroke-width="0"
              viewBox="0 0 496 512"
              width="1em"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"
              />
            </svg>
            GitHub
          </div>
        </a>
        <a
          class="link btn btn-secondary ml-2 ml-md-3 socialBtn"
          href="https://cloud-native.slack.com/channels/artifact-hub"
          rel="noopener noreferrer"
          role="button"
          target="_blank"
        >
          <div
            class="d-flex align-items-center justify-content-center"
          >
            <svg
              class="mr-2"
              fill="currentColor"
              height="1em"
              stroke="currentColor"
              stroke-width="0"
              viewBox="0 0 448 512"
              width="1em"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                d="M94.12 315.1c0 25.9-21.16 47.06-47.06 47.06S0 341 0 315.1c0-25.9 21.16-47.06 47.06-47.06h47.06v47.06zm23.72 0c0-25.9 21.16-47.06 47.06-47.06s47.06 21.16 47.06 47.06v117.84c0 25.9-21.16 47.06-47.06 47.06s-47.06-21.16-47.06-47.06V315.1zm47.06-188.98c-25.9 0-47.06-21.16-47.06-47.06S139 32 164.9 32s47.06 21.16 47.06 47.06v47.06H164.9zm0 23.72c25.9 0 47.06 21.16 47.06 47.06s-21.16 47.06-47.06 47.06H47.06C21.16 243.96 0 222.8 0 196.9s21.16-47.06 47.06-47.06H164.9zm188.98 47.06c0-25.9 21.16-47.06 47.06-47.06 25.9 0 47.06 21.16 47.06 47.06s-21.16 47.06-47.06 47.06h-47.06V196.9zm-23.72 0c0 25.9-21.16 47.06-47.06 47.06-25.9 0-47.06-21.16-47.06-47.06V79.06c0-25.9 21.16-47.06 47.06-47.06 25.9 0 47.06 21.16 47.06 47.06V196.9zM283.1 385.88c25.9 0 47.06 21.16 47.06 47.06 0 25.9-21.16 47.06-47.06 47.06-25.9 0-47.06-21.16-47.06-47.06v-47.06h47.06zm0-23.72c-25.9 0-47.06-21.16-47.06-47.06 0-25.9 21.16-47.06 47.06-47.06h117.84c25.9 0 47.06 21.16 47.06 47.06 0 25.9-21.16 47.06-47.06 47.06H283.1z"
              />
            </svg>
            Slack
          </div>
        </a>
        <a
          class="link btn btn-secondary ml-2 ml-md-3 socialBtn"
          href="https://twitter.com/cncfartifacthub"
          rel="noopener noreferrer"
          role="button"
          target="_blank"
        >
          <div
            class="d-flex align-items-center justify-content-center"
          >
            <svg
              class="mr-2"
              fill="currentColor"
              height="1em"
              stroke="currentColor"
              stroke-width="0"
              viewBox="0 0 512 512"
              width="1em"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"
              />
            </svg>
            Twitter
          </div>
        </a>
      </div>
    </div>
    <div />
    <div
      class="py-5 text-light about"
    >
      <div
        class="container py-0 py-md-5"
      >
        <div
          class="text-center px-3 px-md-0"
        >
          Artifact Hub is a web-based application that enables finding, installing, and publishing packages and configurations for CNCF projects. For example, this could include Helm charts, Falco configurations, Open Policy Agent (OPA) policies, and OLM operators.
          <div
            class="mx-3 mx-lg-5 my-4 my-lg-5 d-flex flex-row align-items-center justify-content-around"
          >
            <img
              alt="Icon"
              class="aboutIcon"
              src="/static/media/helm-chart-white.svg"
            />
            <img
              alt="Icon"
              class="aboutIcon"
              src="/static/media/falco-rules-white.svg"
            />
            <img
              alt="Icon"
              class="aboutIcon"
              src="/static/media/opa-policies-white.svg"
            />
            <img
              alt="Icon"
              class="aboutIcon"
              src="/static/media/olm-operators-white.svg"
            />
          </div>
          Discovering artifacts to use with CNCF projects can be difficult. If every CNCF project that needs to share artifacts creates its own Hub this creates a fair amount of repeat work for each project and a fractured experience for those trying to find the artifacts to consume. The Artifact Hub attempts to solve that by providing a single experience for consumers that any CNCF project can leverage.
        </div>
      </div>
    </div>
    <div
      class="py-5 text-secondary extraInfo"
    >
      <div
        class="container py-0 py-md-5"
      >
        <div
          class="text-center px-3 px-md-0"
        >
          <img
            alt="Logo CNCF sandbox project"
            class="logo"
            src="/static/media/cncf-sandbox-horizontal-color.png"
          />
          <div
            class="px-3 pt-4"
          >
            Artifact Hub is a 
            <a
              class="link font-weight-bold text-primary"
              href="https://www.cncf.io/sandbox-projects/"
              rel="noopener noreferrer"
              role="button"
              target="_blank"
            >
              Cloud Native Computing Foundation
            </a>
             sandbox project.
          </div>
        </div>
      </div>
    </div>
  </div>
</DocumentFragment>
`;
