testio-tailwind 0.2.1 → 0.2.2

package/package.json

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

package/src/_includes/page-with-sidebar-nocode.njk

@@ -29,15 +29,6 @@
         {% endif %}
         {{ section.templateContent | safe }}
 
-        <details class="mt-3">
-          <summary class="btn btn-sm btn-secondary">
-            <span class="icon icon-format-code mr-icon-spacing"></span>
-            <span>Show source</span>
-          </summary>
-          <div class="prose max-w-none bg-gray-light p-2 rounded mt-1 mb-1">
-            <pre><code class="code html-preview">{{ section.templateContent | trim }}</code></pre>
-          </div>
-        </details>
       </section>
     {%- endfor -%}
   </article>

package/src/assets/stylesheets/components/markdown_trix_styles.css

@@ -30,7 +30,7 @@
   }
 
   em {
-    @apply px-xxs text-white font-normal bg-info rounded;
+    @apply px-xxs text-white font-normal not-italic bg-info rounded;
   }
 
   code {

package/src/assets/stylesheets/tailwind.config.js

@@ -290,6 +290,7 @@ module.exports = {
         '4-auto': 'auto auto auto auto',
         '3-auto': 'auto auto auto',
         '2-auto': 'auto auto',
+        '2-auto-fr': 'auto auto 1fr',
         'auto-fr-auto': 'auto 1fr auto',
         'auto-fr-2-auto': 'auto 1fr auto auto',
         'auto-fr': 'auto 1fr',

package/src/pages/icons/index.njk

@@ -48,7 +48,7 @@ fetchIcons(app)
 
   <h1 class="mb-8">Icons</h1>
   {%- for section in collection -%}
-    <section class="space-y-6" id="{{ section.data.title }}">
+    <section class="mb-section-margin" id="{{ section.data.title }}">
       <div class="section-header">
         <h4 class="section-title">{{ section.data.title }}</h4>
       </div>
@@ -60,22 +60,14 @@ fetchIcons(app)
       {% endif %}
       {{ section.templateContent | safe }}
 
-      <details class="mt-3">
-        <summary class="btn btn-sm btn-secondary inline-block cursor-pointer mb-2">
-          Show source
-        </summary>
-        <div class="prose max-w-none bg-gray-light p-2 rounded mb-1">
-          <pre><code class="html-preview">{{ section.templateContent | trim }}</code></pre>
-        </div>
-      </details>
     </section>
   {%- endfor -%}
 
-  <section>
-  <div class="section-header">
-    <h4 class="section-title">Icon list</h4>
-  </div>
-  <div class="grid grid-cols-3 gap-2 place-items-start pb-10" id="iconList"></div>
+  <section class="mb-section-margin">
+    <div class="section-header">
+      <h4 class="section-title">Icon list</h4>
+    </div>
+    <div class="grid grid-cols-3 gap-2 place-items-start pb-10" id="iconList"></div>
   </section>
 
 </main>

package/src/pages/layout/app_layout.haml

@@ -4,13 +4,13 @@ title: App layout structure
 ---
 
 .grid.gap-1px.p-xs.bg-gray-lightest.rounded
-  %p .app-body
-  .p-xs.pl-md.bg-petrol-dark.text-white.rounded-top .header
-  .grid.grid-cols-2-auto-fr.gap-1px
+  %p.mb-heading .app-body
+  .p-xs.pl-md.bg-petrol-dark.text-white.rounded-t .header
+  .grid.grid-cols-auto-fr.gap-1px
     .bg-petrol-dark.text-white.p-xs.pl-md.w-sidebar.rounded-bl nav.sidebar
     .grid.gap-1px
       .bg-gray-light.p-xs.pl-md .test-header.tester
-      .grid.grid-cols-2-fr-auto
+      .grid.grid-cols-3-1
         .bg-white.p-xs.pl-md.h-xxl .main-content
         .bg-gray-lighter.p-xs.pl-md.w-metasidebar aside.metasidebar
       .bg-petrol.text-white.p-xs.pl-md.rounded-br footer.actionbar

package/src/pages/layout/index.njk

@@ -4,4 +4,4 @@ permalink: layout/
 ---
 
 {% set collection = collections.layout %}
-{% include "page-with-sidebar.njk" %}
+{% include "page-with-sidebar-nocode.njk" %}

package/src/pages/layout/max_width.haml

@@ -3,7 +3,7 @@ tags: layout
 title: Max-width capped
 ---
 
-.card.bg-gray-lighter.p-sm.max-w-capped
+.card.bg-gray-lighter.p-sm.max-w-capped.mb-spacing
   %p Card with the class .max-width-capped. The card width will be capped to ensure readability. 
 %p.mb-sm.max-w-capped This class should also be applied to text elements to ensure readability in the case of an endless amount of Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
 .form-grid.mb-sm.max-w-capped

package/src/static/app.compiled.css

@@ -14442,6 +14442,7 @@ a.user-item:hover,
     padding-left: 5px;
     padding-right: 5px;
     font-weight: 400;
+    font-style: normal;
     --tw-text-opacity: 1;
     color: rgba(255, 255, 255, var(--tw-text-opacity));
   }
@@ -50858,6 +50859,10 @@ details.card-section[open] .card-section-header {
   grid-template-columns: auto auto;
 }
 
+.grid-cols-2-auto-fr{
+  grid-template-columns: auto auto 1fr;
+}
+
 .grid-cols-auto-fr-auto{
   grid-template-columns: auto 1fr auto;
 }
@@ -115320,6 +115325,10 @@ details.card-section[open] .card-section-header {
     grid-template-columns: auto auto;
   }
 
+  .sm\:grid-cols-2-auto-fr{
+    grid-template-columns: auto auto 1fr;
+  }
+
   .sm\:grid-cols-auto-fr-auto{
     grid-template-columns: auto 1fr auto;
   }
@@ -179770,6 +179779,10 @@ details.card-section[open] .card-section-header {
     grid-template-columns: auto auto;
   }
 
+  .md\:grid-cols-2-auto-fr{
+    grid-template-columns: auto auto 1fr;
+  }
+
   .md\:grid-cols-auto-fr-auto{
     grid-template-columns: auto 1fr auto;
   }
@@ -244220,6 +244233,10 @@ details.card-section[open] .card-section-header {
     grid-template-columns: auto auto;
   }
 
+  .lg\:grid-cols-2-auto-fr{
+    grid-template-columns: auto auto 1fr;
+  }
+
   .lg\:grid-cols-auto-fr-auto{
     grid-template-columns: auto 1fr auto;
   }
@@ -308670,6 +308687,10 @@ details.card-section[open] .card-section-header {
     grid-template-columns: auto auto;
   }
 
+  .xl\:grid-cols-2-auto-fr{
+    grid-template-columns: auto auto 1fr;
+  }
+
   .xl\:grid-cols-auto-fr-auto{
     grid-template-columns: auto 1fr auto;
   }
@@ -373120,6 +373141,10 @@ details.card-section[open] .card-section-header {
     grid-template-columns: auto auto;
   }
 
+  .\32xl\:grid-cols-2-auto-fr{
+    grid-template-columns: auto auto 1fr;
+  }
+
   .\32xl\:grid-cols-auto-fr-auto{
     grid-template-columns: auto 1fr auto;
   }
@@ -437570,6 +437595,10 @@ details.card-section[open] .card-section-header {
     grid-template-columns: auto auto;
   }
 
+  .\33xl\:grid-cols-2-auto-fr{
+    grid-template-columns: auto auto 1fr;
+  }
+
   .\33xl\:grid-cols-auto-fr-auto{
     grid-template-columns: auto 1fr auto;
   }