rawfeed 0.1.4 → 0.2.0

data/_includes/layout/header.html

@@ -6,138 +6,164 @@
   {%- if item.scope.path == "_posts" -%}
     {%- assign blog_page = item.values.published -%}
   {%- endif -%}
+  {%- if item.scope.path == "_pixels" -%}
+    {%- assign pixels_page = item.values.published -%}
+  {%- endif -%}
 {%- endfor -%}
 
+{%- assign menu_separator = default_.separator -%}
+
+<!-- modal avatar -->
 <div class="modal fade" id="avatarModal" tabindex="-1" aria-hidden="true">
   <div class="modal-dialog modal-dialog-centered">
     <div class="modal-content bg-transparent border-0 shadow-none">
       <div class="modal-body d-flex justify-content-center">
-        <img id="modalAvatar" class="avatar-img" src="" alt="">
+        <img id="modalAvatar" class="avatar-img{% if default_.rounding %} rounding{% endif %}" src="" alt="">
       </div>
     </div>
   </div>
 </div>
+<!-- modal avatar -->
 
-<header class="container header">
-  <div class="header-wrapper">
-    <div class="row ">
-      <div class="col-sm-2 d-flex flex-column justify-content-end">
-        <div class="container">
-          <div class="row">
-            {%- if index.layout == "blog" -%}
-              <span>[&nbsp;<a class="{% if page.url == "/" or page.url == "/index.html" %}menu-active{% endif %}" href="{{home_url}}">{{ site.strings.menu.blog.title | default: "blog" | downcase }}</a>&nbsp;]</span>
-            {%- else -%}
-              <span>[&nbsp;{{site.strings.menu.home.emoji}}<a class="{% if page.url == "/" or page.url == "/index.html" %}menu-active{% endif %}" href="{{home_url}}">{{ site.strings.menu.home.title | default: "home" | downcase }}</a>&nbsp;]</span>
-            {%- endif -%}
-          </div>
-        </div>
-      </div>
-      <div class="col-sm-8 d-flex flex-column justify-content-end">
-        <div class="container">
-        <div class="row">
-          <span class="title">{{ site.title | default: theme_name }}</span>
-        </div>
-        <div class="row">
-          <small class="description">
-            {{ site.description | default: "A raw Jekyll theme for minimalists" }}
-          </small>
-        </div>
-        </div>
-      </div>
-      <div class="col-sm-2 d-flex justify-content-end avatar">
-        {%- assign images_ = site.static_files | map: "path" -%}
-        {%- assign avatar_path_light = "/assets/images/" | append: site.avatar.image.front.light -%}
-        {%- assign avatar_path_dark = "/assets/images/" | append: site.avatar.image.front.dark -%}
-        {%- assign avatar_path_back = "/assets/images/" | append: site.avatar.image.back -%}
-
-        {%- if images_ contains avatar_path_light and images_ contains avatar_path_dark and images_ contains avatar_path_back -%}
-          <div class="avatar-wrapper">
-
-            <div class="avatar-flipper light-theme {% if site.avatar.open %}avatar-flipper__open-true{% endif %}{% if site.avatar.flip %} can-flip{% endif %}">
-              <div class="avatar-card">
-                <div class="avatar-front">
-                  <img id="avatarImgLight" class="avatar-img" src="{{ avatar_path_light | relative_url }}" alt="{{ site.title }}">
-                </div>
-                <div class="avatar-back">
-                  <img class="avatar-img" src="{{ avatar_path_back | relative_url }}" alt="{{ site.title }}">
-                </div>
+<header class="header" style="max-width: {{ header_.width | default: "860" }}px !important; font-family: {{ default_.font.style }} !important; font-size: {{ default_.font.size }} !important; letter-spacing:{{ default_.font.spacing }} !important;">
+  <div class="row ">
+
+    <!-- column home -->
+    <div class="col-sm-3 d-flex flex-column justify-content-end header__column-home">
+      {%- if index.layout == "blog" -%}
+        <span>[{{ header_.menu.home.emoji | with_class: "spacer" }}<a class="{% if page.url == "/" or page.url == "/index.html" %}menu-active{% endif %}" href="{{home_url}}">{{ header_.menu.blog.title | default: "blog" | downcase }}</a>&nbsp;]</span>
+      {%- else -%}
+        <span>[{{ header_.menu.home.emoji | with_class: "spacer" }}<a class="{% if page.url == "/" or page.url == "/index.html" %}menu-active{% endif %}" href="{{home_url}}">{{ header_.menu.home.title | default: "home" | downcase }}</a>&nbsp;]</span>
+      {%- endif -%}
+    </div>
+    <!-- column home -->
+
+    <!-- column description -->
+    <div class="col-sm-6 d-flex flex-column justify-content-end">
+      <span class="title">{{ header_.title | default: theme_name }}</span>
+      <small class="description">
+        {{ header_.description | default: "A raw Jekyll theme for minimalists" }}
+      </small>
+    </div>
+    <!-- column description -->
+
+    <!-- column avatar -->
+    <div class="col-sm-3 d-flex justify-content-end avatar">
+      {%- assign images_ = site.static_files | map: "path" -%}
+      {%- assign avatar_path_light = "/assets/images/" | append: header_.avatar.image.front.light -%}
+      {%- assign avatar_path_dark = "/assets/images/" | append: header_.avatar.image.front.dark -%}
+      {%- assign avatar_path_back = "/assets/images/" | append: header_.avatar.image.back -%}
+
+      {%- if images_ contains avatar_path_light and images_ contains avatar_path_dark and images_ contains avatar_path_back -%}
+        <div class="avatar-wrapper">
+
+          <div class="avatar-flipper light-theme {% if header_.avatar.open %}avatar-flipper__open-true{% endif %}{% if header_.avatar.flip %} can-flip{% endif %}">
+            <div class="avatar-card">
+              <div class="avatar-front">
+                <img id="avatarImgLight" class="avatar-img{% if default_.rounding %} rounding{% endif %}" src="{{ avatar_path_light | relative_url }}" alt="{{ site_title }}">
+              </div>
+              <div class="avatar-back">
+                <img class="avatar-img{% if default_.rounding %} rounding{% endif %}" src="{{ avatar_path_back | relative_url }}" alt="{{ site_title }}">
               </div>
             </div>
