jekyll-theme-zer0 0.1.0

data/_includes/footer.html

@@ -0,0 +1,57 @@
+<!--
+  file: footer.html
+  path: _includes/footer.html
+  includes: none
+  descrition: Social Links and Branding
+-->
+
+<footer class="bd-footer container-xl d-flex flex-wrap justify-content-between align-items-center py-3 my-4 border-top">
+  <div class="col-sm d-flex align-items-center">
+    
+    <!-- Frameworks/Engines and Affiliations -->
+    <ul class="nav col-sm justify-content-end list-unstyled d-flex align-items-center">
+
+      <!-- Search for Site Frameworks in config file -->
+      <span class="align-self">
+        &copy; {{ site.time | date: '%Y' }} {{ site.name | default: site.title }}. Powered by: 
+      </span>
+      {% for power in site.powered_by %}
+      <li class="btn ">
+        <a href="{{ power.url }}" rel="nofollow">
+          <i class="{{ site.default_icon }} {{ power.icon | default: site.powered_by.default }}" aria-hidden="true"></i>
+        <!-- display name if there's enough space, else icon only -->
+          <span class="d-none d-md-inline"> 
+            {{ power.name }}
+          </span>
+        </a>
+        </li>
+        {% endfor %}
+        
+      <!-- Search for Site Affiliation links in config file -->
+      {% for link in site.links %}
+      <li class="btn ">
+        <a href="{{ link.url }}" rel="nofollow">
+          <i class="{{ site.default_icon }} {{ link.icon | default: site.links.default }}" aria-hidden="true"></i>
+        <!-- display name if there's enough space, else icon only -->
+          <span class="d-none d-md-inline"> 
+            {{ link.label }}
+          </span>
+        </a>
+        </li>
+      {% endfor %}
+      
+      <!-- RSS Feed -->
+      <li class="btn">
+        <a href="{{ '/feed.xml' | relative_url }}">
+          <i class="{{ site.default_icon }} bi-rss" aria-hidden="true"></i>
+          <!-- https://icons.getbootstrap.com/icons/rss/ -->
+          <span class="d-none d-md-inline">
+            {{ site.data.ui-text[site.locale].feed_label | default: "Feed" }}
+          </span>
+        </a>
+      </li>
+    </ul>
+
+  </div>
+</footer>
+

data/_includes/giscus.html

@@ -0,0 +1,16 @@
+<!-- giscus app - https://giscus.app/ - Feature # FR000001 -->
+
+<script src="https://giscus.app/client.js"
+        data-repo="{{ site.repository }}"
+        data-repo-id="{{ site.gisgus.data-repo-id }}"
+        data-category-id="{{ site.gisgus.data-category-id }}"
+        data-mapping="pathname"
+        data-strict="1"
+        data-reactions-enabled="1"
+        data-emit-metadata="0"
+        data-input-position="top"
+        data-theme="preferred_color_scheme"
+        data-lang="en"
+        crossorigin="anonymous"
+        async>
+</script>

data/_includes/google-analytics.html

@@ -0,0 +1,9 @@
+    <!-- Global site tag (gtag.js) - Google Analytics -->
+    <script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google_analytics }}"></script>
+    <script>
+    window.dataLayer = window.dataLayer || [];
+    function gtag(){dataLayer.push(arguments);}
+    gtag('js', new Date());
+
+    gtag('config', '{{ site.google_analytics }}');
+    </script>

data/_includes/google-tag-manager-body.html

@@ -0,0 +1,8 @@
+<!-- Google Tag Manager (noscript) -->
+    <noscript>
+        <iframe src="https://www.googletagmanager.com/ns.html?id=GTM-NN8P7RZ" 
+                height="0" width="0" style="display:none;visibility:hidden">
+        </iframe>
+    </noscript>
+<!-- End Google Tag Manager (noscript) -->
+<!-- source https://tagmanager.google.com/#/admin/accounts/6005859084/containers/58386588/install?containerDraftId=2 -->

data/_includes/google-tag-manager-head.html

@@ -0,0 +1,10 @@
+<!-- 
+  title: Google Tag Manager 
+  file: 
+-->
+<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+    })(window,document,'script','dataLayer','GTM-NN8P7RZ');</script>
+    <!-- End Google Tag Manager -->

data/_includes/halfmoon.html

