[Rebuild theme] Update navigation for new website

themes/docsmith/layouts/_default/baseof.html

@@ -49,7 +49,10 @@
         <script src="https://cdn.jsdelivr.net/npm/instantsearch.js@2.10.0"></script>
         <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/instantsearch.js@2.10.0/dist/instantsearch.min.css">
         <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/instantsearch.js@2.10.0/dist/instantsearch-theme-algolia.min.css">
-        <link href='//fonts.googleapis.com/css?family=Lato:300,400,700,900' rel='stylesheet' type='text/css'>
+        <link
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600"
+          rel="stylesheet"
+        />
         <link rel="canonical" href="{{ .Permalink | safeURL }}">
         {{ range .AlternativeOutputFormats -}}
         <link rel="{{ .Rel }}" type="{{ .MediaType.Type }}" href="{{ .Permalink | safeURL }}">
@@ -66,18 +69,7 @@
       <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-M3XXZX" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
       <!-- End Google Tag Manager (noscript) -->
       {{ end }}
-      <header>
-        {{ partial "nav" . }}
-        {{ if .IsHome }}
-          <div class="container">
-              {{ partial "subnav" . }}
-          </div>
-        {{ else }}
-            <div class="container sub-menu-wrap">
-                {{ partial "subnav" . }}
-            </div>
-        {{ end }}
-      </header>
+      {{ partial "header" . }}
       {{block "main" .}}{{ end }}
       <footer>
         {{ partial "contribute_footer" . }}

themes/docsmith/layouts/partials/header.html

@@ -0,0 +1,56 @@
+<div class="header__wrapper" id="header">
+  <header class="header">
+    <div class="utility-nav__wrapper">
+      {{ partial "navigation/utility_nav" . }}
+    </div>
+    <div class="primary-nav__wrapper">
+      <div class="primary-nav__container">
+        <div class="primary-nav__inner">
+          <div class="logo">
+            <a aria-current="page" class="logo__link" href="https://linode.com">
+              {{ partial "logo" . }}
+            </a>
+          </div>
+          <div>
+            {{ partial "navigation/primary_nav" . }}
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="mobile-menus__wrapper" id="mobile-menus">
+      <form
+        role="search"
+        method="get"
+        class="header-search-form"
+        action="https://linode.com/"
+      >
+        <label class="header-search-form__label">
+          <span class="search-form__placeholder visually-hidden">
+            Search Linode:
+          </span>
+          <input
+            type="search"
+            class="search-form__search-field"
+            placeholder="Search Linode"
+          />
+        </label>
+        <input
+          type="submit"
+          class="search-submit visually-hidden"
+          value="Search"
+        />
+      </form>
+      <div class="primary-mobilenav__wrapper">
+          {{ partial "navigation/primary_mobile_nav" . }}
+      </div>
+      <div class="utility-mobilenav__wrapper">
+          {{ partial "navigation/utility_mobile_nav" . }}
+      </div>
+      <div class="mobile-sign-up">
+        <a href="https://login.linode.com/signup" target="_self" class="mobile-sign-up__button">
+          Sign Up
+        </a>
+      </div>
+    </div>
+  </header>
+</div>

themes/docsmith/layouts/partials/includes_body_end_prod.html

@@ -11,4 +11,4 @@
 <script src="{{ relURL "assets/js/main.js" }}" type="text/javascript"></script>
 <script src="{{ relURL "assets/js/search.js" }}" type="text/javascript"></script>-->
 <script src="{{ relURL "build/js/libs-900db6b09b.min.js" }}" type="text/javascript"></script>
-<script src="{{ relURL "build/js/main-19d66d306e.min.js" }}" type="text/javascript"></script>
+<script src="{{ relURL "build/js/main-c0b0ab634f.min.js" }}" type="text/javascript"></script>

themes/docsmith/layouts/partials/includes_head_prod.html

@@ -1 +1 @@
-<link href="{{ relURL "build/stylesheets/home-863ee60b3e.min.css" }}" rel='stylesheet' type='text/css'>
+<link href="{{ relURL "build/stylesheets/home-8d08e2d825.min.css" }}" rel='stylesheet' type='text/css'>

themes/docsmith/layouts/partials/logo.html

