<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Meta, title, CSS, favicons, etc. -->
    {% include header.html %}
  </head>
  <body class="bs-docs">
    <a class="sr-only sr-only-focusable" href="#content">Skip to main content</a>

    {% include nav/docs.html %}

    <div class="bs-docs-header" id="content">
      <div class="bs-docs-container">
        {% if page.url contains "getting-started" %}
          <h1>Getting started</h1>
          <p class="lead">Learn how to quickly start a new project with Bootstrap with downloads, basic templates and examples, and more.</p>
        {% elsif page.url contains "components" %}
          <h1>Components</h1>
          <p class="lead">
            Global styles for common HTML elements, as well as dozens of reusable components like dropdowns, input groups, navigation, alerts, and much more.
          </p>
        {% elsif page.url contains "examples" %}
          <h1>Examples</h1>
          <p class="lead">Examples.</p>
        {% endif %}

        {% include ads.html %}
      </div>
    </div>

    <div class="bs-docs-container bs-docs-content">
      {{ content }}
    </div>

    {% include footer.html %}
  </body>
</html>