@@ -0,0 +1,35 @@
+<!-- 
+  file: halfmoon.html
+  path: _includes/halfmoon.html
+  description: This is the snippet for the dark mode switch.
+ -->
+
+ <div class="justify-content-end">
+  <i class="btn dropdown-toggle" id="bd-theme" type="button" aria-expanded="true" data-bs-toggle="dropdown" data-bs-display="static" aria-label="Toggle theme (dark)">
+    <i class="bi bi-circle-half theme-icon-active"><use href="#moon-stars-fill"></use></i>
+    <span class="d-none ms-2" id="bd-theme-text">Toggle theme</span>
+  </i>
+  <ul class="dropdown-menu" aria-labelledby="bd-theme-text" data-bs-popper="static">
+    <li>
+      <button type="button" class="dropdown-item d-flex align-items-center" data-bs-theme-value="light" aria-pressed="false">
+        <svg class="bi me-2 opacity-50"><use href="#sun-fill"></use></svg>
+        Light
+        <svg class="bi ms-auto d-none"><use href="#check2"></use></svg>
+      </button>
+    </li>
+    <li>
+      <button type="button" class="dropdown-item d-flex align-items-center active" data-bs-theme-value="dark" aria-pressed="true">
+        <svg class="bi me-2 opacity-50"><use href="#moon-stars-fill"></use></svg>
+        Dark
+        <svg class="bi ms-auto d-none"><use href="#check2"></use></svg>
+      </button>
+    </li>
+    <li>
+      <button type="button" class="dropdown-item d-flex align-items-center" data-bs-theme-value="auto" aria-pressed="false">
+        <svg class="bi me-2 opacity-50"><use href="#circle-half"></use></svg>
+        Auto
+        <svg class="bi ms-auto d-none"><use href="#check2"></use></svg>
+      </button>
+    </li>
+  </ul>
+</div>

data/_includes/head.html

@@ -0,0 +1,95 @@
+<!-- 
+  file: head.html
+  path: includes/head.html
+  includes: seo.html, google-analytics.html
+  description: Head section of the HTML document
+
+-->
+
+<!-- Google Tag Manager - Head -->
+
+{% include google-tag-manager-head.html %}
+
+<!-- Custom JS Scripts -->
+<script src="{{ '/assets/js/myScript.js' | relative_url }}"></script>
+<script src="{{ '/assets/js/auto-hide-nav.js' | relative_url }}"></script>
+<script src="{{ '/assets/js/back-to-top.js' | relative_url }}"></script>
+<script src="{{ '/assets/js/halfmoon.js' | relative_url }}"></script>
+<script src="{{ '/assets/js/side-bar-folders.js' | relative_url }}"></script>
+<script src="{{ '/assets/js/code-copy.js' | relative_url }}"></script>
+
+<!-- third party scripts -->
+
+    <!--  mermaid script -->
+    <!-- <script src="https://cdn.jsdelivr.net/npm/mermaid@8/dist/mermaid.min.js"></script>
+    <script >mermaid.initialize({ startOnLoad: true });</script> -->
+
+    <!-- Nano Bar -->
+    <script src="{{'/assets/js/nanobar.min.js' | relative_url }}"></script>
+
+<!-- add dummy progress bar -->
+<script>
+    var options = {
+      classname: 'nanobar',
+      id: 'top-progress-bar'
+    };
+    var nanobar = new Nanobar(options);
+    nanobar.go( 30 );
+    nanobar.go( 76 );
+    nanobar.go(100);
+  </script>
+
+    <!-- MathJax for LaTex -->
+    <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
+
+<!-- Meta -->
+<meta charset="utf-8">
+<meta http-equiv="X-UA-Compatible" content="IE=edge">
+<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+
+<!-- includes/seo.html -->
+{% include seo.html %}
+
+<!-- SEO  https://analytics.google.com/ -->
+
+    <!-- Meta data attributes -->
+    {% if page.title %}
+        <meta itemprop="headline" content="{{ page.title | markdownify | strip_html | strip_newlines | escape_once }}">
+    {% endif %}
+    {% if page.description %}
+        <meta itemprop="description" content="{{ page.description | markdownify | strip_html | strip_newlines | escape_once }}">
+    {% elsif page.excerpt %}
+        <meta itemprop="description" content="{{ page.excerpt | markdownify | strip_html | strip_newlines | escape_once}} ">
+    {% endif %}
+    {% if page.date %}
+        <meta itemprop="datePublished" content="{{ page.date | date_to_xmlschema }}">
+    {% endif %}
+    {% if page.last_modified_at %}
+        <meta itemprop="dateModified" content="{{ page.lastmod | date_to_xmlschema }}">
+    {% endif %}
+
+    <!-- Google Analytics  -->
+    {% include google-analytics.html %}
+
+
+<!-- Styles -->    
+
+    <!-- CDN Styles -->
+        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+
+    <!-- Local Install -->
+        <!-- <script src="/assets/js/bootstrap.js"></script> -->
+
+    <!-- Tailwind CDN -->
+    <!-- TODO: Add tailwind -->
+    <!-- <script src="https://cdn.tailwindcss.com"></script> -->
+
+    <!-- Bootstrap Icons  -->
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css">
+
+    <!-- Custom Styles -->
+    <link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}">
+    <!-- Custom CSS -->
+    <link rel="stylesheet" href="{{'/assets/css/custom.css' | relative_url }}">
+    <!-- TODO: Replace this css with a compiled sass. currently, when docs.scss is compiled to main.css, the scroll spy doesn't work -->
+    <!-- <link rel="stylesheet" href="/assets/css/docs.css"> -->

