├── .gitignore ├── _includes ├── fonts.html └── head.html ├── _patterns ├── heading-1.html ├── heading-2.html ├── heading-4.html ├── heading-5.html ├── heading-6.html ├── heading-3.html ├── form-url.html ├── form-email.html ├── form-text.html ├── form-checkbox.html ├── form-number.html ├── form-select.html ├── form-textarea.html ├── feedback.html ├── form-buttons.html ├── feedback-error.html ├── list-ordered.html ├── list-unordered.html ├── blockquote.html ├── pagination.html ├── pagination-first.html ├── pagination-last.html └── text.html ├── _layouts ├── fundamental.html └── pattern.html ├── _config.yml ├── index.html ├── README.md └── css └── global.css /.gitignore: -------------------------------------------------------------------------------- 1 | _site 2 | .DS_Store 3 | .sass-cache/ 4 | .jekyll-metadata 5 | -------------------------------------------------------------------------------- /_includes/fonts.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /_patterns/heading-1.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: heading-1.html 4 | --- 5 |

Level one heading

-------------------------------------------------------------------------------- /_patterns/heading-2.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: heading-2.html 4 | --- 5 |

Level two heading

-------------------------------------------------------------------------------- /_patterns/heading-4.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: heading-4.html 4 | --- 5 |

Level four heading

-------------------------------------------------------------------------------- /_patterns/heading-5.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: heading-5.html 4 | --- 5 |
Level five heading
-------------------------------------------------------------------------------- /_patterns/heading-6.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: heading-6.html 4 | --- 5 |
Level six heading
-------------------------------------------------------------------------------- /_patterns/heading-3.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: heading-3.html 4 | --- 5 |

Level three heading

-------------------------------------------------------------------------------- /_patterns/form-url.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: form-url.html 4 | --- 5 | 6 | -------------------------------------------------------------------------------- /_patterns/form-email.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: form-email.html 4 | --- 5 | 6 | -------------------------------------------------------------------------------- /_patterns/form-text.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: form-text.html 4 | --- 5 | 6 | -------------------------------------------------------------------------------- /_patterns/form-checkbox.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: form-checkbox.html 4 | --- 5 | -------------------------------------------------------------------------------- /_patterns/form-number.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: form-number.html 4 | --- 5 | 6 | -------------------------------------------------------------------------------- /_layouts/fundamental.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | {% include head.html %} 4 | 5 | 6 | {{ content }} 7 | 8 | 9 | -------------------------------------------------------------------------------- /_patterns/form-select.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: form-select.html 4 | --- 5 | -------------------------------------------------------------------------------- /_patterns/form-textarea.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: form-textarea.html 4 | --- 5 | 6 | -------------------------------------------------------------------------------- /_patterns/feedback.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: feedback.html 4 | --- 5 |
6 |

This is a feedback message for the user.

7 |
-------------------------------------------------------------------------------- /_patterns/form-buttons.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: form-buttons.html 4 | --- 5 | 6 | 7 | -------------------------------------------------------------------------------- /_patterns/feedback-error.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: feedback-error.html 4 | --- 5 |
6 |

This is an error feedback message.

7 |
-------------------------------------------------------------------------------- /_layouts/pattern.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: fundamental 3 | --- 4 |

Pattern Sample: {{ page.title }}

5 | 6 | {{ content }} 7 | 8 | Back to the primer -------------------------------------------------------------------------------- /_patterns/list-ordered.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: list-ordered.html 4 | --- 5 |
    6 |
  1. First list item
    2. 7 |
  2. Second item in a list of ordered items
    3. 8 |
  3. Third item in the list
    4. 9 |
-------------------------------------------------------------------------------- /_patterns/list-unordered.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: list-unordered.html 4 | --- 5 | -------------------------------------------------------------------------------- /_patterns/blockquote.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: blockquote.html 4 | --- 5 |
6 |