@@ -0,0 +1 @@
+<svg enable-background="new 0 0 575.8 178.3" viewBox="0 0 575.8 178.3"><path d="m148.6 78.9-24.7-13.6-20.8 12.7-.3 13-10.1-6.7-13.8 8.4c-.2-3.9-.4-8.6-.6-14.2l-14.2-9.5c3.9-2 8.4-4.3 13.5-7-.1 0 .1 1.4-2-46.5l-32-15.4-43.6 13.6 9.7 46.9 14.6 11.4-11.1 5.3 7.3 35.3 10.2 9.6-7.3 4.5 5.7 27.3 22.9 24.3c.1-.1 2.4-1.9 29.5-23.5l-.8-18.6 11.7 9.9c.2-.2 2.4-1.9 23.7-18.8l.8-13.7 8.8 6.1c.1-.2 2.1-1.7 19.3-15.3z"/><path d="m128.1 93.5 20.5-14.6-24.7-13.6-20.8 12.7z" fill="#141414"/><path d="m125.8 119.5 2.3-26-25-15.5-.5 25.4z" fill="#004b16"/><path d="m92.6 146-.3-27-25.1-19.1 1.9 26.4z" fill="#004b16"/><path d="m92.3 119 25.5-18.2-25.1-16.5-25.5 15.6z" fill="#141414"/><path d="m52.1 178.2-4.1-27.6-24.6-24.1 5.7 27.4z" fill="#004b16"/><path d="m48 150.6 32.4-23.1-25.1-20.4-31.9 19.4z" fill="#141414"/><path d="m45.9 136.3-5.3-36.4-27.4-22.8 7.3 35.4z" fill="#004b16"/><path d="m40.6 99.9 37.7-21.4-28.2-18.9-36.9 17.5z" fill="#141414"/><path d="m38 82.5-7.3-49.9-30.7-19 9.7 46.9z" fill="#004b16"/><path d="m30.7 32.6 44.9-17.2-32-15.4-43.6 13.6z" fill="#141414"/><g fill="#1cb35c"><path d="m145.2 104.2c-19 15.1-19.4 15.4-19.3 15.4 2.4-27.2 2.2-26 2.3-26 21.8-15.5 20.4-14.6 20.5-14.6z"/><path d="m116.2 127.2c-23.5 18.7-23.8 18.8-23.7 18.8-.2-28.2-.3-27-.2-27 27.1-19.4 25.4-18.2 25.5-18.2z"/><path d="m81.6 154.7c-29.4 23.3-29.6 23.5-29.5 23.5-4.2-28.4-4.1-27.5-4-27.5 34.5-24.6 32.3-23.1 32.4-23.1z"/><path d="m75.6 15.4c2.1 47.9 1.9 46.5 2 46.5-38.8 20.2-39.7 20.6-39.6 20.6-7.5-51-7.4-49.9-7.3-49.9z"/><path d="m78.3 78.5c1.6 36.3 1.4 35.1 1.5 35.1-33.6 22.6-34 22.8-33.9 22.8-5.5-37.4-5.4-36.4-5.3-36.4z"/></g><path d="m191.4 33.6 16.8-4c0 81.8-3.1 93.5 8 97.1-2.6 4.9-7.1 7.4-13.3 7.4-15.3 0-11.5-11.3-11.5-100.5z"/><path d="m233.7 132.7v-58.4h-9.2v-13.8h26.3v72.2zm8.7-100.1c12.9 0 12.9 19.5 0 19.5s-12.9-19.5 0-19.5z"/><path d="m316.8 132.7c0-43.6 1.1-49.6-3.5-55.2-5.8-6.9-20-5-26.1 3v52.2h-16.8v-72.2h12.1l3.1 6.7c9.1-10.8 30.4-10.9 40.6-.4 9.7 10 7.4 20.5 7.4 65.8z"/><path d="m347.2 96.4c0-49.2 69.4-51.1 69.4 0-.1 50.7-69.4 50.8-69.4 0zm17.5 0c0 28.8 22.2 27.7 29.7 17.7 7-9.4 8.8-41.2-12.5-41.2-12.3 0-17.2 11.3-17.2 23.5z"/><path d="m476.4 132.7c0-7.4 1.8-3.4-7.1-.4-10.2 3.5-25.1 2-34.1-7.9-11.1-12.3-12.6-39.5 1.3-54.6 11.4-12.3 28.5-13.1 39.9-7.4v-28.9l16.9-4v103.1zm0-54.9c-8.9-7.1-20.9-4.8-26.8 1.9-8.1 9.1-11.2 40.2 16.2 40.2 2.9 0 9-2.2 10.6-4.4z"/><path d="m574.6 101.8h-51.6c1.2 22.3 29 21.4 38.1 12.2l6.5 12.9c-14 11.3-62.3 15-62.3-29.5.1-54.1 81.3-49 69.3 4.4zm-51-12.7h35.5c-1.2-10.6-7-15.8-17.5-15.8-9.7 0-15.6 5.2-18 15.8z"/></svg>