data/_includes/header.html

@@ -0,0 +1,79 @@
+<!-- 
+  file: header.html
+  path: /_includes/header.html
+  includes:  branding.html, navbar.html, info-bar.html, halfmoon.html
+  TODO: Fix Nanobar progress bar
+ -->
+
+<header id="navbar" class="container-fluid  text-center z-1" role="navigation">
+
+    <!-- Top Navigation Bar -->
+    <div class="navbar navbar-expand-lg bg-body-tertiary flex-nowrap justify-content-center bottom-shadow">
+       
+        <div class="nanobar" id="top-progress-bar" style="position: fixed;">
+            <div class="bar"></div>
+        </div>
+        <!-- Main Navbar -->
+        <nav class=" container-xl order-2 order-lg-1 grid gap-1">
+
+            <!-- Offcanvas button for left side bar in mobile view -->
+            <div class="bd-navbar-toggle ">
+                <button class="navbar-toggler p-2" 
+                        type="button" 
+                        data-bs-toggle="offcanvas" 
+                        data-bs-target="#bdSidebar" 
+                        aria-controls="bdSidebar" 
+                        aria-label="Toggle navigation">
+                <span class="bi bi-list"></span>
+                </button>
+            </div>
+
+            <!-- Home and Root Logo -->
+            <div class="container d-inline-flex text-center ">
+                <!-- Home Link -->
+                {%- for home in site.data.navigation.home -%}
+                <a class="btn " href="{{ home.url | relative_url }}">
+                    <i class="{{ site.default_icon}} {{ home.icon }}" ></i>
+                </a>
+                {% endfor %}
+                <!-- Brand Logo to root  -->
+                <!-- set the URL for the logo image in the _config file -->
+                {% capture logo_path %}{{ site.logo }}{% endcapture %}
+                <a class="navbar-brand" href="{{ site.baseurl }}/">
+                    <img src="{{ logo_path | relative_url }}" alt="Logo" width="30" height="30">
+                </a>
+            </div>
+            <!-- include branding.html --> 
+                {% include branding.html %}
+    
+                <!-- include navbar.html -->
+                {% include navbar.html %}
+
+            <!-- Settings modal button -->
+            <div 
+                class="btn"
+                data-bs-toggle="modal" 
+                data-bs-target="#info-section" 
+                aria-expanded="false" 
+                aria-controls="#info-section"
+                role="button"  >
+                <i 
+                    type="button" 
+                    class="{{site.default_icon}} bi-gear">
+                </i>
+            </div>
+
+            <!-- Offcanvas button for nav links -->
+            <div class="bd-navbar-toggle ">
+                <button class="navbar-toggler p-2" 
+                        type="button" 
+                        data-bs-toggle="offcanvas" 
+                        data-bs-target="#bdNavbar" 
+                        aria-controls="bdNavbar" 
+                        aria-label="Toggle navigation">
+                        <span class="bi bi-three-dots"></span>
+                </button>
+            </div>
+        </nav>
+    </div>
+</header>

data/_includes/info-section.html

