testio-tailwind 0.1.0

package/src/pages/typography/markdown.md

@@ -0,0 +1,113 @@
+---
+tags: typography
+title: Markdown styles
+---
+
+{% tag %}
+
+These styles are scope with the class `markdown`
+
+___
+
+# This is a heading level 1
+## This is a heading level 2
+### This is a heading level 3
+#### This is a heading level 4
+##### Heading level 5
+###### Heading level 6
+___
+
+
+### Emphasis
+
+**This is bold text**
+
+__This is bold text__
+
+*This is emphasized text*
+
+_This is emphasized text_
+
+~~Strikethrough~~
+___
+
+
+### Links
+
+[link text](http://test.io)
+[link with title](http://test.io "title text!")
+___
+
+
+### Blockquotes
+
+> Here's a block quote by a famous Test IO employee
+
+> Blockquotes can also be nested
+>> ... by using additional greater-than signs right next to each other...
+> > > ...or with spaces between arrows.
+___
+
+### Lists
+
+#### Unordered
+
++ Create a list by starting a line with `+`, `-`, or `*`
++ Sub-lists are made by indenting 2 spaces:
+  - Marker character change forces new list start:
+    * This is a new list with started with the character `*`
+    * Ac tristique libero volutpat at
+    + This is a new list with started with the character `+`
+    + Facilisis in pretium nisl aliquet
+    - This is a new list with started with the character `-`
+    - Nulla volutpat aliquam velit
++ Very easy!
+
+#### Ordered
+
+1. Lorem ipsum dolor sit amet
+2. Consectetur adipiscing elit
+3. Integer molestie lorem at massa
+-
+1. You can use sequential numbers...
+2. ...or keep all the numbers as `1.`
+
+___
+
+### Code
+
+Inline `code`
+
+Block code "fences"
+
+```
+Sample text here...
+```
+
+Syntax highlighting
+
+``` js
+var foo = function (bar) {
+  return bar++;
+};
+
+console.log(foo(5));
+```
+
+### Horizontal Rules
+___
+
+---
+
+***
+
+
+### Tables
+
+| Option | Description |
+| ------ | ----------- |
+| data   | path to data files to supply the data that will be passed into templates. |
+| engine | engine to be used for processing templates. Handlebars is the default. |
+| ext    | extension to be used for dest files. |
+
+{% endtag %}

package/src/pages/typography/section_header.haml

@@ -0,0 +1,25 @@
+---
+tags: typography
+title: Section header
+---
+
+%section
+  .section-header
+    %h1.section-title Section header with h1
+    .section-label Section label
+%section
+  .section-header
+    %h2.section-title Section header with h2
+    .section-label Section label
+%section
+  .section-header
+    %h3.section-title Section header with h3
+    .section-label Section label
+%section
+  .section-header
+    %h4.section-title Section header with h4
+    .section-label Section label
+%section
+  .section-header
+    %h5.section-title Section header with h5
+    .section-label Section label

package/src/pages/typography/section_header_actions.haml

@@ -0,0 +1,60 @@
+---
+tags: typography
+title: Section header with actions
+---
+
+%section
+  .section-header
+    %h1.section-title Section with action h1
+    .section-actions
+      %a.link-with-icon{href:""}
+        .icon.icon-sort-descending
+        Severity (desc)
+      %a.linked-icon{href:""}
+        .icon.icon-filter
+      %a.linked-icon{href:""}
+        .icon.icon-search
+%section
+  .section-header
+    %h2.section-title Section header with action h2
+    .section-actions
+      %a.link-with-icon{href:""}
+        .icon.icon-sort-descending
+        Severity (desc)
+      %a.linked-icon{href:""}
+        .icon.icon-filter
+      %a.linked-icon{href:""}
+        .icon.icon-search
+%section
+  .section-header
+    %h3.section-title Section header with action h3
+    .section-actions
+      %a.link-with-icon{href:""}
+        .icon.icon-sort-descending
+        Severity (desc)
+      %a.linked-icon{href:""}
+        .icon.icon-filter
+      %a.linked-icon{href:""}
+        .icon.icon-search
+%section
+  .section-header
+    %h4.section-title Section header with action h4
+    .section-actions
+      %a.link-with-icon{href:""}
+        .icon.icon-sort-descending
+        Severity (desc)
+      %a.linked-icon{href:""}
+        .icon.icon-filter
+      %a.linked-icon{href:""}
+        .icon.icon-search
+%section
+  .section-header
+    %h5.section-title Section header with action h5
+    .section-actions
+      %a.link-with-icon{href:""}
+        .icon.icon-sort-descending
+        Severity (desc)
+      %a.linked-icon{href:""}
+        .icon.icon-filter
+      %a.linked-icon{href:""}
+        .icon.icon-search

package/src/pages/typography/text_with_icon.haml

@@ -0,0 +1,12 @@
+---
+tags: typography
+title: Text with icon
+---
+
+.text-with-icon
+  .icon.icon-exclamation-circle
+  All approved testers must complete this course to achieve bronze level and above.
+.pt-xs
+.text-with-icon
+  .icon.icon-exclamation-circle
+  All approved testers will have a one-month transition period to complete it. If they do not pass, even Diamond testers will be downgraded to copper level.

package/src/pages/typography/trix_styles.haml

@@ -0,0 +1,127 @@
+---
+tags: typography
+title: Trix content styles
+---
+
+%p.mb-md All RTF styles are scoped to the .trix-content prefix.
+.trix-content
+  %h1 This is a heading level 1
+  %h2 This is a heading level 2
+  %h3 This is a heading level 3
+  %h4 This is a heading level 4
+  %h5 Heading level 5
+  %h6 Heading level 6
+  %hr
+  %h3 Emphasis
+  %strong This is bold text
+  %p
+    %strong This is bold text wrapped in an paragraph
+  %p
+    %em This is emphasized text
+  %p
+    %s Strikethrough
+  %hr
+  %h3 Links
+  %a{href:"http://test.io"} Text of link
+  %hr
+  %h3 Blockquotes
+  %blockquote
+    %p Here's a block quote by a famous Test IO employee
+  %blockquote
+    %p Blockquotes can also be nested
+    %blockquote
+      %p Blockquotes can also be nested
+      %blockquote
+        %p Blockquotes can also be nested
+  %h3 Lists
+  %h4 Unordered
+  %ul
+    %li Unordered list item
+    %li Unordered list item with much more text and some serious lorem ipsum
+    %li Another unordered list item
+  %ul
+    %li Unordered list item
+    %li Unordered list item with much more text and some serious lorem ipsum
+    %li
+      %p Nesting lists is never a good idea, but should look nice anyway.  
+      %ul
+        %li Unordered nested list item
+        %li Unordered nested list item with much more text and some serious lorem ipsum
+        %li
+          %p Another level of nesting because why be constrained by reason? 
+          %ul
+            %li Unordered nested list item
+            %li Unordered nested list item with much more text and some serious lorem ipsum
+            %li Another nested unordered list item
+    %li
+      %p Let's nest an ordered OL just for fun
+      %ol
+        %li Ordered nested list item
+        %li Ordered nested list item with much more text and some serious lorem ipsum
+        %li Another ordered list item
+  %h4 Ordered
+  %ol
+    %li Ordered list item
+    %li Ordered list item with much more text and some serious lorem ipsum
+    %li Another ordered list item
+  %ol
+    %li Ordered list item
+    %li Ordered list item with much more text and some serious lorem ipsum
+    %li
+      %p Nobody is save from nesting lists!
+      %ol
+        %li Ordered nested list item
+        %li Ordered nested list item with much more text and some serious lorem ipsum
+        %li
+          %p Won't ever stop nesting!
+          %ol
+            %li Ordered nested list item
+            %li Ordered nested list item with much more text and some serious lorem ipsum
+            %li Another nested Ordered list item
+    %li
+      %p Nesting is fun, so let's ignore reason and put in more sublists
+      %ul
+        %li Unordered nested list item
+        %li Unordered nested list item with much more text and some serious lorem ipsum
+        %li
+          %p Multiverse nesting fun!
+          %ul
+            %li Unordered nested list item
+            %li Unordered nested list item with much more text and some serious lorem ipsum
+            %li Another nested unordered list item
+  %hr
+  %h3 Code
+  %p
+    Inline
+    %code code
+  %p Block code
+  %pre
+    %code
+      :plain
+        Sample text here...
+  %p Syntax highlighting
+  %pre
+    %code.language-js
+      :plain
+        var foo = function (bar) {
+          return bar++;
+        };
+        console.log(foo(5));
+  %h3 Horizontal Rules
+  %hr
+  %h3 Tables
+  %table
+    %thead
+      %tr
+        %th Option
+        %th Description
+    %tbody
+      %tr
+        %td data
+        %td path to data files to supply the data that will be passed into templates.
+      %tr
+        %td engine
+        %td engine to be used for processing templates. Handlebars is the default.
+      %tr
+        %td ext
+        %td extension to be used for dest files.

package/src/pages/typography/typography.haml

@@ -0,0 +1,52 @@
+---
+tags: typography
+title: Basic typographic elements
+---
+
+.mb-1
+  %h1.inline Heading 1
+  %span.px-1 or use the class
+  .text-heading-1.inline .text-heading-1
+.mb-1
+  %h2.inline Heading 2
+  %span.px-1 or use the class
+  .text-heading-2.inline .text-heading-2
+.mb-1
+  %h3.inline Heading 3
+  %span.px-1 or use the class
+  .text-heading-3.inline .text-heading-3
+.mb-1
+  %h4.inline Heading 4
+  %span.px-1 or use the class
+  .text-heading-4.inline .text-heading-4
+.mb-1
+  %h5.inline Heading 5
+  %span.px-1 or use the class
+  .text-heading-5.inline .text-heading-5
+.mb-1
+  %p.text-display-1 Display 1
+.mb-1
+  %p.text-display-2 Display 2
+.mb-
+  %p.text-display-3 Display 3
+.mb-1
+  %p.text-display-4 Display 4
+.mb-1
+  %p Paragraph full of lorem ipsum 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.
+.mb-1
+  %a.block{href:'#'} Text link
+.mb-1
+  %label.inline.label .label
+  %span.px-1 or use the class
+  .form-label.inline .form-label
+.mb-1
+  %label.label-sm .label-sm
+.mb-1
+  %p.text-label.inline
+
+.mb-1
+  %p.text-lg Text LG
+.mb-1
+  %p.text-sm Text SM 
+.mb-1
+  %p.text-xs Text XS 

package/src/sitemap.xml.njk

@@ -0,0 +1,14 @@
+---
+permalink: /sitemap.xml
+eleventyExcludeFromCollections: true
+---
+<?xml version="1.0" encoding="utf-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+{%- for page in collections.all %}
+  {% set absoluteUrl %}{{ site.url }}{{ page.url | url }}{% endset %}
+  <url>
+    <loc>{{ absoluteUrl }}</loc>
+    <lastmod>{{ page.date | htmlDateString }}</lastmod>
+  </url>
+{%- endfor %}
+</urlset>