+          </div>
 
-            <div class="avatar-flipper dark-theme {% if site.avatar.open %} avatar-flipper__open-true{% endif %}{% if site.avatar.flip %} can-flip{% endif %}">
-              <div class="avatar-card">
-                <div class="avatar-front">
-                  <img id="avatarImgDark" class="avatar-img" src="{{ avatar_path_dark | relative_url }}" alt="{{ site.title }}">
-                </div>
-                <div class="avatar-back">
-                  <img class="avatar-img" src="{{ avatar_path_back | relative_url }}" alt="{{ site.title }}">
-                </div>
+          <div class="avatar-flipper dark-theme {% if header_.avatar.open %} avatar-flipper__open-true{% endif %}{% if header_.avatar.flip %} can-flip{% endif %}">
+            <div class="avatar-card">
+              <div class="avatar-front">
+                <img id="avatarImgDark" class="avatar-img{% if default_.rounding %} rounding{% endif %}" src="{{ avatar_path_dark | relative_url }}" alt="{{ site_title }}">
+              </div>
+              <div class="avatar-back">
+                <img class="avatar-img{% if default_.rounding %} rounding{% endif %}" src="{{ avatar_path_back | relative_url }}" alt="{{ site_title }}">
               </div>
             </div>
-
           </div>
-        {%- endif -%}
-      </div>
+
+        </div>
+      {%- endif -%}
     </div>
+    <!-- column avatar -->
 