@@ -0,0 +1,33 @@
+<!--
+  file: info-section.html
+  path: _includes/info-section.html
+  includes: breadcrumbs.html, searchbar.html, dev-shortcuts.html
+  references: 
+    - https://getbootstrap.com/docs/5.3/components/modal/
+ -->
+
+    <!-- Modal -->
+    <div class="modal fade" id="info-section" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
+        <div class="modal-dialog">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <h1 class="modal-title fs-5" id="staticBackdropLabel">Information Highway</h1>
+                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                </div>
+                <div class="modal-body">
+                    
+                    <!-- _include/breadcrumbs.html -->
+                {% include breadcrumbs.html %}
+                {% include searchbar.html %}
+                {% include dev-shortcuts.html %}
+                <!-- Dark Mode Switch -->
+                {% include halfmoon.html %}
+
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+          <button type="button" class="btn btn-primary">Understood</button>
+        </div>
+      </div>
+    </div>
+  </div>

data/_includes/intro.html

@@ -0,0 +1,27 @@
+<!-- 
+  file: _intro.html
+  description: This is the intro section of the blog post. It includes the title, author, and excerpt of the post.
+  path: _includes/intro.html
+ -->
+
+ {% if page.collection %}
+ {% capture page_dir %}{{ site.collections_dir }}{% endcapture %}
+ {% assign testvar = "collection exists" %}
+{% endif %}
+
+<!-- Intro Section -->
+
+<div class="bd-intro pt-5 ps-lg-2 position-relative" style="
+  background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('{{ page.preview | relative_url | default: site.info_banner }}') no-repeat center center / cover;
+  color: #fff;">
+  <br>
+  <h1>{{ page.title }}</h1>
+  <p>By {{ page.author | default: site.author.name }}</p>
+  <p>{{ page.excerpt }}</p>
+  <p>Estimated reading time: {{ content | number_of_words | divided_by:200 }} minutes</p>
+  <!-- Edit on Github Button -->
+  <a href="https://github.com/{{ site.repository }}/blob/master/{{ page_dir }}/{{ page.path }}" class="btn btn-dark position-absolute bottom-0 end-0 m-3">
+    <i class="bi bi-github"></i>
+    <span class="d-none d-sm-inline">Edit on Github</span>
+  </a>
+</div>

data/_includes/js-cdn.html

@@ -0,0 +1,24 @@
+<!-- 
+    Javascript CDN
+    sources:
+    - Bootstrap 4.0.0
+    - jQuery 3.2.1
+    - Popper.js 1.12.9
+  sources: https://getbootstrap.com/docs/5.3/getting-started/contents/#css-files
+ -->
+
+ <!-- Jquery -->
+<!-- <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> -->
+<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
+
+
+<!-- bootstrap js -->
+<!-- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> -->
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
+
+<!-- Popper -->
+<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
+<!-- <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js" integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r" crossorigin="anonymous"></script> -->
+
+<!-- TODO: Install local bootstrap -->
+<!-- <script src="/assets/js/bootstrap.js"></script> -->

data/_includes/nav_list.html

@@ -0,0 +1,63 @@
+<!--
+  file: nav_list.html
+  path: /_includes/nav_list.html
+  includes:
+-->
+
+<!-- Navigation List -->
+
+{% assign navigation = site.data.navigation[include.nav] %}
+
+  <!-- Navigation Title -->
+  {% for nav in navigation %}
+    {% if nav.nav-title %}
+      <h3 class="nav__title" style="padding-left: 0;">{{ nav.nav-title }}</h3>
+    {% endif %}
+  {% endfor %}
+
+
+  
+  <ul class="list-unstyled fw-normal pb-2 small">
+  <!-- Accordion Nav List -->
+  {% for nav in navigation %}
+      <!-- Nav Title Only Link -->
+      {% if nav.sublinks == null and nav.title%}
+      <li class="mb-1">
+        <a href="{{ nav.url | relative_url }}" class="active d-inline-flex align-items-center rounded">
+          <span class="">{{ nav.title }}</span>
+        </a>
+      </li>
+      {% endif %}
+
+      {% if nav.sublinks %}
+        <li class="mb-1">
+          <strong class="d-flex w-100 align-items-center fw-semibold collapsed"
+          data-bs-toggle="collapse" 
+          data-bs-target="#{{ nav.title }}-collapse" 
+          aria-expanded="true" 
+          aria-current="true">
+            {{ nav.title }}
+          </strong>
+          <!-- <button class="btn d-inline-flex align-items-center rounded collapsed" 
+                  data-bs-toggle="collapse" 
+                  data-bs-target="#{{ nav.title }}-collapse" 
+                  aria-expanded="true" 
+                  aria-current="true">
+            {{ nav.title }}
+          </button> -->
+          <div class="collapse show" id="{{ nav.title }}-collapse" style="">
+            <ul class="list-unstyled fw-normal pb-1 small">
+              {% for child in nav.sublinks %}
+                <li>
+                  <a href="{{ child.url | relative_url }}"
+                    {% if child.url == page.url %} class="active d-inline-flex align-items-center rounded"{% endif %}
+                      >{{ child.title }}
+                  </a>
+                </li>
+              {% endfor %}
+            </ul>
+          </div>
+        {% endif %}
+      </li>
+    {% endfor %}
+  </ul>

