npm - testio-tailwind - Versions diffs - 2.0.1 → 2.1.0 - Mend

testio-tailwind 2.0.1 → 2.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (162) hide show

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
 	"name": "testio-tailwind",
-	"version": "2.0.1",
+	"version": "2.1.0",
 	"description": "Tailwind based design system for Test IO",
 	"scripts": {
 		"clean": "del dist --force",

package/src/_includes/head.njk CHANGED Viewed

@@ -1,72 +1,85 @@
-<!--
-  Maintained with the excellent knowledge from https://htmlhead.dev
-  These comments will be removed in production
-  ========================
-  The following 2 meta tags *must* come first in the <head>
-  to consistently ensure proper document rendering.
-  Any other head element should come *after* these tags.
--->
-<meta charset="utf-8">
-<meta name="viewport" content="width=device-width, initial-scale=1">
-<!-- Set the base URL for all relative URLs within the document -->
-<base href="{{ page.url }}">
-<!--
-  Short description of the document (limit to 150 characters)
-  This content *may* be used as a part of search engine results.
--->
-<meta name="description" content="{% if description %}{{ description }}{% else %}{{ site.description }}{% endif %}">
-<!-- Control the behavior of search engine crawling and indexing -->
-<meta name="robots" content="index,follow"><!-- All Search Engines -->
-<meta name="googlebot" content="index,follow"><!-- Google Specific -->
-<!-- Tells Google not to show the sitelinks search box -->
-<meta name="google" content="nositelinkssearchbox">
-<!-- Tells Google not to provide a translation for this document -->
-<meta name="google" content="notranslate">
-<!-- Identify the software used to build the document, Eleventy ftw! -->
-<meta name="generator" content="eleventy">
-<!-- Disable automatic detection and formatting of possible phone numbers -->
-<meta name="format-detection" content="telephone=no">
-<!-- Helps prevent duplicate content issues -->
-<link rel="canonical" href="{{ site.url }}{{ page.url }}">
-<title>{% if title %}{{ title }} - {% endif %}{{ site.title }}</title>
-<!-- Links to information about the author(s) of the document -->
-<link rel="author" href="humans.txt">
-<link rel="apple-touch-icon" sizes="180x180" href="/assets/images/apple-touch-icon.png">
-<link rel="icon" type="image/png" sizes="32x32" href="/assets/images/favicon-32x32.png">
-<link rel="icon" type="image/png" sizes="16x16" href="/assets/images/favicon-16x16.png">
-<link rel="manifest" href="/site.webmanifest">
-<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
-<meta name="msapplication-TileColor" content="#000000">
-<meta name="theme-color" content="#ffffff">
-<!-- Facebook Open Graph meta -->
-<meta property="og:url" content="{{ site.url}}{{ page.url }}">
-<meta property="og:type" content="website">
-<meta property="og:title" content="{% if title %}{{ title }}{% else %}{{ site.title }}{% endif %}">
-{% if site.meta_data.default_social_image or featured_image %}
-  <meta property="og:image" content="{% if env == 'production' %}{{ site.url }}{% endif %}{% if featured_image  %}{{ featured_image }}{% else %}{{ site.meta_data.default_social_image }}{% endif %}" />
-{% endif %}
-<meta property="og:description" content="{% if description %}{{ description }}{% else %}{{ site.description }}{% endif %}" />
-<meta property="og:site_name" content="{{ site.title }}">
-<meta property="og:locale" content="en_US">
-<meta property="article:author" content="{{ site.author }}">
-<!-- Twitter Open Graph meta -->
-<meta name="twitter:card" content="summary_large_image">
-<meta name="twitter:site" content="{{ site.meta_data.twitter }}">
-<meta name="twitter:creator" content="{{ site.meta_data.twitter }}">
-<!-- disallow Twitter from using your site's info for personalization purposes -->
-<meta name="twitter:dnt" content="on">
+<head>
+  <!--
+    Maintained with the excellent knowledge from https://htmlhead.dev
+    These comments will be removed in production
+    ========================
+    The following 2 meta tags *must* come first in the <head>
+    to consistently ensure proper document rendering.
+    Any other head element should come *after* these tags.
+  -->
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <!-- Set the base URL for all relative URLs within the document -->
+  <base href="{{ page.url }}">
+  <!--
+    Short description of the document (limit to 150 characters)
+    This content *may* be used as a part of search engine results.
+  -->
+  <meta name="description" content="{% if description %}{{ description }}{% else %}{{ site.description }}{% endif %}">
+  <!-- Control the behavior of search engine crawling and indexing -->
+  <meta name="robots" content="index,follow"><!-- All Search Engines -->
+  <meta name="googlebot" content="index,follow"><!-- Google Specific -->
+  <!-- Tells Google not to show the sitelinks search box -->
+  <meta name="google" content="nositelinkssearchbox">
+  <!-- Tells Google not to provide a translation for this document -->
+  <meta name="google" content="notranslate">
+  <!-- Identify the software used to build the document, Eleventy ftw! -->
+  <meta name="generator" content="eleventy">
+  <!-- Disable automatic detection and formatting of possible phone numbers -->
+  <meta name="format-detection" content="telephone=no">
+  <!-- Helps prevent duplicate content issues -->
+  <link rel="canonical" href="{{ site.url }}{{ page.url }}">
+  <title>{% if title %}{{ title }} - {% endif %}{{ site.title }}</title>
+  <!-- Links to information about the author(s) of the document -->
+  <link rel="author" href="humans.txt">
+  <link rel="apple-touch-icon" sizes="180x180" href="/assets/images/apple-touch-icon.png">
+  <link rel="icon" type="image/png" sizes="32x32" href="/assets/images/favicon-32x32.png">
+  <link rel="icon" type="image/png" sizes="16x16" href="/assets/images/favicon-16x16.png">
+  <link rel="manifest" href="/site.webmanifest">
+  <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
+  <meta name="msapplication-TileColor" content="#000000">
+  <meta name="theme-color" content="#ffffff">
+  <!-- Facebook Open Graph meta -->
+  <meta property="og:url" content="{{ site.url}}{{ page.url }}">
+  <meta property="og:type" content="website">
+  <meta property="og:title" content="{% if title %}{{ title }}{% else %}{{ site.title }}{% endif %}">
+  {% if site.meta_data.default_social_image or featured_image %}
+    <meta property="og:image" content="{% if env == 'production' %}{{ site.url }}{% endif %}{% if featured_image  %}{{ featured_image }}{% else %}{{ site.meta_data.default_social_image }}{% endif %}" />
+  {% endif %}
+  <meta property="og:description" content="{% if description %}{{ description }}{% else %}{{ site.description }}{% endif %}" />
+  <meta property="og:site_name" content="{{ site.title }}">
+  <meta property="og:locale" content="en_US">
+  <meta property="article:author" content="{{ site.author }}">
+  <!-- Twitter Open Graph meta -->
+  <meta name="twitter:card" content="summary_large_image">
+  <meta name="twitter:site" content="{{ site.meta_data.twitter }}">
+  <meta name="twitter:creator" content="{{ site.meta_data.twitter }}">
+  <!-- disallow Twitter from using your site's info for personalization purposes -->
+  <meta name="twitter:dnt" content="on">
+  <link rel="stylesheet" href="/static/app.compiled.css" id="testio-tailwind" title="Test IO TailWind">
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/1.13.0/beautify-html.js"></script>
+  <script>
+    window.onload = () => {
+      const previews = document.getElementsByClassName("html-preview");
+      for (i = 0; i < previews.length; i++) {
+        previews[i].innerText = html_beautify(previews[i].textContent)
+      }
+    }
+  </script>
+</head>

package/src/_includes/header.njk ADDED Viewed

@@ -0,0 +1,65 @@
+<header class="header manager">
+  <div class="navlinks logo-wrapper">
+    <a class="navlink header-logo" href="/"></a>
+  </div>
+  <div class="navlinks left">
+    {% for item in navigation.items %}
+      <a href="{{ item.url }}"
+          {% if page.url == item.url %} aria-current="page" {% endif %}
+          class="navlink
+          {% if page.url == item.url %} active {% endif %}">
+        {{ item.text }}
+      </a>
+    {% endfor %}
+    <details class="header-dropdown dropright">
+      <summary class="navlink">Spaces</summary>
+      <div class="dropdown-menu">
+        <a href="/issuing" class="dropdown-link">Issuing</a>
+        <a href="/testinator" class="dropdown-link">Testinator</a>
+      </div>
+    </details>
+    <details class="header-dropdown dropright">
+      <summary class="navlink">Examples</summary>
+      <div class="dropdown-menu">
+        {% for examples in collections.examples %}
+          <a href="{{ examples.url }}"
+              class="dropdown-link">
+            {{ examples.data.title }}
+          </a>
+        {% endfor %}
+      </div>
+    </details>
+  </div>
+  <!-- Mobile menu button-->
+  <details class="mobile-links">
+    <summary class="mobile-menu-btn"><div class="navlink"><span class="sr-only">Open main menu</span><!-- Icon when menu is closed.--><span class="icon icon-menu" aria-hidden="true"></span></div></summary>
+    <div class="mobile-menu sidebar">
+      {% for item in navigation.items %}
+        <a href="{{ item.url }}"
+            {% if page.url == item.url %} aria-current="page" {% endif %}
+            class="navlink
+            {% if page.url == item.url %} active {% endif %}">
+          {{ item.text }}
+        </a>
+      {% endfor %}
+    <details class="navlink-container">
+      <summary class="navlink">Spaces</summary>
+      <a href="/issuing" class="navlink">Issuing</a>
+      <a href="/testinator" class="navlink">Testinator</a>
+    </details>
+      <details class="navlink-container">
+        <summary class="navlink">Examples</summary>
+        {% for examples in collections.examples %}
+          <a href="{{ examples.url }}"
+              class="navlink">
+            {{ examples.data.title }}
+          </a>
+        {% endfor %}
+      </details>
+    </div>
+  </details>
+</header>

package/src/_layouts/base.njk CHANGED Viewed

@@ -1,89 +1,13 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    {% include "head.njk" %}
-    <link rel="stylesheet" href="/static/app.compiled.css" id="testio-tailwind" title="Test IO TailWind">
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/1.13.0/beautify-html.js"></script>
-    <script>
-      window.onload = () => {
-        const previews = document.getElementsByClassName("html-preview");
-        for (i = 0; i < previews.length; i++) {
-          previews[i].innerText = html_beautify(previews[i].textContent)
-        }
-      }
-    </script>
+  {% include "head.njk" %}
-  </head>
   <body class="app-body">
-    <header class="header manager">
-      <div class="navlinks logo-wrapper">
-        <a class="navlink header-logo" href="/"></a>
-      </div>
-      <div class="navlinks">
-        {% for item in navigation.items %}
-          <a href="{{ item.url }}"
-              {% if page.url == item.url %} aria-current="page" {% endif %}
-              class="navlink
-              {% if page.url == item.url %} active {% endif %}">
-            {{ item.text }}
-          </a>
-        {% endfor %}
-        <details class="header-dropdown">
-          <summary class="navlink">Spaces</summary>
-          <div class="dropdown-menu">
-            <a href="/issuing" class="dropdown-link">Issuing</a>
-          </div>
-        </details>
-        <details class="header-dropdown">
-          <summary class="navlink">Examples</summary>
-          <div class="dropdown-menu">
-            {% for examples in collections.examples %}
-              <a href="{{ examples.url }}"
-                  class="dropdown-link">
-                {{ examples.data.title }}
-              </a>
-            {% endfor %}
-          </div>
-        </details>
+    {% include "header.njk" %}
-      </div>
-      <!-- Mobile menu button-->
-      <div class="mobile-links">
-        <details>
-            <summary class="mobile-menu-btn"><div class="navlink"><span class="sr-only">Open main menu</span><!-- Icon when menu is closed.--><span class="text-xl icon icon-menu" aria-hidden="true"></span></div></summary>
-            <div class="mobile-menu sidebar">
-              {% for item in navigation.items %}
-                <a href="{{ item.url }}"
-                    {% if page.url == item.url %} aria-current="page" {% endif %}
-                    class="navlink
-                    {% if page.url == item.url %} active {% endif %}">
-                  {{ item.text }}
-                </a>
-              {% endfor %}
-              <details>
-                <summary class="navlink-container"><div class="navlink">Examples</div></summary>
-                {% for examples in collections.examples %}
-                  <a href="{{ examples.url }}"
-                      class="navlink">
-                    {{ examples.data.title }}
-                  </a>
-                {% endfor %}
-              </details>
-            </div>
-        </details>
-      </div>
-    </header>
-  {% block content %}
-    {{ content | safe }}
-  {% endblock %}
+    {% block content %}
+      {{ content | safe }}
+    {% endblock %}
   </body>
   {% include "footer-scripts.njk" %}
 </html>

package/src/_layouts/email-template.njk CHANGED Viewed

@@ -1,88 +1,12 @@
 <!DOCTYPE html>
 <html lang="en">
+  {% include "head.njk" %}
   <head>
-    {% include "head.njk" %}
-    <link rel="stylesheet" href="/static/app.compiled.css" id="cirro-space-stylesheet" title="Cirro Space Design System">
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/1.13.0/beautify-html.js"></script>
-    <script>
-      window.onload = () => {
-        const previews = document.getElementsByClassName("html-preview");
-        for (i = 0; i < previews.length; i++) {
-          previews[i].innerText = html_beautify(previews[i].textContent)
-        }
-      }
-    </script>
-  </head>
   <body class="app-body">
-    <header class="header"><a class="navlink header-logo" href="/"></a>
-      <div class="navlinks">
-        {% for item in navigation.items %}
-          <a href="{{ item.url }}"
-              {% if page.url == item.url %} aria-current="page" {% endif %}
-              class="navlink
-              {% if page.url == item.url %} active {% endif %}">
-            {{ item.text }}
-          </a>
-        {% endfor %}
-        <details class="header-dropdown">
-          <summary class="navlink">Examples</summary>
-          <div class="dropdown-menu dropdown-projects">
-            {% for examples in collections.examples %}
-              <a href="{{ examples.url }}"
-                  class="dropdown-link">
-                {{ examples.data.title }}
-              </a>
-            {% endfor %}
-          </div>
-        </details>
-      </div>
-      <!-- Mobile menu button-->
-      <div class="mobile-links">
-        <details>
-            <summary class="mobile-menu-btn"><div class="navlink"><span class="sr-only">Open main menu</span><!-- Icon when menu is closed.--><span class="text-xl icon icon-menu" aria-hidden="true"></span></div></summary>
-            <div class="mobile-menu sidebar">
-              {% for item in navigation.items %}
-                <a href="{{ item.url }}"
-                    {% if page.url == item.url %} aria-current="page" {% endif %}
-                    class="navlink
-                    {% if page.url == item.url %} active {% endif %}">
-                  {{ item.text }}
-                </a>
-              {% endfor %}
-            <details>
-              <summary class="navlink-container"><div class="navlink">Examples</div></summary>
-              {% for examples in collections.examples %}
-                <a href="{{ examples.url }}"
-                    class="navlink">
-                  {{ examples.data.title }}
-                </a>
-              {% endfor %}
-            </details>
-        <details>
-          <summary class="navlink-container"><div class="navlink">E-Mail</div></summary>
-          {% for emailtemplates in collections.emailtemplates %}
-            <a href="{{ emailtemplates.url }}"
-                class="navlink">
-              {{ emailtemplates.data.title }}
-            </a>
-          {% endfor %}
-        </details>
-            </div>
-        </details>
-      </div>
-    </header>
+    {% include "header.njk" %}
     {% block content %}
-      <main class="email-template-container">{{ content | safe }}</main>
+      <main class="main-content email-template-container">{{ content | safe }}</main>
     {% endblock %}
   </body>

package/src/_layouts/page-example-customer.njk CHANGED Viewed

@@ -1,75 +1,14 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    {% include "head.njk" %}
-    <link rel="stylesheet" href="/static/app.compiled.css" id="cirro-space-stylesheet" title="Cirro Space Design System">
-  </head>
+  {% include "head.njk" %}
   <body class="app-body">
-    <header class="header">
-      <div class="navlinks logo-wrapper"><a class="navlink header-logo" href="/"></a></div>
-      <div class="navlinks left">
-        {% for item in navigation.items %}
-          <a href="{{ item.url }}"
-              {% if page.url == item.url %} aria-current="page" {% endif %}
-              class="navlink
-              {% if page.url == item.url %} active {% endif %}">
-            {{ item.text }}
-          </a>
-        {% endfor %}
-        <details class="header-dropdown">
-          <summary class="navlink">Spaces</summary>
-          <div class="dropdown-menu">
-            <a href="/issuing" class="dropdown-link">Issuing</a>
-          </div>
-        </details>
-        <details class="header-dropdown">
-          <summary class="navlink">Examples</summary>
-          <div class="dropdown-menu dropdown-projects">
-            {% for examples in collections.examples %}
-              <a href="{{ examples.url }}"
-                  class="dropdown-link">
-                {{ examples.data.title }}
-              </a>
-            {% endfor %}
-          </div>
-        </details>
-      </div>
-    <details class="mobile-links">
-        <summary class="mobile-menu-btn">
-            <div class="navlink"><span class="sr-only">Open main menu</span><span class="text-icon-default icon icon-menu" aria-hidden="true"></span></div>
-        </summary>
-        <div class="mobile-menu sidebar z-10">
-          {% for item in navigation.items %}
-            <a href="{{ item.url }}"
-                {% if page.url == item.url %} aria-current="page" {% endif %}
-                class="navlink
-                {% if page.url == item.url %} active {% endif %}">
-              {{ item.text }}
-            </a>
-          {% endfor %}
-          <details class="header-dropdown">
-            <summary class="navlink">Examples</summary>
-            <div class="dropdown-menu">
-              {% for examples in collections.examples %}
-                <a href="{{ examples.url }}"
-                    class="dropdown-link">
-                  {{ examples.data.title }}
-                </a>
-              {% endfor %}
-            </div>
-          </details>
-        </div>
-    </details>
-    </header>
+  {% include "header.njk" %}
     {% block content %}
       <main class="page-example-container">
         <div class="app-body">
-          {% include "example-header-customer.pug" %}
+          {% include "example-header-customer.njk" %}
           {{ content | safe }}
         </div>
       </main>

package/src/_layouts/page-example-manager.njk CHANGED Viewed

@@ -1,70 +1,9 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    {% include "head.njk" %}
-    <link rel="stylesheet" href="/static/app.compiled.css" id="cirro-space-stylesheet" title="Cirro Space Design System">
+  {% include "head.njk" %}
-  </head>
   <body class="app-body">
-    <header class="header">
-      <div class="navlinks logo-wrapper"><a class="navlink header-logo" href="/"></a></div>
-      <div class="navlinks left">
-        {% for item in navigation.items %}
-          <a href="{{ item.url }}"
-              {% if page.url == item.url %} aria-current="page" {% endif %}
-              class="navlink
-              {% if page.url == item.url %} active {% endif %}">
-            {{ item.text }}
-          </a>
-        {% endfor %}
-        <details class="header-dropdown">
-          <summary class="navlink">Spaces</summary>
-          <div class="dropdown-menu">
-            <a href="/issuing" class="dropdown-link">Issuing</a>
-          </div>
-        </details>
-        <details class="header-dropdown">
-          <summary class="navlink">Examples</summary>
-          <div class="dropdown-menu dropdown-projects">
-            {% for examples in collections.examples %}
-              <a href="{{ examples.url }}"
-                  class="dropdown-link">
-                {{ examples.data.title }}
-              </a>
-            {% endfor %}
-          </div>
-        </details>
-      </div>
-    <details class="mobile-links">
-        <summary class="mobile-menu-btn">
-            <div class="navlink"><span class="sr-only">Open main menu</span><span class="text-icon-default icon icon-menu" aria-hidden="true"></span></div>
-        </summary>
-        <div class="mobile-menu sidebar z-10">
-          {% for item in navigation.items %}
-            <a href="{{ item.url }}"
-                {% if page.url == item.url %} aria-current="page" {% endif %}
-                class="navlink
-                {% if page.url == item.url %} active {% endif %}">
-              {{ item.text }}
-            </a>
-          {% endfor %}
-          <details class="header-dropdown">
-            <summary class="navlink">Examples</summary>
-            <div class="dropdown-menu">
-              {% for examples in collections.examples %}
-                <a href="{{ examples.url }}"
-                    class="dropdown-link">
-                  {{ examples.data.title }}
-                </a>
-              {% endfor %}
-            </div>
-          </details>
-        </div>
-    </details>
-    </header>
+    {% include "header.njk" %}
     {% block content %}
       <main class="page-example-container">

package/src/_layouts/page-example-tester.njk CHANGED Viewed

@@ -1,71 +1,10 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    {% include "head.njk" %}
-    <link rel="stylesheet" href="/static/app.compiled.css" id="cirro-space-stylesheet" title="Cirro Space Design System">
+  {% include "head.njk" %}
-  </head>
   <body class="app-body">
-    <header class="header">
-      <div class="navlinks logo-wrapper"><a class="navlink header-logo" href="/"></a></div>
-      <div class="navlinks left">
-        {% for item in navigation.items %}
-          <a href="{{ item.url }}"
-              {% if page.url == item.url %} aria-current="page" {% endif %}
-              class="navlink
-              {% if page.url == item.url %} active {% endif %}">
-            {{ item.text }}
-          </a>
-        {% endfor %}
-        <details class="header-dropdown">
-          <summary class="navlink">Spaces</summary>
-          <div class="dropdown-menu">
-            <a href="/issuing" class="dropdown-link">Issuing</a>
-          </div>
-        </details>
-        <details class="header-dropdown">
-          <summary class="navlink">Examples</summary>
-          <div class="dropdown-menu dropdown-projects">
-            {% for examples in collections.examples %}
-              <a href="{{ examples.url }}"
-                  class="dropdown-link">
-                {{ examples.data.title }}
-              </a>
-            {% endfor %}
-          </div>
-        </details>
-      </div>
-    <details class="mobile-links">
-        <summary class="mobile-menu-btn">
-            <div class="navlink"><span class="sr-only">Open main menu</span><span class="text-icon-default icon icon-menu" aria-hidden="true"></span></div>
-        </summary>
-        <div class="mobile-menu sidebar z-10">
-          {% for item in navigation.items %}
-            <a href="{{ item.url }}"
-                {% if page.url == item.url %} aria-current="page" {% endif %}
-                class="navlink
-                {% if page.url == item.url %} active {% endif %}">
-              {{ item.text }}
-            </a>
-          {% endfor %}
-          <details class="header-dropdown">
-            <summary class="navlink">Examples</summary>
-            <div class="dropdown-menu">
-              {% for examples in collections.examples %}
-                <a href="{{ examples.url }}"
-                    class="dropdown-link">
-                  {{ examples.data.title }}
-                </a>
-              {% endfor %}
-            </div>
-          </details>
-        </div>
-    </details>
-    </header>
+    {% include "header.njk" %}
     {% block content %}
       <main class="page-example-container">