jekyll-theme-opentoolbox 1.0.8 → 2.0.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 2659cddc4008e2e480fc6066710399f3e9084b85189e737d2d82ae6eaf1464c5
-  data.tar.gz: '08ad2d673ff02be3cd58d1249bc887e198d03012ff88e3f3c87ed42dc4dc6094'
+  metadata.gz: af299bef1df3f4b888b8b5f09eaadbe063ba6111673f50fb4d2e74c3caf39f17
+  data.tar.gz: 774374bf72b79dc7f5ce8742313f5317de21e10c4b63964dfe8367315bf0519d
 SHA512:
-  metadata.gz: a7375ed91fb7baa7b669757193cc1412e8f6c4136e4e62e02219ba606b6e631e0262110a066a28e17e02972de515b1e41ee00bee4bc099416e66aabc07ce0af1
-  data.tar.gz: 7efb19b7c9f560310502ca505817e155d6bfad7bd57470831fab0708eea9f34c8f0e3009c8ea74f64ab3a30748e1168562f516a0f5870a9da5dddedd14aa514e
+  metadata.gz: 4919f42bc26e4d094fe1801d80f1dae83b3cbd563abc97499f3eeeb632c18ebaed4e7f5e06b98b911aa06edda6bc65fd502c1838858866ffebdbba5e718e2b2d
+  data.tar.gz: 6a7af8e9095f318acf2b667d62d940c9eca9dc3e70765f3e5d49853288fa8a59bc815eaee71c8e376cbe17864e663e3dcbb450a7b5166efe37b2daec295947b2

data/README.md

@@ -1,73 +1,100 @@
-# [Open Toolbox](https://thedevelopertoolbox.github.io) 🧰 [![GitHub license](https://img.shields.io/github/license/thedevelopertoolbox/template?color=grey&label=License)](https://github.com/thedevelopertoolbox/template/blob/main/LICENSE)
-Tutte le risorse dei mastermind di programmazione di start2impact!
+# [Open Toolbox](https://the.opentoolbox.online) 🧰 [![License](https://img.shields.io/github/license/opentoolbox/theme?color=f40000&label=License)](https://github.com/opentoolbox/theme/blob/main/LICENSE)
 
