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

exports[`Learn GitLab Design B renders correctly 1`] = `
<div>
  <div
    class="row"
  >
    <div
      class="gl-mb-7 col-md-8 col-lg-7"
    >
      <h1
        class="gl-font-size-h1"
      >
        Learn GitLab
      </h1>
       
      <p
        class="gl-text-gray-700 gl-mb-0"
      >
        Ready to get started with GitLab? Follow these steps to set up your workspace, plan and commit changes, and deploy your project.
      </p>
    </div>
  </div>
   
  <div
    class="gl-mb-3"
  >
    <p
      class="gl-text-gray-500 gl-mb-2"
      data-testid="completion-percentage"
    >
      22% completed
    </p>
     
    <div
      class="progress"
      max="9"
      value="2"
    >
      <div
        aria-valuemax="9"
        aria-valuemin="0"
        aria-valuenow="2"
        class="progress-bar"
        role="progressbar"
        style="width: 22.22222222222222%;"
      />
    </div>
  </div>
   
  <h2
    class="gl-font-lg gl-mb-3"
  >
    Set up your workspace
  </h2>
   
  <p
    class="gl-text-gray-700 gl-mb-6"
  >
    Complete these tasks first so you can enjoy GitLab's features to their fullest:
  </p>
   
  <div
    class="row row-cols-2 row-cols-md-3 row-cols-lg-4"
  >
    <div
      class="col gl-mb-6"
    >
      <div
        class="gl-card gl-pt-0"
      >
        <!---->
         
        <div
          class="gl-card-body"
        >
          <div
            class="gl-text-right gl-h-5"
          >
            <svg
              aria-hidden="true"
              class="gl-text-green-500 gl-icon s16"
              data-testid="completed-icon"
              role="img"
            >
              <use
                href="#check-circle-filled"
              />
            </svg>
          </div>
           
          <div
            class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content"
          >
            <img
              alt="Invite your colleagues"
              src="http://example.com/images/illustration.svg"
            />
             
            <h6>
              Invite your colleagues
            </h6>
             
            <p
              class="gl-font-sm gl-text-gray-700"
            >
              GitLab works best as a team. Invite your colleague to enjoy all features.
            </p>
             
            <a
              class="gl-link"
              data-track-action="click_link"
              data-track-label="Invite your colleagues"
              data-track-property="Growth::Activation::Experiment::LearnGitLabB"
              href="http://example.com/"
              rel="noopener noreferrer"
              target="_blank"
            >
              Invite your colleagues
            </a>
          </div>
        </div>
         
        <!---->
      </div>
    </div>
     
    <div
      class="col gl-mb-6"
    >
      <div
        class="gl-card gl-pt-0"
      >
        <!---->
         
        <div
          class="gl-card-body"
        >
          <div
            class="gl-text-right gl-h-5"
          >
            <svg
              aria-hidden="true"
              class="gl-text-green-500 gl-icon s16"
              data-testid="completed-icon"
              role="img"
            >
              <use
                href="#check-circle-filled"
              />
            </svg>
          </div>
           
          <div
            class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content"
          >
            <img
              alt="Create or import a repository"
              src="http://example.com/images/illustration.svg"
            />
             
            <h6>
              Create or import a repository
            </h6>
             
            <p
              class="gl-font-sm gl-text-gray-700"
            >
              Create or import your first repository into your new project.
            </p>
             
            <a
              class="gl-link"
              data-track-action="click_link"
              data-track-label="Create or import a repository"
              data-track-property="Growth::Activation::Experiment::LearnGitLabB"
              href="http://example.com/"
              rel="noopener noreferrer"
              target="_blank"
            >
              Create or import a repository
            </a>
          </div>
        </div>
         
        <!---->
      </div>
    </div>
     
    <div
      class="col gl-mb-6"
    >
      <div
        class="gl-card gl-pt-0"
      >
        <!---->
         
        <div
          class="gl-card-body"
        >
          <div
            class="gl-text-right gl-h-5"
          >
            <!---->
          </div>
           
          <div
            class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content"
          >
            <img
              alt="Set-up CI/CD"
              src="http://example.com/images/illustration.svg"
            />
             
            <h6>
              Set up CI/CD
            </h6>
             
            <p
              class="gl-font-sm gl-text-gray-700"
            >
              Save time by automating your integration and deployment tasks.
            </p>
             
            <a
              class="gl-link"
              data-track-action="click_link"
              data-track-label="Set-up CI/CD"
              data-track-property="Growth::Activation::Experiment::LearnGitLabB"
              href="http://example.com/"
              rel="noopener noreferrer"
              target="_blank"
            >
              Set-up CI/CD
            </a>
          </div>
        </div>
         
        <!---->
      </div>
    </div>
     
    <div
      class="col gl-mb-6"
    >
      <div
        class="gl-card gl-pt-0"
      >
        <!---->
         
        <div
          class="gl-card-body"
        >
          <div
            class="gl-text-right gl-h-5"
          >
            <!---->
          </div>
           
          <div
            class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content"
          >
            <img
              alt="Try GitLab Ultimate for free"
              src="http://example.com/images/illustration.svg"
            />
             
            <h6>
              Start a free Ultimate trial
            </h6>
             
            <p
              class="gl-font-sm gl-text-gray-700"
            >
              Try all GitLab features for 30 days, no credit card required.
            </p>
             
            <a
              class="gl-link"
              data-track-action="click_link"
              data-track-label="Try GitLab Ultimate for free"
              data-track-property="Growth::Activation::Experiment::LearnGitLabB"
              href="http://example.com/"
              rel="noopener noreferrer"
              target="_blank"
            >
              Try GitLab Ultimate for free
            </a>
          </div>
        </div>
         
        <!---->
      </div>
    </div>
     
    <div
      class="col gl-mb-6"
    >
      <div
        class="gl-card gl-pt-0"
      >
        <!---->
         
        <div
          class="gl-card-body"
        >
          <div
            class="gl-text-right gl-h-5"
          >
            <span
              class="gl-text-gray-500 gl-font-sm gl-font-style-italic"
              data-testid="trial-only"
            >
              Trial only
            </span>
          </div>
           
          <div
            class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content"
          >
            <img
              alt="Add code owners"
              src="http://example.com/images/illustration.svg"
            />
             
            <h6>
              Add code owners
            </h6>
             
            <p
              class="gl-font-sm gl-text-gray-700"
            >
              Prevent unexpected changes to important assets by assigning ownership of files and paths.
            </p>
             
            <a
              class="gl-link"
              data-track-action="click_link"
              data-track-label="Add code owners"
              data-track-property="Growth::Activation::Experiment::LearnGitLabB"
              href="http://example.com/"
              rel="noopener noreferrer"
              target="_blank"
            >
              Add code owners
            </a>
          </div>
        </div>
         
        <!---->
      </div>
    </div>
     
    <div
      class="col gl-mb-6"
    >
      <div
        class="gl-card gl-pt-0"
      >
        <!---->
         
        <div
          class="gl-card-body"
        >
          <div
            class="gl-text-right gl-h-5"
          >
            <span
              class="gl-text-gray-500 gl-font-sm gl-font-style-italic"
              data-testid="trial-only"
            >
              Trial only
            </span>
          </div>
           
          <div
            class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content"
          >
            <img
              alt="Enable require merge approvals"
              src="http://example.com/images/illustration.svg"
            />
             
            <h6>
              Add merge request approval
            </h6>
             
            <p
              class="gl-font-sm gl-text-gray-700"
            >
              Route code reviews to the right reviewers, every time.
            </p>
             
            <a
              class="gl-link"
              data-track-action="click_link"
              data-track-label="Enable require merge approvals"
              data-track-property="Growth::Activation::Experiment::LearnGitLabB"
              href="http://example.com/"
              rel="noopener noreferrer"
              target="_blank"
            >
              Enable require merge approvals
            </a>
          </div>
        </div>
         
        <!---->
      </div>
    </div>
  </div>
   
  <h2
    class="gl-font-lg gl-mb-3"
  >
    Plan and execute
  </h2>
   
  <p
    class="gl-text-gray-700 gl-mb-6"
  >
    Create a workflow for your new workspace, and learn how GitLab features work together:
  </p>
   
  <div
    class="row row-cols-2 row-cols-md-3 row-cols-lg-4"
  >
    <div
      class="col gl-mb-6"
    >
      <div
        class="gl-card gl-pt-0"
      >
        <!---->
         
        <div
          class="gl-card-body"
        >
          <div
            class="gl-text-right gl-h-5"
          >
            <!---->
          </div>
           
          <div
            class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content"
          >
            <img
              alt="Create an issue"
              src="http://example.com/images/illustration.svg"
            />
             
            <h6>
              Create an issue
            </h6>
             
            <p
              class="gl-font-sm gl-text-gray-700"
            >
              Create/import issues (tickets) to collaborate on ideas and plan work.
            </p>
             
            <a
              class="gl-link"
              data-track-action="click_link"
              data-track-label="Create an issue"
              data-track-property="Growth::Activation::Experiment::LearnGitLabB"
              href="http://example.com/"
              rel="noopener noreferrer"
              target="_blank"
            >
              Create an issue
            </a>
          </div>
        </div>
         
        <!---->
      </div>
    </div>
     
    <div
      class="col gl-mb-6"
    >
      <div
        class="gl-card gl-pt-0"
      >
        <!---->
         
        <div
          class="gl-card-body"
        >
          <div
            class="gl-text-right gl-h-5"
          >
            <!---->
          </div>
           
          <div
            class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content"
          >
            <img
              alt="Submit a merge request (MR)"
              src="http://example.com/images/illustration.svg"
            />
             
            <h6>
              Submit a merge request
            </h6>
             
            <p
              class="gl-font-sm gl-text-gray-700"
            >
              Review and edit proposed changes to source code.
            </p>
             
            <a
              class="gl-link"
              data-track-action="click_link"
              data-track-label="Submit a merge request (MR)"
              data-track-property="Growth::Activation::Experiment::LearnGitLabB"
              href="http://example.com/"
              rel="noopener noreferrer"
              target="_blank"
            >
              Submit a merge request (MR)
            </a>
          </div>
        </div>
         
        <!---->
      </div>
    </div>
  </div>
   
  <h2
    class="gl-font-lg gl-mb-3"
  >
    Deploy
  </h2>
   
  <p
    class="gl-text-gray-700 gl-mb-6"
  >
    Use your new GitLab workflow to deploy your application, monitor its health, and keep it secure:
  </p>
   
  <div
    class="row row-cols-2 row-cols-lg-4 g-2 g-lg-3"
  >
    <div
      class="col gl-mb-6"
    >
      <div
        class="gl-card gl-pt-0"
      >
        <!---->
         
        <div
          class="gl-card-body"
        >
          <div
            class="gl-text-right gl-h-5"
          >
            <!---->
          </div>
           
          <div
            class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content"
          >
            <img
              alt="Run a Security scan using CI/CD"
              src="http://example.com/images/illustration.svg"
            />
             
            <h6>
              Run a Security scan using CI/CD
            </h6>
             
            <p
              class="gl-font-sm gl-text-gray-700"
            >
              Scan your code to uncover vulnerabilities before deploying.
            </p>
             
            <a
              class="gl-link"
              data-track-action="click_link"
              data-track-label="Run a Security scan using CI/CD"
              data-track-property="Growth::Activation::Experiment::LearnGitLabB"
              href="http://example.com/"
              rel="noopener noreferrer"
              target="_blank"
            >
              Run a Security scan using CI/CD
            </a>
          </div>
        </div>
         
        <!---->
      </div>
    </div>
  </div>
</div>
`;