-    <div class="menu-separator"></div>
+  </div>
+
+  <!-- row separator -->
+  <div class="row ">
+    <div class="col-sm d-flex justify-content-center">
+      <div class="line-separator"></div>
+    </div>
+  </div>
+  <!-- row separator -->
 
-    <div class="row">
-      <div class="col-sm d-flex justify-content-center column-bottom">
+  <!-- row menu -->
+  <div class="row">
+    <div class="col-sm d-flex justify-content-center menu">
       {%- if index.layout == "blog" -%}
-        <span class="blog-menu">menu&nbsp;»
-          &nbsp;{{site.strings.menu.search.emoji}}{%- if site.blog.search.enable -%}<a id="blog-search__btn" class="blog-menu__link" href="{{search_url}}">{{ site.strings.menu.search.title | default: "search" }}</a><strong>&nbsp;.&nbsp;</strong>{%- endif -%}<a class="blog-menu__link{% if page.url == "/blog/tags/" or page.url == "/blog/tags/index.html" %} menu-active{% endif %}" href="{{tags_url}}">{{ site.strings.menu.tags.title | default: "tags" }}</a><strong>&nbsp;.&nbsp;</strong>
-        </span>
-        {% assign sorted_pages = site.pages | sort: 'order' %}
-          {%- for item in sorted_pages -%}
-            {%- if item.path contains '_pages/' and item.published != false -%}
-              {%- unless item.url contains "/tags/" or item.url contains "404.html" -%}
-                <a class="{% if page.url == item.url %}menu-active{% endif %}" href="{{ item.url | relative_url }}">{{ item.title | downcase }}</a><strong>&nbsp;.&nbsp;</strong>
-              {%- endunless -%}
-            {%- endif -%}
-          {%- endfor -%}
-          <a class="blog-menu__link" href="{{feed_url}}">{{ site.strings.menu.feed | default: "feed" }}</a><strong>&nbsp;.&nbsp;</strong>
-      {%- else index.layout == "home" -%}
-        {%- if page.url contains "/blog/" -%}
-          <span class="blog-menu">{{ site.strings.menu.blog.title }}&nbsp;»
-            <a class="blog-menu__link{% if page.url == "/blog/" or page.url == "/blog/index.html" or page.url contains "/blog/page/" %} menu-active{% endif %}" href="{{blog_url}}">{{site.strings.menu.blog.emoji}}{{site.strings.menu.blog.subtitle}}</a><strong>&nbsp;.&nbsp;</strong>{%- if site.blog.search.enable -%}{{site.strings.menu.search.emoji}}<a id="blog-search__btn" class="blog-menu__link" href="{{search_url}}">{{ site.strings.menu.search.text | default: "search" }}</a><strong>&nbsp;.&nbsp;</strong>{%- endif -%}{{site.strings.menu.tags.emoji}}<a class="blog-menu__link{% if page.url == "/blog/tags/" or page.url == "/blog/tags/index.html" %} menu-active{% endif %}" href="{{tags_url}}">{{ site.strings.menu.tags.text | default: "tags" }}</a><strong>&nbsp;.&nbsp;</strong>{{site.strings.menu.feed.emoji}}<a class="blog-menu__link" href="{{feed_url}}">{{ site.strings.menu.feed.title | default: "feed" }}</a><strong>&nbsp;.&nbsp;</strong>
-          </span>
-        {%- else -%}
-          {%- assign published_pages = site.pages | where_exp:"p","p.path contains '_pages/' and p.published" -%}
-          {%- if published_pages.size > 0 -%}
-            <span class="blog-menu">menu&nbsp;»</span>&nbsp;
-          {%- endif -%}
-          {%- if site.pagination.enabled == true -%}
-            {%- if blog_page -%}
-              {{ site.strings.menu.blog.emoji }}<a href="{{blog_url}}">{{ site.strings.menu.blog.title }}</a><strong>&nbsp;.&nbsp;</strong>
-            {%- endif -%}
-            {% assign sorted_pages = site.pages | sort: 'order' %}
-            {%- for item in sorted_pages -%}
-              {%- if item.path contains '_pages/' and item.in_menu -%}
-                {%- unless item.url contains "blog" or item.url contains "404.html" -%}
-                  {{ item.emoji }}<a class="{% if page.url == item.url %}menu-active{% endif %}" href="{{ item.url | relative_url }}">{{ item.title | downcase }}</a><strong>&nbsp;.&nbsp;</strong>
-                {%- endunless -%}
-              {%- endif -%}
-            {%- endfor -%}
-          {%- else -%}
-            {% assign sorted_pages = site.pages | sort: 'order' %}
+        <div>
+          {{ header_.menu.title }}&nbsp;»&nbsp;<div class="menu-wrap-link">{{ header_.menu.blog.search.emoji | with_class: "spacer" }}{%- if blog_.search.enable -%}<a id="blog-search__btn" href="{{search_url}}">{{ header_.menu.blog.search.title | default: "search" }}</a><strong class="separator">{{menu_separator}}</strong>{%- endif -%}</div><div class="menu-wrap-link">{{ header_.menu.blog.tags.emoji | with_class: "spacer" }}<a class="{% if page.url == "/blog/tags/" or page.url == "/blog/tags/index.html" %} menu-active{% endif %}" href="{{tags_url}}">{{ header_.menu.blog.tags.title | default: "tags" }}</a><strong class="separator">{{menu_separator}}</strong></div>
+          {%- assign sorted_pages = site.pages | sort: 'order' -%}
             {%- for item in sorted_pages -%}
               {%- if item.path contains '_pages/' and item.published != false and item.in_menu -%}
                 {%- unless item.url contains "/tags/" or item.url contains "404.html" -%}