data/_includes/navbar.html

@@ -0,0 +1,34 @@
+<!-- 
+  file: navbar.html
+  path: /includes/navbar.html
+  includes: 
+ -->
+
+<!-- Navigation Links - Offcanvas -->
+<div class="offcanvas offcanvas-end col-lg-2" tabindex="-1" id="bdNavbar" aria-labelledby="bdNavbar"> 
+
+<!-- Main Navigation Header - Offcanvas -->
+    <div class="offcanvas-header border-bottom">
+        <h5 class="offcanvas-title" id="mainNavOffcanvasLabel">Main Navigation</h5>
+        <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close" data-bs-target="#bdNavbar"></button>
+    </div>
+
+<!-- Main Navigation List - Offcanvas  -->
+<ul class="navbar-nav offcanvas-body justify-content-lg-center text-start" >
+    {%- for link in site.data.navigation.main -%}
+        <div class="btn-group">
+            <a href="{{ link.url | relative_url }}" class=" nav-link">{{ link.title }}</a>
+            {% if link.sublinks %}
+                <button type="button" class="nav-link dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown" aria-expanded="false">
+                    <span class="visually-hidden">Toggle Dropdown</span>
+                </button>
+                <div class="dropdown-menu" aria-labelledby="navbarDropdown">
+                    {%- for sublink in link.sublinks -%}
+                        <a class="dropdown-item" href="{{ sublink.url | relative_url }}">{{ sublink.title }}</a> 
+                    {%- endfor -%}
+                </div>
+            {% endif %}
+        </div>
+    {% endfor %}
+</ul>
+</div>

data/_includes/powered-by.html

@@ -0,0 +1,22 @@
+<!-- 
+  file: powered-by.html
+  path:_includes/powered-by.html
+  description: This file is used to display the powered by section on the home page.
+ -->
+
+<div class="row row-cols-1 row-cols-md-3 g-4">
+  {% for power in site.powered_by %}
+  <div class="col">
+    <div class="card h-100">
+      <div class="card-body d-flex align-items-start">
+        <div>
+          <h5 class="card-title">{{ power.name }}</h5>
+          <p class="card-text">Version: {{ power.version }}</p>
+          <a href="{{ power.url }}" class="btn btn-primary" rel="nofollow">Go to site</a>
+        </div>
+        <i class="{{ power.icon }} fs-1 ms-auto"></i>
+      </div>
+    </div>
+  </div>
+  {% endfor %}
+</div>

data/_includes/quick-index.html

@@ -0,0 +1,17 @@
+<!-- Quick index of pages in the collection -->
+{% if site.collections.pages %}
+<ul>
+  <p>Quick Index</p>
+  {% for note in site.collections.pages %}
+  {% if note.collection == page.collection %}
+  <li class="active mb-1 list-unstyled"><a href="{{ note.url | relative_url }}">{{ note.title }}</a></li>
+  {% endif %}
+  {% endfor %}
+</ul>
+{% endif %}
+
+<!-- Post Categories -->
+{% if page.sidebar == "searchCats" %}
+<div id="categories">
+</div>
+{% endif %}

data/_includes/searchbar.html

@@ -0,0 +1,10 @@
+
+<!-- 
+  title: Algolia Searchbar and hits 
+  source: https://www.algolia.com/doc/guides/building-search-ui/what-is-instantsearch/js/
+  
+-->
+<div class="container order-1">
+    <div id="searchbox" class=""   ></div>
+    <div id="hits" class="text-start"></div>
+</div>