themes/docsmith/layouts/partials/navigation/col_bottom.html

@@ -0,0 +1,2 @@
+  </ul>
+</div>

themes/docsmith/layouts/partials/navigation/col_top.html

@@ -0,0 +1,7 @@
+<div class="nav__wrapper">
+  <ul
+    id="products-compute"
+    role="menu"
+    class="sub-menu__item sub-menu__item--reg"
+    aria-expanded="false"
+  >

themes/docsmith/layouts/partials/navigation/community_menus.html

@@ -0,0 +1,17 @@
+<div
+  id="js-submenu-community"
+  class="sub-menu visually-hidden visibility-hidden"
+>
+  <div class="sub-menu__container">
+    <div class="sub-menu__col">
+      <div class="sub-menu__content">
+        {{ partial "navigation/community_primary_nav" . }}
+      </div>
+    </div>
+    <div class="sub-menu__col">
+      <div class="sub-menu__content">
+        {{ partial "navigation/community_secondary_nav" . }}
+      </div>
+    </div>
+  </div>
+</div>

themes/docsmith/layouts/partials/navigation/community_primary_nav.html

@@ -0,0 +1,10 @@
+{{ partial "navigation/col_top" . }}
+  {{ $urlPre := "https://linode.com/wp-json/menus/v1/menus" }}
+  {{ $menuItems := getJSON $urlPre "/submenu-community-primary" }}
+  <h6 class="sub-menu__header">Community</h6>
+  {{ if $menuItems }}
+    {{ range $menuItems.items }}
+      <li class="sub-menu__li sub-menu__header-li"><a href="{{ .url }}" class="header__link sub-menu__link sub-menu__header-link">{{ .title }}</a></li>
+    {{ end }}
+  {{ end }}
+{{ partial "navigation/col_bottom" . }}

themes/docsmith/layouts/partials/navigation/community_secondary_nav.html

@@ -0,0 +1,10 @@
+{{ partial "navigation/col_top" . }}
+  {{ $urlPre := "https://linode.com/wp-json/menus/v1/menus" }}
+  {{ $menuItems := getJSON $urlPre "/submenu-community-secondary" }}
+  <h6 class="sub-menu__header">Engage</h6>
+  {{ if $menuItems }}
+    {{ range $menuItems.items }}
+    <li class="sub-menu__li sub-menu__header-li"><a href="{{ .url }}" class="header__link sub-menu__link">{{ .title }}</a></li>
+    {{ end }}
+  {{ end }}
+  {{ partial "navigation/col_bottom" . }}

themes/docsmith/layouts/partials/navigation/primary_mobile_nav.html

@@ -0,0 +1,10 @@
+{{ partial "navigation/col_top" . }}
+  {{ $urlPre := "https://linode.com/wp-json/menus/v1/menus" }}
+  {{ $menuItems := getJSON $urlPre "/submenu-mobile-primary" }}
+  <h6 class="sub-menu__header"></h6>
+  {{ if $menuItems }}
+    {{ range $menuItems.items }}
+      <li class="sub-menu__li sub-menu__header-li"><a href="{{ .url }}" class="header__link sub-menu__header-link mobile__link">{{ .title }}</a></li>
+    {{ end }}
+  {{ end }}
+{{ partial "navigation/col_bottom" . }}

themes/docsmith/layouts/partials/navigation/primary_nav.html