-                  {{ item.emoji }}<a class="{% if page.url == item.url %}menu-active{% endif %}" href="{{ item.url | relative_url }}">{{ item.title | downcase }}</a><strong>&nbsp;.&nbsp;</strong>
+                  <div class="menu-wrap-link">{{ item.emoji | with_class: "spacer" }}<a class="{% if page.url == item.url %}menu-active{% endif %}" href="{{ item.url | relative_url }}">{{ item.title | downcase }}</a><strong class="separator">{{menu_separator}}</strong></div>
                 {%- endunless -%}
               {%- endif -%}
             {%- endfor -%}
-          {%- endif -%}
+            <div class="menu-wrap-link">{{ header_.menu.blog.feed.emoji | with_class: "spacer" }}<a href="{{feed_url}}">{{ header_.menu.blog.feed.title | default: "feed" }}</a><strong class="separator">{{menu_separator}}</strong></div>
+        </div>
+      {%- else index.layout == "home" -%}
+        {%- if page.url contains "/blog/" -%}
+          <div>
+          {{ header_.menu.blog.title | replace: "/", "" | replace: "ls ", "" }}&nbsp;»
+            <div class="menu-wrap-link">{{ header_.menu.blog.emoji | with_class: "spacer" }}<a class="{% if page.url == "/blog/" or page.url == "/blog/index.html" or page.url contains "/blog/page/" %} menu-active{% endif %}" href="{{blog_url}}">{{ header_.menu.blog.subtitle }}</a><strong class="separator">{{menu_separator}}</strong></div>{%- if blog_.search.enable -%}<span style="display: inline-block;">{{ header_.menu.blog.search.emoji | with_class: "spacer" }}<a id="blog-search__btn" href="{{search_url}}">{{ header_.menu.blog.search.title | default: "search" }}</a><strong class="separator">{{menu_separator}}</strong></span>{%- endif -%}<div class="menu-wrap-link">{{ header_.menu.blog.tags.emoji | with_class: "spacer" }}<a class="{% if page.url == "/blog/tags/" or page.url == "/blog/tags/index.html" %} menu-active{% endif %}" href="{{tags_url}}">{{ header_.menu.blog.tags.title | default: "tags" }}</a><strong class="separator">{{menu_separator}}</strong></div><div class="menu-wrap-link">{{ header_.menu.blog.feed.emoji | with_class: "spacer" }}<a href="{{feed_url}}">{{ header_.menu.blog.feed.title | default: "feed" }}</a><strong class="separator">{{menu_separator}}</strong></div>
+          </div>
+        {%- else -%}
+          <div>
+            {%- assign published_pages = site.pages | where_exp:"p","p.path contains '_pages/' and p.published" -%}
+            {%- if published_pages.size > 0 -%}
+              <span>{{ header_.menu.title }}&nbsp;»</span>&nbsp;
+            {%- endif -%}
+            {%- if site.pagination.enabled == true -%}
+              {%- if blog_page -%}
+              <div class="menu-wrap-link">{{ header_.menu.blog.emoji | with_class: "spacer" }}<a href="{{blog_url}}">{{ header_.menu.blog.title |  replace: "ls ", "" }}</a><strong class="separator">{{menu_separator}}</strong></div>
+              {%- endif -%}
+              {%- if pixels_page -%}
+              <div class="menu-wrap-link">{{ header_.menu.pixels.emoji | with_class: "spacer" }}<a href="{{pixels_url}}">{{ header_.menu.pixels.title }}</a><strong class="separator">{{menu_separator}}</strong></div>
+              {%- endif -%}{% assign sorted_pages = site.pages | sort: 'order' %}
+              {%- for item in sorted_pages -%}
+                {%- if item.path contains '_pages/' and item.in_menu -%}
+                  {%- unless item.url contains "blog" or item.url contains "404.html" -%}
+                    <div class="menu-wrap-link">{{ item.emoji | with_class: "spacer" }}<a class="{% if page.url == item.url %}menu-active{% endif %}" href="{{ item.url | relative_url }}">{{ item.title | downcase }}</a><strong class="separator">{{menu_separator}}</strong></div>
+                  {%- endunless -%}
+                {%- endif -%}
+              {%- endfor -%}
+            {%- else -%}
+              {%- if blog_page -%}
+                <div class="menu-wrap-link">{{ header_.menu.blog.emoji | with_class: "spacer" }}<a href="{{blog_url}}">{{ header_.menu.blog.title | replace: "/", "" }}</a><strong class="separator">{{menu_separator}}</strong></div>
+              {%- endif -%}
+              {%- if pixels_page -%}
+              <div class="menu-wrap-link">{{ header_.menu.pixels.emoji | with_class: "spacer" }}<a href="{{pixels_url}}">pixels</a><strong class="separator">{{menu_separator}}</strong></div>
+              {%- endif -%}{% assign sorted_pages = site.pages | sort: 'order' %}
+              {%- for item in sorted_pages -%}
+                {%- if item.path contains '_pages/' and item.published != false and item.in_menu -%}
+                  {%- unless item.url contains "/tags/" or item.url contains "404.html" -%}
+                    <div class="menu-wrap-link">{{ item.emoji | with_class: "spacer" }}<a class="{% if page.url == item.url %}menu-active{% endif %}" href="{{ item.url | relative_url }}">{{ item.title | downcase }}</a><strong class="separator">{{menu_separator}}</strong></div>
+                  {%- endunless -%}
+                {%- endif -%}
+              {%- endfor -%}
+            {%- endif -%}
+          </div>
         {%- endif -%}
       {%- endif -%}
