_layouts/mobile.html

<!DOCTYPE html>
<html lang="en">
  {% include head.html %}
  <body class="{{ page.body-class }}">
    {% include tag_manager_script.html %}
    {% include header.html %}

    <div class="main-background {{ page.background-class }}"></div>

    {% assign mobile_items = site.mobile | where: "published",true | sort: "order" %}

    <div class="jumbotron jumbotron-fluid on-dark-background">
      <div class="container">
        <h1>PyTorch Mobile</h1>

        <p class="lead">End-to-end workflow from Training to Deployment for iOS and Android mobile devices</p>
      </div>
    </div>

    <div class="main-content-wrapper">
      <div class="main-content">
        <div class="container-fluid nav-menu-wrapper">
          <div class="container">
            <nav class="navbar navbar-expand-lg navbar-light main-content-menu">
              <ul class="navbar-nav">
                {% for item in mobile_items %}
                  <li class="nav-item nav-select">
                    <a class="nav-link" data-id="{{ item.slug }}" href="{{ site.baseurl }}{{ item.permalink }}">{{ item.title }}</a>
                  </li>
                {% endfor %}
              </ul>
            </nav>
          </div>
        </div>

        <div class="container">
          <div class="row">
            <div class="col-md-3">
              {% include mobile_page_side_nav.html %}
            </div>
            <div class="col-md-8 offset-md-1">
              <div class="article-wrapper" data-id="{{ item.slug }}">
                <article class="pytorch-article">
                  {{ content }}
                </article>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

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

<script src="{{ site.baseurl }}/assets/mobile-page-sidebar.js"></script>