@@ -0,0 +1,8 @@
+<nav id="primary-nav" role="menu" class="primary-nav" aria-expanded="false">
+{{ $urlPre := "https://linode.com/wp-json/menus/v1/menus" }}
+{{ $menuItems := getJSON $urlPre "/header-primary" }}{{ if $menuItems }}{{ range $menuItems.items }}{{ if eq .switch_on "" }}<a href="{{ .url }}" class="header__link primary-nav__link {{ .title | urlize }}" role="menuitem">{{ if (eq .title "Search")}}<span class="header-search-icon"><span class="visually-hidden">{{- .title -}}</span></span>{{ else }}{{- .title -}}{{end}}</a>{{else }}{{ if (eq .title "Mobile")}}<a href="#" class="header__link primary-nav__link dropdown mobile" data-submenu="js-tab-mobile-menu-item-mobile"><span class="header-mobile-icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z" /></svg><svg xmlns="http://www.w3.org/2000/svg" class="close" viewBox="0 0 320 512" style="position: relative; display: none"><path d="M193.94 256L296.5 153.44l21.15-21.15c3.12-3.12 3.12-8.19 0-11.31l-22.63-22.63c-3.12-3.12-8.19-3.12-11.31 0L160 222.06 36.29 98.34c-3.12-3.12-8.19-3.12-11.31 0L2.34 120.97c-3.12 3.12-3.12 8.19 0 11.31L126.06 256 2.34 379.71c-3.12 3.12-3.12 8.19 0 11.31l22.63 22.63c3.12 3.12 8.19 3.12 11.31 0L160 289.94 262.56 392.5l21.15 21.15c3.12 3.12 8.19 3.12 11.31 0l22.63-22.63c3.12-3.12 3.12-8.19 0-11.31L193.94 256z" /></svg><span class="visually-hidden">Menu</span></span></a>{{else}}<a href="#" class="header__link primary-nav__link dropdown" role="menuitem" data-submenu="{{ strings.TrimLeft "." .switch_on | urlize }}">{{- .title -}}</a><span class="primary-nav__caret"><svg aria-hidden="true" data-prefix="far" data-icon="angle-down" role="img" viewBox="0 0 320 512" class="svg-inline--fa fa-angle-down fa-w-10 fa-7x"><path fill="currentColor" d="M151.5 347.8L3.5 201c-4.7-4.7-4.7-12.3 0-17l19.8-19.8c4.7-4.7 12.3-4.7 17 0L160 282.7l119.7-118.5c4.7-4.7 12.3-4.7 17 0l19.8 19.8c4.7 4.7 4.7 12.3 0 17l-148 146.8c-4.7 4.7-12.3 4.7-17 0z" class=""></path></svg></span>{{ end }}{{ end }}{{ end }}{{ end }}</nav>
+<div id="sub-menus">
+{{ partial "navigation/why_menus" . }}
+{{ partial "navigation/products_menus" . }}
+{{ partial "navigation/community_menus" . }}
+</div>

themes/docsmith/layouts/partials/navigation/products_compute_nav.html

@@ -0,0 +1,10 @@
+{{ partial "navigation/col_top" . }}
+  {{ $urlPre := "https://linode.com/wp-json/menus/v1/menus" }}
+  {{ $menuItems := getJSON $urlPre "/submenu-products-compute" }}
+  <h6 class="sub-menu__header">Compute</h6>
+  {{ if $menuItems }}
+    {{ range $menuItems.items }}
+      <li class="sub-menu__li sub-menu__header-li"><a href="{{ .url }}" class="header__link sub-menu__link">{{ .title }}</a></li>
+    {{ end }}
+  {{ end }}
+{{ partial "navigation/col_bottom" . }}

themes/docsmith/layouts/partials/navigation/products_devtools_nav.html

@@ -0,0 +1,10 @@
+{{ partial "navigation/col_top" . }}
+  {{ $urlPre := "https://linode.com/wp-json/menus/v1/menus" }}
+  {{ $menuItems := getJSON $urlPre "/submenu-products-developer-tools" }}
+  <h6 class="sub-menu__header">Developer Tools</h6>
+  {{ if $menuItems }}
+    {{ range $menuItems.items }}
+    <li class="sub-menu__li sub-menu__header-li"><a href="{{ .url }}" class="header__link sub-menu__link">{{ .title }}</a></li>
+    {{ end }}
+  {{ end }}
+{{ partial "navigation/col_bottom" . }}

themes/docsmith/layouts/partials/navigation/products_featured_nav.html

@@ -0,0 +1,10 @@
+{{ partial "navigation/col_top" . }}
+  {{ $urlPre := "https://linode.com/wp-json/menus/v1/menus" }}
+  {{ $menuItems := getJSON $urlPre "/submenu-products-featured" }}
+  <h6 class="sub-menu__header">Featured</h6>
+  {{ if $menuItems }}
+    {{ range $menuItems.items }}
+       <li class="sub-menu__li sub-menu__header-li"><a href="{{ .url }}" class="header__link sub-menu__link sub-menu__header-link sub-menu__header-link--w-icon" role="menuitem"><img src="{{ .icon }}" class="sub-menu__icon" alt="{{ .title }}" /><span class="sub-menu__body"><span class="sub-menu__title">{{ .title }}</span><span class="sub-menu__description">{{ .description }}</span></span></a></li>
+    {{ end }}
+  {{ end }}
+{{ partial "navigation/col_bottom" . }}