-      </div>
     </div>
+  </div>
+  <!-- row menu -->
 
-    <div class="row justify-content-end">
-      <div class="col-sm-2 d-flex justify-content-end">
-        <span id="toggle-theme"><i class="fa-solid fa-moon"></i></span>
-      </div>
+  <!-- row button light/dark -->
+  <div class="row justify-content-end">
+    <div class="col-sm-2 d-flex justify-content-end">
+      <span id="toggle-theme"><i class="fa-solid fa-moon"></i></span>
     </div>
   </div>
+  <!-- row button light/dark -->
+
 </header>

data/_includes/layout/maintenance.html

@@ -1,27 +1,23 @@
 {% include layout/data.liquid %}
 
 <!DOCTYPE html>
-<html lang="{{ site.lang | default: 'en' }}">
+<html lang="{{ default_.lang | default: 'en-US' }}" data-theme="light">
   {%- include layout/head.html -%}
   <body>
-    <div class="mt-4 maintenance">
+    <div class="mt-4 maintenance" style="font-family: {{ default_.font.style }} !important; font-size: {{ default_.font.size }} !important; letter-spacing:{{ default_.font.spacing }} !important;">
       <div class="container">
-        {%- if site.maintenance.gif != "" -%}
+        {%- if maintenance_.gif != "" -%}
         <div class="row">
           <div class="col-sm text-center">