-[![Build and Deploy to Github Pages](https://github.com/thedevelopertoolbox/template/actions/workflows/jekyll.yml/badge.svg)](https://github.com/thedevelopertoolbox/template/actions/workflows/jekyll.yml)
+[![Gem Version](https://badge.fury.io/rb/jekyll-theme-opentoolbox.svg)](https://badge.fury.io/rb/jekyll-theme-opentoolbox)
+[![Build and Deploy to Github Pages](https://github.com/opentoolbox/theme/actions/workflows/jekyll.yml/badge.svg)](https://github.com/opentoolbox/theme/actions/workflows/jekyll.yml)
 
+This is a theme for Jekyll, built so that you can create a fast, automatically updated and mobile-friendly websites without worrying about the actual HTML.
 
-Questo sito è pensato per raccogliere tutte le risorse che potrebbero risultare utili a studenti di programmazione.
+## How to use it
+Install it locally:
+```bash
+bundle install jekyll-theme-opentoolbox
+```
+... and set it as your theme by adding this line to your `_config.yml`:
+```yaml
+theme: jekyll-theme-opentoolbox
+```
 
-Abbiamo raccolto tantissimi strumenti, guide, framework e altri in un unico punto.
+Or you could set it as a **remote theme** for [GitHub Pages](https://pages.github.com) by adding this line to your `_config.yml`:
+```yaml
+remote_theme: opentoolbox/theme
+```
 
-## 👥 Contribuire
+___
 
-Abbiamo pensato ad un progetto totalmente aperto e mantenuto dalla community quindi, se vuoi sei il benvenuto ad aggiungere delle risorse o correggere quelle che abbiamo... o magari a migliorare lo stile del sito stesso!
+## 👥 Contributing
 
-Se decidi di contribuire con una **pull request** ricordati di farlo con gli giusti **label**.
+To contribute to this project please refer to our [rules]({{site.links.rules}}). They're not many, don't worry.
 
-## 👨‍💻 Sviluppo in locale
+## 👨‍💻 Local Development
 
 ### 🧪 Jekyll & Ruby
 
-Questo sito è progettato in *Jekyll*, un motore di templating scritto in *Ruby*. Per installarlo segui [questa guida](https://jekyllrb.com/docs/installation/).
+This site uses *Jekyll* to generate the static pages from the provided templates.
+In order to install both it and it's components follow [this guide](https://jekyllrb.com/docs/installation/).
 
 ### 🔧 Make
-Per semplificarti la vita abbiamo predisposto dei comandi semplificati con *Make*.
+To simplify our lives we have simplified the commands used to build, publish, serve, etc.
+In order to accomplish this we've used *Make*.
 
-Se sei su **Linux** lo hai già installato di default.
+If you're on **Linux** or **macOS** you already have it installed, if you're on Windows please continue this section of the guide.
 
-Se invece sei su **Windows** devi prima scaricarti un gestore di pacchetti:
+#### Install using package managers on Windows
 
-#### Installare [Chocolatey](https://chocolatey.org/install) e poi eseguire:
+You have serveral options, these are the best 2:
+
+You could install [Chocolatey](https://chocolatey.org/install) and run:
 ```bash
 choco install make
 ```
 
-#### Installare [Scoop](https://scoop.sh) e poi eseguire:
+...or install [Scoop](https://scoop.sh) and run:
 ```bash
 scoop install make
 ```
-### 🎉 Setup finale
-Una volta installato scarica tutte le dipendenze con:
 
+You're all set. Time to build this thing!
+### 🎉 Final setup
+Now that we have our simplified commands, setting up the project is easy...
+
+Here are our commands:
+#### Install & build
 ```bash
 make
 ```
 
-Per eseguire la **build**:
-
+#### Re-build
 ```bash
 make build
 ```
 
-Per servire il sito con *hot reload* esegui:
-
+#### Serve site in development mode
 ```bash
 make start
 ```
 
-e apri il link che ti dice nel terminale.
-
----
-
-# Contribuenti 💚 ![GitHub contributors](https://img.shields.io/github/contributors/thedevelopertoolbox/template?color=grey&label=)
-
-[![contributors](https://contrib.rocks/image?repo=thedevelopertoolbox/template)](https://github.com/thedevelopertoolbox/template/graphs/contributors)
+... and open the link showed in the CLI.
 
+#### Check for problems
+```bash
+make check
+```
 
-Potresti esserci anche tu qui ☝
+# Contributors ❤ ![GitHub contributors](https://img.shields.io/github/contributors/opentoolbox/theme?color=red&label=)
 
+[![contributors](https://contrib.rocks/image?repo=opentoolbox/theme)](https://github.com/opentoolbox/theme/graphs/contributors)
 
-<img src="https://i.ibb.co/VCrGbkN/Pallino-bianco-2.png" width="500px" alt="start2impact">
+You could also be here ☝
 
+___
 
-Mantenuto dalla community di [**start2impact**](https://start2impact.it).
+<div align="center">
+	<a href="https://bulma.io">
+		<img
+			src="https://bulma.io/images/made-with-bulma--semiwhite.png"
+			alt="Made with Bulma"
+			width="256"
+			height="auto"
+		/>
+	</a>
+</div>

data/_includes/banner.html

@@ -1,5 +1,5 @@
-<section class="hero {% if page.hero_height %} {{ page.hero_height }} {% else %} is-medium {% endif %} {% if page.hero_style %} {{page.hero_style}} {% else %} is-dark {% endif %}" {% if page.hero_image %} style="background: url('{{ page.hero_image }}') no-repeat center center; background-size: cover;" {% endif %}>
-    <div class="hero-body {% if page.hero_darken %} hero-darken {% endif %} py-small">
+<section class="hero {% if page.banner_height %} {{ page.banner_height }} {% else %} is-medium {% endif %} {% if page.banner_style %} {{page.banner_style}} {% else %} is-dark {% endif %}" {% if page.banner_image %} style="background: url('{{ page.banner_image }}') no-repeat center center; background-size: cover;" {% endif %}>
+    <div class="hero-body {% if page.banner_darken %} hero-darken {% endif %} py-small">
         <div class="container">
             <div class="columns is-4 is-vcentered">
 				{% if page.image %}
@@ -14,8 +14,8 @@
 						<p class="subtitle is-3">{{ page.subtitle }}</p>
 					</div>
 
-                    {% if page.hero_link %}
-                        <a href="{{ page.hero_link | relative_url }}" class="button {%if page.hero_link_style %} {{ page.hero_link_style }} {% else %} is-light {% endif %} is-outlined is-rounded is-medium">{{ page.hero_link_text }}</a>
+                    {% if page.banner_link %}
+                        <a href="{{ page.banner_link | relative_url }}" class="button {%if page.banner_link_style %} {{ page.banner_link_style }} {% else %} is-light {% endif %} is-outlined is-rounded is-medium">{{ page.banner_link_text }}</a>
                     {% endif %}
                 </div>
             </div>

data/_includes/callouts.html

@@ -5,13 +5,14 @@
             <div class="container">
                 <div class="columns is-multiline is-centered is-vcentered is-4">
                     {% for callout in callouts.items %}
+						{% assign icon = callout.icon %}
                         <div class="column is-4 has-text-centered p-6">
                             {% if callout.icon %}
                             <div class="icon callout-icon">
                             {% if callout.icon_brand %}
-                                <i class="fab {{ callout.icon }} fa-4x"></i>
+								{% include icon.html category="fab" icon=icon size="4x" %}
                             {% else %}
-                                <i class="fas {{ callout.icon }} fa-4x"></i>
+								{% include icon.html icon=icon size="4x" %}
                             {% endif %}
                             </div>
                             {% endif %}
@@ -27,7 +28,9 @@
                             {% if callout.call_to_action_name %}
                             <a href="{{ callout.call_to_action_link | relative_url }}" class="{{ callouts.style }} is-block has-text-weight-bold mt-medium">
                                 <span>{{ callout.call_to_action_name }}</span>
-                                <span class="ml-small"><i class="fas fa-external-link-alt"></i></span>
+                                <span class="ml-small">
+									{% include icon.html icon="external-link-alt" %}
+								</span>
                             </a>
                             {% endif %}
                         </div>
@@ -36,4 +39,8 @@
             </div>
         </div>
     </section>
+
+	{% if callouts.with_wave %}
+		{% include section-divider.html %}
+	{% endif %}
 {% endif %}

data/_includes/contribute.html

@@ -0,0 +1,19 @@
+<div class="my-small is-flex is-justify-content-space-around">
+	{% if site.links.feedback %}
+		<a href="{{site.links.feedback}}">
+			{% include icon.html category="far" icon="heart" %}
+		</a>
+	{% endif %}
+
+	{% if site.links.pull_requests %}
+		<a href="{{site.links.pull_requests}}">
+			{% include icon.html icon="code-branch" %}
+		</a>
+	{% endif %}
+
+	{% if site.links.discussions %}
+		<a href="{{site.links.discussions}}">
+			{% include icon.html icon="comments" %}
+		</a>
+	{% endif %}
+</div>

data/_includes/credits.html

@@ -0,0 +1,13 @@
+<footer class="hero is-dark">
+    <div class="hero-body">
+        <div class="container">
+            <p class="title is-3">Credits</p>
+
+            <a href="{{site.links.contributors}}">
+                <img src="https://contrib.rocks/image?repo={{ site.repository }}" />
+            </a>    
+            
+            <p>You could be here! ☝ {% if site.links.source %} Contribute to <a class="has-text-link" href="{{site.links.source}}">this project</a>. {% endif %}</p>
+        </div>
+    </div>
+</footer>

data/_includes/disqus.html

@@ -1,17 +1,17 @@
-{% if page.comments != false and jekyll.environment == "production" %}
-
-  <div id="disqus_thread"></div>
-  <script>
-    var disqus_config = function () {
-      this.page.url = '{{ page.url | absolute_url }}';
-      this.page.identifier = '{{ page.url | absolute_url }}';
-    };
-    (function() {
-      var d = document, s = d.createElement('script');
-      s.src = 'https://{{ site.disqus.shortname }}.disqus.com/embed.js';
-      s.setAttribute('data-timestamp', +new Date());
-      (d.head || d.body).appendChild(s);
-    })();
-  </script>
-  <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript" rel="nofollow">comments powered by Disqus.</a></noscript>
+{% if page.comments != false and jekyll.environment == "production" %}
+
+  <div id="disqus_thread"></div>
+  <script>
+    var disqus_config = function () {
+      this.page.url = '{{ page.url | absolute_url }}';
+      this.page.identifier = '{{ page.url | absolute_url }}';
+    };
+    (function() {
+      var d = document, s = d.createElement('script');
+      s.src = 'https://{{ site.disqus.shortname }}.disqus.com/embed.js';
+      s.setAttribute('data-timestamp', +new Date());
+      (d.head || d.body).appendChild(s);
+    })();
+  </script>
+  <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript" rel="nofollow">comments powered by Disqus.</a></noscript>
 {% endif %}

data/_includes/footer.html

@@ -1,4 +1,4 @@
-<footer class="footer">
+<footer class="footer mt-small">
     <div class="container">
         {% if site.footer_menu %}
         <div class="columns is-multiline">
@@ -12,23 +12,12 @@
         </div>
         {% endif %}
 
-        <div class="content is-small has-text-centered">
-            <p>Theme built by <a href="https://www.csrhymes.com">C.S. Rhymes</a> and slightly modified by <a href="https://mattia.codes">Mattia Sinisi</a> and <a href="https://gloriadesiderideveloper.it/">Gloria Desideri</a></p>
-            <small>Le immagini utilizzate sono prese liberamente da internet, utilizziamo l'URL invece di scaricarle. Mostriamo sempre riconoscimenti agli artisti originali dove richiesto.</small>
-        </div>
+		{% if site.data.messages.footer %}
+			<div class="content is-small has-text-centered">
+				{{site.data.messages.footer | markdownify }}
+			</div>
+		{% endif %}
     </div>
 </footer>
 
-<footer class="hero is-dark">
-    <div class="hero-body">
-        <div class="container">
-            <p class="title is-3">Contribuenti</p>
-
-            <a href="https://github.com/{{ site.repository }}/graphs/contributors">
-                <img src="https://contrib.rocks/image?repo={{ site.repository }}" />
-            </a>    
-            
-            <p>Potresti esserci anche tu qui ☝</p>
-        </div>
-    </div>
-</footer>
+{% include credits.html %}

data/_includes/gallery.html

@@ -1,25 +1,25 @@
-{% if page.gallery %}
-    {% assign galleries=site.data.[page.gallery] %}
-    {% for gallery in galleries %}
-    <div class="columns is-multiline">
-        <div class="column is-12">
-            <p class="title is-3 has-text-centered">{{ gallery.title }}</p>
-        </div>
-        {% for image in gallery.images %}
-        <div class="column is-4-desktop is-6-tablet">
-            <div class="card">
-                <div class="card-image">
-                    {% include image-modal.html ratio=image.ratio link=image.link alt=image.alt large_link=image.large_link %}
-                </div>
-                <div class="card-content">
-                    <div class="content">
-                        {{ image.description | markdownify }}
-                    </div>
-
-                </div>
-            </div>
-        </div>
-        {% endfor %}
-    </div>
-    {% endfor %}
+{% if page.gallery %}
+    {% assign galleries=site.data.[page.gallery] %}
+    {% for gallery in galleries %}
+    <div class="columns is-multiline">
+        <div class="column is-12">
+            <p class="title is-3 has-text-centered">{{ gallery.title }}</p>
+        </div>
+        {% for image in gallery.images %}
+        <div class="column is-4-desktop is-6-tablet">
+            <div class="card">
+                <div class="card-image">
+                    {% include image-modal.html ratio=image.ratio link=image.link alt=image.alt large_link=image.large_link %}
+                </div>
+                <div class="card-content">
+                    <div class="content">
+                        {{ image.description | markdownify }}
+                    </div>
+
+                </div>
+            </div>
+        </div>
+        {% endfor %}
+    </div>
+    {% endfor %}
 {% endif %}

data/_includes/google-analytics.html

@@ -1,8 +1,8 @@
-<script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google_analytics }}"></script>
-<script>
-  window['ga-disable-{{ site.google_analytics }}'] = window.doNotTrack === "1" || navigator.doNotTrack === "1" || navigator.doNotTrack === "yes" || navigator.msDoNotTrack === "1";
-  window.dataLayer = window.dataLayer || [];
-  function gtag(){dataLayer.push(arguments);}
-  gtag('js', new Date());
-  gtag('config', '{{ site.google_analytics }}');
+<script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google_analytics }}"></script>
+<script>
+  window['ga-disable-{{ site.google_analytics }}'] = window.doNotTrack === "1" || navigator.doNotTrack === "1" || navigator.doNotTrack === "yes" || navigator.msDoNotTrack === "1";
+  window.dataLayer = window.dataLayer || [];
+  function gtag(){dataLayer.push(arguments);}
+  gtag('js', new Date());
+  gtag('config', '{{ site.google_analytics }}');
 </script>

data/_includes/header.html

@@ -1,31 +1,30 @@
-<nav class="navbar is-primary {% if site.fixed_navbar %} is-fixed-{{ site.fixed_navbar }} {% endif %}" x-data="{ openNav: false }">
+<nav class="navbar has-shadow {% if site.fixed_navbar %} is-fixed-{{ site.fixed_navbar }} {% endif %}" x-data="{ openNav: false }">
     <div class="container">
         <div class="navbar-brand">
-            <a href="{{ site.baseurl }}/" class="navbar-item">
+            <a href="{{ site.baseurl }}/" class="navbar-item is-rounded">
                 {{ site.title }}
             </a>
-            <a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false" data-target="navMenu" :class="{ 'is-active': openNav }" x-on:click="openNav = !openNav">
+            <a role="button" class="navbar-burger is-rounded burger" aria-label="menu" aria-expanded="false" data-target="navMenu" :class="{ 'is-active': openNav }" x-on:click="openNav = !openNav">
                 <span aria-hidden="true"></span>
                 <span aria-hidden="true"></span>
                 <span aria-hidden="true"></span>
             </a>
         </div>
-        <div class="navbar-menu" id="navMenu" :class="{ 'is-active': openNav }">
+        <div class="navbar-menu px-small is-rounded" id="navMenu" :class="{ 'is-active': openNav }">
             <div class="navbar-start">
-                <a href="{{ site.baseurl }}/" class="navbar-item {% if page.url == "/" %}is-active{% endif %}">Home</a>
                 {% if site.data.navigation %}
                 {% for item in site.data.navigation %}
                     {% if item.dropdown %}
-                    <div class="navbar-item has-dropdown is-hoverable {% if site.fixed_navbar == 'bottom' %} has-dropdown-up {% endif %}">
-                        <a href="{{ item.link | relative_url }}" class="navbar-link {% if item.link == page.url %}is-active{% endif %}">{{ item.name }}</a>
-                        <div class="navbar-dropdown">
+                    <div class="navbar-item is-rounded py-small has-dropdown is-hoverable {% if site.fixed_navbar == 'bottom' %} has-dropdown-up {% endif %}">
+                        <a href="{{ item.link | relative_url }}" class="navbar-link is-rounded {% if item.link == page.url %}is-active{% endif %}">{{ item.name }}</a>
+                        <div class="navbar-dropdown is-boxed">
                             {% for subitem in item.dropdown %}
-                            <a href="{{ subitem.link | relative_url }}" class="navbar-item {% if subitem.link == page.url %}is-active{% endif %}">{{ subitem.name }}</a>
+                            <a href="{{ subitem.link | relative_url }}" class="navbar-item is-rounded {% if subitem.link == page.url %}is-active{% endif %}">{{ subitem.name }}</a>
                             {% endfor %}
                         </div>
                     </div>
                     {% else %}
-                    <a href="{{ item.link | relative_url }}" class="navbar-item {% if item.link == page.url %}is-active{% endif %}">{{ item.name }}</a>
+                    <a href="{{ item.link | relative_url }}" class="navbar-item is-rounded {% if item.link == page.url %}is-active{% endif %}">{{ item.name }}</a>
                     {% endif %}
                 {% endfor %}
                 {% endif %}
@@ -33,8 +32,8 @@
 
             <div class="navbar-end">
                 {% if site.gh_sponsor %}
-                <a class="navbar-item" href="https://github.com/sponsors/{{ site.gh_sponsor }}">
-                    <span class="icon gh-sponsor"><i class="fas fa-heart"></i></span>
+                <a class="navbar-item is-rounded" href="https://github.com/sponsors/{{ site.gh_sponsor }}">
+					{% include class="gh-sponsor" icon="heart" %}
                     <span>Sponsor</span>
                 </a>
                 {% endif %}

data/_includes/icon.html

@@ -0,0 +1,3 @@
+<span class="icon {{ include.class }}">
+	<i class="{% if include.category %} {{include.category}} {% else %} fas {% endif %} fa-{{include.icon}} {% if include.size %} fa-{{include.size}} {% endif %}"></i>
+</span>

data/_includes/image-modal.html

@@ -1,18 +1,18 @@
-<div x-data="{ open: false }">
-    <a @click="open = true" title="View large image">
-        <figure class="image {{ include.ratio | default: is-16by9 }}">
-            <img src="{{ include.link | absolute_url }}" alt="{{ include.alt }}">
-        </figure>
-    </a>
-    <div class="modal" :class="{ 'is-active': open }">
-        <div class="modal-background" @click="open = false"></div>
-        <div class="modal-content">
-            {% if include.large_link %}
-                <img src="{{ include.large_link | absolute_url }}" alt="{{ include.alt }}">
-            {% else %}
-                <img src="{{ include.link | absolute_url }}" alt="{{ include.alt }}">
-            {% endif %}
-        </div>
-        <button class="modal-close is-large" aria-label="close" @click="{ open = false }"></button>
-    </div>
-</div>
+<div x-data="{ open: false }">
+    <a @click="open = true" title="View large image">
+        <figure class="image {{ include.ratio | default: is-16by9 }}">
+            <img src="{{ include.link | absolute_url }}" alt="{{ include.alt }}">
+        </figure>
+    </a>
+    <div class="modal" :class="{ 'is-active': open }">
+        <div class="modal-background" @click="open = false"></div>
+        <div class="modal-content">
+            {% if include.large_link %}
+                <img src="{{ include.large_link | absolute_url }}" alt="{{ include.alt }}">
+            {% else %}
+                <img src="{{ include.link | absolute_url }}" alt="{{ include.alt }}">
+            {% endif %}
+        </div>
+        <button class="modal-close is-large" aria-label="close" @click="{ open = false }"></button>
+    </div>
+</div>

data/_includes/important-message.html

@@ -0,0 +1,5 @@
+{% if site.data.messages.important %}
+	<div class="has-text-white has-text-centered has-background-dark py-small px-medium">
+		{{ site.data.messages.important | markdownify }}
+	</div>
+{% endif %}

data/_includes/latest-posts.html

@@ -1,12 +1,14 @@
-<p class="title is-4">Latest Posts</p>
-
-<div class="columns is-multiline">
-    {% for post in site.posts limit:3 %}
-    <div class="column is-12">
-        {% include post-card.html %}
-    </div>
-    {% endfor %}
-</div>
-
-
-
+<div class="section">
+	<p class="title is-4">Latest 🕑</p>
+
+	<div class="columns is-multiline">
+		{% for post in site.posts limit:3 %}
+		<div class="column is-4">
+			{% include post-card.html %}
+		</div>
+		{% endfor %}
+	</div>
+</div>
+
+
+

data/_includes/menubar.html

@@ -1,21 +1,21 @@
-{% assign menus = site.data.[page.menubar] %}
-
-<aside class="menu">
-{% for menu in menus %}
-    <p class="menu-label">{{ menu.label }}</p>
-    <ul class="menu-list">
-        {% for item in menu.items %}
-        <li>
-            <a href="{{ item.link | relative_url }}" class="{% if item.link == page.url %}is-active{% endif %}">{{ item.name }}</a>
-            {% if item.items %}
-            <ul>
-                {% for subitem in item.items %}
-                <li><a href="{{ subitem.link | relative_url }}" class="{% if subitem.link == page.url %}is-active{% endif %}">{{ subitem.name }}</a></li>
-                {% endfor %}
-            </ul>
-            {% endif %}
-        </li>
-        {% endfor %}    
-    </ul>
-{% endfor %}
+{% assign menus = site.data.[page.menubar] %}
+
+<aside class="menu">
+{% for menu in menus %}
+    <p class="menu-label">{{ menu.label }}</p>
+    <ul class="menu-list">
+        {% for item in menu.items %}
+        <li>
+            <a href="{{ item.link | relative_url }}" class="{% if item.link == page.url %}is-active{% endif %}">{{ item.name }}</a>
+            {% if item.items %}
+            <ul>
+                {% for subitem in item.items %}
+                <li><a href="{{ subitem.link | relative_url }}" class="{% if subitem.link == page.url %}is-active{% endif %}">{{ subitem.name }}</a></li>
+                {% endfor %}
+            </ul>
+            {% endif %}
+        </li>
+        {% endfor %}    
+    </ul>
+{% endfor %}
 </aside>

data/_includes/notification.html

@@ -1,17 +1,18 @@
-<div x-data="{visible: true}" markdown="0">
-    <div class="notification {{ include.status | default: 'is-warning' }}" x-show.transition.duration.300ms="visible">
-        {% if include.dismissable %}
-            <button class="delete" x-on:click="visible = false"></button>
-        {% endif %}
-        <article class="media">
-            {% unless include.icon %}
-                <div class="media-left">
-                    <span class="icon"><i class="{{ include.icon | default: 'fas fa-exclamation-circle' }} fa-lg"></i></span>
-                </div>
-            {% endunless %}
-            <div class="media-content">
-                <div class="content">{{ include.message | markdownify }}</div>
-            </div>
-        </article>
-    </div>
+{% assign icon = include.icon | default: 'exclamation-circle' %}
+<div x-data="{visible: true}" markdown="0">
+    <div class="notification {{ include.status | default: 'is-warning' }}" x-show.transition.duration.300ms="visible">
+        {% if include.dismissable %}
+            <button class="delete" x-on:click="visible = false"></button>
+        {% endif %}
+        <article class="media">
+            {% unless include.icon %}
+                <div class="media-left">
+                    {% include icon.html icon=icon %}
+                </div>
+            {% endunless %}
+            <div class="media-content">
+                <div class="content">{{ include.message | markdownify }}</div>
+            </div>
+        </article>
+    </div>
 </div>