themes/docsmith/layouts/partials/navigation/products_menus.html

@@ -0,0 +1,36 @@
+<div
+  id="js-submenu-products"
+  class="sub-menu visually-hidden visibility-hidden"
+>
+  <div class="sub-menu__container">
+    <div class="sub-menu__col">
+      <div class="sub-menu__content">
+        {{ partial "navigation/products_featured_nav" . }}
+      </div>
+    </div>
+    <div class="sub-menu__col">
+      <div class="sub-menu__content">
+        {{ partial "navigation/products_compute_nav" . }} 
+        {{ partial "navigation/products_storage_nav" . }}
+        {{ partial "navigation/products_services_nav" . }}
+      </div>
+    </div>
+    <div class="sub-menu__col">
+      <div class="sub-menu__content">
+        {{ partial "navigation/products_networking_nav" . }}
+        {{ partial "navigation/products_devtools_nav" . }}
+      </div>
+    </div>
+    <div class="all-products-link">
+      <a
+        href="https://linode.com/products/"
+        class="header__link primary-nav__link"
+      >
+        View All Products
+        <span class="all-products-link__caret">
+          <svg aria-hidden="true" data-prefix="far" data-icon="angle-down" role="img" viewBox="0 0 320 512" class="svg-inline--fa fa-angle-down fa-w-10 fa-7x"><path fill="currentColor" d="M151.5 347.8L3.5 201c-4.7-4.7-4.7-12.3 0-17l19.8-19.8c4.7-4.7 12.3-4.7 17 0L160 282.7l119.7-118.5c4.7-4.7 12.3-4.7 17 0l19.8 19.8c4.7 4.7 4.7 12.3 0 17l-148 146.8c-4.7 4.7-12.3 4.7-17 0z" class=""></path></svg>
+        </span>
+      </a>
+    </div>
+  </div>
+</div>

themes/docsmith/layouts/partials/navigation/products_networking_nav.html

@@ -0,0 +1,10 @@
+{{ partial "navigation/col_top" . }}
+  {{ $urlPre := "https://linode.com/wp-json/menus/v1/menus" }}
+  {{ $menuItems := getJSON $urlPre "/submenu-products-networking" }}
+  <h6 class="sub-menu__header">Networking</h6>
+  {{ if $menuItems }}
+    {{ range $menuItems.items }}
+    <li class="sub-menu__li sub-menu__header-li"><a href="{{ .url }}" class="header__link sub-menu__link">{{ .title }}</a></li>
+    {{ end }}
+  {{ end }}
+{{ partial "navigation/col_bottom" . }}

themes/docsmith/layouts/partials/navigation/products_services_nav.html

@@ -0,0 +1,10 @@
+{{ partial "navigation/col_top" . }}
+  {{ $urlPre := "https://linode.com/wp-json/menus/v1/menus" }}
+  {{ $menuItems := getJSON $urlPre "/submenu-products-services" }}
+  <h6 class="sub-menu__header">Services</h6>
+  {{ if $menuItems }}
+    {{ range $menuItems.items }}
+    <li class="sub-menu__li sub-menu__header-li"><a href="{{ .url }}" class="header__link sub-menu__link">{{ .title }}</a></li>
+    {{ end }}
+  {{ end }}
+{{ partial "navigation/col_bottom" . }}

themes/docsmith/layouts/partials/navigation/products_storage_nav.html

@@ -0,0 +1,10 @@
+{{ partial "navigation/col_top" . }}
+  {{ $urlPre := "https://linode.com/wp-json/menus/v1/menus" }}
+  {{ $menuItems := getJSON $urlPre "/submenu-products-storage" }}
+  <h6 class="sub-menu__header">Storage</h6>
+  {{ if $menuItems }}
+    {{ range $menuItems.items }}
+      <li class="sub-menu__li sub-menu__header-li"><a href="{{ .url }}" class="header__link sub-menu__link">{{ .title }}</a></li>
+    {{ end }}
+  {{ end }}
+{{ partial "navigation/col_bottom" . }}