-            {%- if site.maintenance.gif == "local" -%}
-              <img class="maintenance-gif" src="{{ '/assets/gifs/under_maintenance.gif' | relative_url }}" alt="under maintenance">
-            {%- else -%}
-              <img class="maintenance-gif" src="{{ site.maintenance.gif }}" alt="under maintenance">
-            {%- endif -%}
+            <img class="maintenance-gif" src="{{ maintenance_.gif | relative_url }}" alt="under maintenance">
           </div>
         </div>
         {%- endif -%}
         <div class="row mt-5 text-center">
-          <h1 class="maintenance-title">[&nbsp;{{ site.maintenance.title }}&nbsp;]</h1>
+          <h1 class="maintenance-title">[&nbsp;{{ maintenance_.title }}&nbsp;]</h1>
         </div>
         <div class="row text-center">
-          <h3 class="maintenance-subtitle">{{ site.maintenance.subtitle }}</h3>
+          <h3 class="maintenance-subtitle">{{ maintenance_.subtitle | markdownify }}</h3>
         </div>
       </div>
     </div>

data/_includes/layout/paginator.html

@@ -1,3 +1,5 @@
+{% include layout/data.liquid %}
+
 {%- if page.pagination.enabled == true and site.pagination.enabled == true -%}
   {%- assign total_page = paginator.total_pages -%}
   {%- if total_page > 1 -%}
@@ -6,7 +8,7 @@
         {%- if paginator.previous_page -%}
         <li class="page-item">
           <a class="page-link blog-pagination__newer" href="{{ paginator.previous_page_path | prepend: site.baseurl | prepend: site.url }}">
-            &larr;&nbsp;{{ site.strings.post.pagination.newer_text }}
+            &larr;&nbsp;{{ blog_.pagination.newer_text }}
           </a>
         </li>
         {%- endif -%}
@@ -14,9 +16,9 @@
         {%- if total_page > 1 -%}
           <li class="page-item">
             <span class="page-link blog-pagination__counter">
