Refactored and cleaned up partials

material/partials/tabs-item.html

@@ -1,13 +1,25 @@
 {% if nav_item.is_homepage %}
   <li class="md-tabs__item">
-    <a href="{{ nav_item.url }}" title="{{ nav_item.title }}" class="md-tabs__link {% for nav_item_ in nav %} {% if nav_item_.url == page.url %} md-tabs__link--active {% endif %} {% endfor %}">
+    {% if not page.ancestors | length and nav | selectattr("url", page.url) %}
+      <a href="{{ nav_item.url }}" title="{{ nav_item.title }}" class="md-tabs__link md-tabs__link--active">
         {{ nav_item.title }}
       </a>
+    {% else %}
+      <a href="{{ nav_item.url }}" title="{{ nav_item.title }}" class="md-tabs__link">
+        {{ nav_item.title }}
+      </a>
+    {% endif %}
   </li>
 {% elif nav_item.children and nav_item.children | length > 0 %}
   <li class="md-tabs__item">
-    <a href="{{ (nav_item.children | first).url }}" title="{{ nav_item.title }}" class="md-tabs__link {% if nav_item.active %} md-tabs__link--active {% endif %}">
+    {% if nav_item.active %}
+      <a href="{{ (nav_item.children | first).url }}" title="{{ nav_item.title }}" class="md-tabs__link md-tabs__link--active">
         {{ nav_item.title }}
       </a>
+    {% else %}
+      <a href="{{ (nav_item.children | first).url }}" title="{{ nav_item.title }}" class="md-tabs__link">
+        {{ nav_item.title }}
+      </a>
+    {% endif %}
   </li>
 {% endif %}

material/partials/tabs.html

@@ -1,4 +1,8 @@
-<nav class="md-tabs {% if page.ancestors | length > 0 %} md-tabs--active {% endif %}" data-md-component="tabs">
+{% set class = "md-tabs" %}
+{% if page.ancestors | length > 0 %}
+  {% set class = "md-tabs md-tabs--active" %}
+{% endif %}
+<nav class="{{ class }}" data-md-component="tabs">
   <div class="md-tabs__inner md-grid">
     <ul class="md-tabs__list">
       {% for nav_item in nav %}

src/partials/nav.html

@@ -22,6 +22,8 @@
 
 <!-- Main navigation -->
 <nav class="md-nav md-nav--primary" data-md-level="0">
+
+  <!-- Site title -->
   <label class="md-nav__title md-nav__title--site" for="drawer">
     {% if config.extra.logo %}
       <i class="md-logo md-nav__button">
@@ -32,11 +34,15 @@
     {% endif %}
     {{ config.site_name }}
   </label>
+
+  <!-- Repository containing source -->
   {% if config.repo_url %}
     <div class="md-nav__source">
       {% include "partials/source.html" %}
     </div>
   {% endif %}
+
+  <!-- Render item list -->
   <ul class="md-nav__list" data-md-scrollfix>
     {% for nav_item in nav %}
       {% set path = "nav-" + loop.index | string %}

src/partials/tabs-item.html

@@ -23,26 +23,33 @@
 <!-- Home page -->
 {% if nav_item.is_homepage %}
   <li class="md-tabs__item">
+    {% if not page.ancestors | length and nav | selectattr("url", page.url) %}
       <a href="{{ nav_item.url }}" title="{{ nav_item.title }}"
-        class="md-tabs__link
-          {% for nav_item_ in nav %}
-            {% if nav_item_.url == page.url %}
-              md-tabs__link--active
-            {% endif %}
-          {% endfor %}">
+          class="md-tabs__link md-tabs__link--active">
         {{ nav_item.title }}
       </a>
+    {% else %}
+      <a href="{{ nav_item.url }}" title="{{ nav_item.title }}"
+          class="md-tabs__link">
+        {{ nav_item.title }}
+      </a>
+    {% endif %}
   </li>
 
 <!-- Main navigation item with nested items -->
 {% elif nav_item.children and nav_item.children | length > 0 %}
   <li class="md-tabs__item">
-    <a href="{{ (nav_item.children | first).url }}"
-        title="{{ nav_item.title }}" class="md-tabs__link
     {% if nav_item.active %}
-            md-tabs__link--active
-          {% endif %}">
+      <a href="{{ (nav_item.children | first).url }}"
+          title="{{ nav_item.title }}"
+          class="md-tabs__link md-tabs__link--active">
         {{ nav_item.title }}
       </a>
+    {% else %}
+      <a href="{{ (nav_item.children | first).url }}"
+          title="{{ nav_item.title }}" class="md-tabs__link">
+        {{ nav_item.title }}
+      </a>
+    {% endif %}
   </li>
 {% endif %}

src/partials/tabs.html

@@ -20,12 +20,14 @@
   IN THE SOFTWARE.
 -->
 
-<!-- Tabs with outline (level denotes the active level) -->
-<nav class="md-tabs
-      {% if page.ancestors | length > 0 %}
-        md-tabs--active
-      {% endif %}"
-    data-md-component="tabs">
+<!-- Determine class according to level -->
+{% set class = "md-tabs" %}
+{% if page.ancestors | length > 0 %}
+  {% set class = "md-tabs md-tabs--active" %}
+{% endif %}
+
+<!-- Tabs with outline -->
+<nav class="{{ class }}" data-md-component="tabs">
   <div class="md-tabs__inner md-grid">
     <ul class="md-tabs__list">
       {% for nav_item in nav %}