This text is quoted. A block of quoted text like this is particularly useful when presented as a pull-quote within an article of text.

7 |
-------------------------------------------------------------------------------- /_patterns/pagination.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: pagination.html 4 | --- 5 |
    6 |
  1. 1
    2. 7 |
  2. 2
    3. 8 |
  3. 3
    4. 9 |
  4. 4
    5. 10 |
  5. 5
    6. 11 |
  6. 6
    7. 12 |
  7. 7
    8. 13 |
  8. 8
    9. 14 |
  9. 9
    10. 15 |
  10. 10
    11. 16 |
-------------------------------------------------------------------------------- /_patterns/pagination-first.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: pagination-first.html 4 | --- 5 |
    6 |
  1. 1
    2. 7 |
  2. 2
    3. 8 |
  3. 3
    4. 9 |
  4. 4
    5. 10 |
  5. 5
    6. 11 |
  6. 6
    7. 12 |
  7. 7
    8. 13 |
  8. 8
    9. 14 |
  9. 9
    10. 15 |
  10. 10
    11. 16 |
-------------------------------------------------------------------------------- /_patterns/pagination-last.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: pagination-last.html 4 | --- 5 |
    6 |
  1. 1
    2. 7 |
  2. 2
    3. 8 |
  3. 3
    4. 9 |
  4. 4
    5. 10 |
  5. 5
    6. 11 |
  6. 6
    7. 12 |
  7. 7
    8. 13 |
  8. 8
    9. 14 |
  9. 9
    10. 15 |
  10. 10
    11. 16 |
-------------------------------------------------------------------------------- /_config.yml: -------------------------------------------------------------------------------- 1 | name: Jekyll Version of Pattern Primer 2 | markdown: kramdown 3 | # baseurl should be set to: 4 | # '': for local development (localhost:4000) 5 | # '': for root level domains (mycustomdomain.com) 6 | # '/projectname': for subdomains (user.github.io/projectname) 7 | baseurl: '' 8 | permalink: :title.html 9 | 10 | collections: 11 | patterns: 12 | output: true 13 | permalink: patterns/:path/ 14 | 15 | markdown-patterns: false -------------------------------------------------------------------------------- /_patterns/text.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: pattern 3 | title: text.html 4 | --- 5 |

This is a paragraph of text. Some of the text may be emphasised and some it might even be strongly emphasised. Occasionally quoted text may be found within a paragraph …and of course a link may appear at any point in the text. The average paragraph contains five or six sentences although some may contain as little or one or two while others carry on for anything up to ten sentences and beyond.

-------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: fundamental 3 | title: Pattern Primer 4 | --- 5 | 6 | {% for pattern in site.patterns %} 7 |
8 |
9 | {% if site.markdown-patterns %}{{ pattern.content | markdownify }}{% else %}{{ pattern.content }}{% endif %} 10 |
11 |
12 | 13 |

{{ pattern.title }}

14 |
15 |
16 | {% endfor %} -------------------------------------------------------------------------------- /_includes/head.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | {{ page.title }} 4 | 5 | 6 | 7 | 8 | 9 | 10 | 27 | 28 | {% include fonts.html %} 29 | 30 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Jekyll version of Pattern Primer 2 | 3 | Forked from the [original Pattern-Primer for PHP by Adactio (Jeremy Keith)](https://github.com/adactio/Pattern-Primer) 4 | 5 | Inspired by [Ruby (Sinatra) version](https://github.com/micdijkstra/Pattern-Primer-Ruby) 6 | 7 | ## Pattern Primer 8 | 9 | This is a design communication, testing, and process tool. 10 | 11 | Create little snippets of markup and save them to the `_patterns` directory (a Jekyll [collection](http://jekyllrb.com/docs/collections/)). The pattern primer will generate a list of all the HTML patterns in that folder. 12 | 13 | The patterns are rendered as HTML, with a reference source displayed in a `