-              [&nbsp;{{ site.strings.post.pagination.counter[0] }}
+              [&nbsp;{{ blog_.pagination.counter[0] }}
               {{ paginator.page }}
-              {{ site.strings.post.pagination.counter[1] }}
+              {{ blog_.pagination.counter[1] }}
               {{ total_page }}&nbsp;]
             </span>
           </li>
@@ -25,7 +27,7 @@
         {%- if paginator.next_page -%}
         <li class="page-item">
           <a class="page-link blog-pagination__older" href="{{ paginator.next_page_path | prepend: site.baseurl | prepend: site.url }}">
-            {{ site.strings.post.pagination.older_text }}&nbsp;&rarr;
+            {{ blog_.pagination.older_text }}&nbsp;&rarr;
           </a>
         </li>
         {%- endif -%}

data/_includes/socials

@@ -1,3 +1,7 @@
+{%- include layout/data.liquid -%}
+
+{%- assign separator = default_.separator -%}
+
 <div class="container socials">
   <div class="row">
 
@@ -9,12 +13,10 @@
       {%- assign pos = "justify-content-end" -%}
     {%- endif -%}
 
-    <div class="col-sm d-flex {{pos}}"><strong>.&nbsp;</strong>
-      {% assign links = site.socials.links %}
+    <div class="col-sm d-flex {{pos}}" style="padding: 0 !important;">
+      {% assign links = socials_.links %}
       {% for item in links %}
-        <a class="socials-link" title="{{ item.title }}" href="{{ item.url }}" target="_blank">
-          {{ item.title }}
-        </a><strong>&nbsp;.&nbsp;</strong>
+        <a class="socials-link" title="{{ item.title }}" href="{{ item.url }}" target="_blank">{{ item.title }}</a><strong class="separator">{{separator}}</strong>
       {% endfor %}
     </div>
 

data/_includes/tabs

@@ -1,94 +1 @@
-<div class="tabs-start" aria-hidden="true"></div>
-
-<script>
-  (function () {
-    if (window.__simple_tabs_installed) return;
-    window.__simple_tabs_installed = true;
-
-    function processTabs() {
-      var starts = Array.from(document.querySelectorAll('.tabs-start'));
-      starts.forEach(function (start) {
-        var end = start.nextSibling;
-        while (end && !(end.nodeType === 1 && end.classList && end.classList.contains('tabs-end'))) {
-          end = end.nextSibling;
-        }
-        if (!end) return;
-
-        var node = start.nextSibling;
-        var tabs = [];
-        var currentTab = null;
-        while (node && node !== end) {
-          var next = node.nextSibling;
-          if (node.nodeType === Node.TEXT_NODE && !node.textContent.trim()) {
-            node = next; continue;
-          }
-          var text = (node.textContent || '').trim();
-          var m = text.match(/^\s*tab\d*\s*:\s*(.+)$/i);
-          if (m) {
-            currentTab = { title: m[1].trim(), nodes: [] };
-            tabs.push(currentTab);
-            if (node.parentNode) node.parentNode.removeChild(node);
-          } else if (currentTab) {
-            currentTab.nodes.push(node);
-          } else {
-          }
-          node = next;
-        }
-
-        if (tabs.length === 0) {
-          return;
-        }
-
-        var wrap = document.createElement('div');
-        wrap.className = 'tabs-wrap';
-
-        var nav = document.createElement('div');
-        nav.className = 'tabs-nav';
-
-        var panels = document.createElement('div');
-        panels.className = 'tabs-panels';
-
-        tabs.forEach(function (tab, i) {
-          var btn = document.createElement('button');
-          btn.type = 'button';
-          btn.className = 'tab-btn' + (i === 0 ? ' active' : '');
-          btn.setAttribute('data-idx', i);
-          btn.textContent = tab.title;
-          btn.addEventListener('click', function () {
-            var idx = +this.getAttribute('data-idx');
-            wrap.querySelectorAll('.tab-btn').forEach(function (b) {
-              b.classList.toggle('active', +b.getAttribute('data-idx') === idx);
-            });
-            wrap.querySelectorAll('.tab-panel').forEach(function (p, pi) {
-              p.classList.toggle('active', pi === idx);
-            });
-          });
-          nav.appendChild(btn);
-
-          var panel = document.createElement('div');
-          panel.className = 'tab-panel' + (i === 0 ? ' active' : '');
-          tab.nodes.forEach(function (n) {
-            panel.appendChild(n.cloneNode(true));
-          });
-          panels.appendChild(panel);
-        });
-
-        wrap.appendChild(nav);
-        wrap.appendChild(panels);
-
-        start.parentNode.insertBefore(wrap, start);
-
-        var cur = start;
-        while (cur) {
-          var nx = cur.nextSibling;
-          if (cur.parentNode) cur.parentNode.removeChild(cur);
-          if (cur === end) break;
-          cur = nx;
-        }
-      });
-    }
-
-    if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', processTabs);
-    else processTabs();
-  })();
-</script>
+<div id="tabs-start" class="tabs-start" aria-hidden="true"></div>