From 31f3d086f508d397a504fc0c691b1414747e2389 Mon Sep 17 00:00:00 2001 From: Heydon Pickering Date: Mon, 3 Jul 2017 11:13:19 +0100 Subject: [PATCH] color palettes --- package.json | 4 +- public/css/styles.css | 27 ++ public/index.html | 9 + public/index.xml | 10 + public/js/shadyDOM.min.js | 68 --- public/patterns/code/code-blocks/index.html | 7 + .../code/codepen-embedding/index.html | 9 + .../color-palettes}/index.html | 339 +++++-------- public/patterns/code/index.html | 17 + public/patterns/code/index.xml | 10 + .../code/writing-inline-demos/index.html | 9 + public/patterns/example1/index.html | 164 ------- public/patterns/example2/index.html | 164 ------- public/patterns/index.html | 7 + public/patterns/installation/index.html | 9 + .../patterns/landmarks/example-one/index.html | 310 ------------ public/patterns/landmarks/example2/index.html | 453 ------------------ public/patterns/landmarks/index.html | 165 ------- public/patterns/landmarks/index.xml | 34 -- public/patterns/library-setup/index.html | 15 + public/patterns/serving/index.html | 7 + public/patterns/widgets/example1/index.html | 145 ------ public/patterns/widgets/example2/index.html | 403 ---------------- public/patterns/widgets/index.html | 165 ------- public/patterns/widgets/index.xml | 33 -- .../writing/expandable-sections/index.html | 7 + .../writing/including-images/index.html | 7 + public/patterns/writing/index.html | 7 + .../writing/library-structure/index.html | 9 + .../writing/markdown-and-metadata/index.html | 7 + .../writing/notes-and-warnings/index.html | 7 + public/patterns/writing/references/index.html | 9 + public/sitemap.xml | 4 + public/tags/animated/index.html | 177 ------- public/tags/animated/index.xml | 42 -- public/tags/forms/index.html | 157 ------ public/tags/forms/index.xml | 23 - public/tags/interactive/index.html | 157 ------ public/tags/interactive/index.xml | 24 - public/tags/typography/index.html | 157 ------ public/tags/typography/index.xml | 23 - 41 files changed, 306 insertions(+), 3094 deletions(-) delete mode 100644 public/js/shadyDOM.min.js rename public/patterns/{project-setup => code/color-palettes}/index.html (52%) delete mode 100644 public/patterns/example1/index.html delete mode 100644 public/patterns/example2/index.html delete mode 100644 public/patterns/landmarks/example-one/index.html delete mode 100644 public/patterns/landmarks/example2/index.html delete mode 100644 public/patterns/landmarks/index.html delete mode 100644 public/patterns/landmarks/index.xml delete mode 100644 public/patterns/widgets/example1/index.html delete mode 100644 public/patterns/widgets/example2/index.html delete mode 100644 public/patterns/widgets/index.html delete mode 100644 public/patterns/widgets/index.xml delete mode 100644 public/tags/animated/index.html delete mode 100644 public/tags/animated/index.xml delete mode 100644 public/tags/forms/index.html delete mode 100644 public/tags/forms/index.xml delete mode 100644 public/tags/interactive/index.html delete mode 100644 public/tags/interactive/index.xml delete mode 100644 public/tags/typography/index.html delete mode 100644 public/tags/typography/index.xml diff --git a/package.json b/package.json index 0266a32..fc610cd 100644 --- a/package.json +++ b/package.json @@ -8,9 +8,9 @@ "test": "echo \"Error: no test specified\" && exit 1", "serve": "hugo server", "clean": "rm -rf content && mkdir content && mkdir content/patterns && hugo new patterns/pattern.md && hugo new _index.md", - "build": "hugo", + "build": "rm -rfv public/* && hugo", "setup": "hugo && git add public", - "host": "hugo && git push origin `git subtree split --prefix public master`:gh-pages --force" + "host": "rm -rfv public/* && hugo && git add public && git push origin `git subtree split --prefix public master`:gh-pages --force" }, "repository": { "type": "git", diff --git a/public/css/styles.css b/public/css/styles.css index ad78506..1a1ccd0 100644 --- a/public/css/styles.css +++ b/public/css/styles.css @@ -633,6 +633,33 @@ a .wcag-icon { width: 1.5em; } +/* color palettes */ + +.colors { + display: flex; + height: 5rem; + margin: -0.25rem; + list-style: none; + flex-wrap: nowrap; +} + +.colors li { + margin: 0.25rem; + flex: 1 0 auto; + position: relative; +} + +.colors span { + line-height: 1; + background-color: #111; + color: #fff; + font-size: 0.75rem; + padding: 0.25rem; + position: absolute; + bottom: 0.25rem; + right: 0.25rem; +} + /* cross references */ .pattern-link { diff --git a/public/index.html b/public/index.html index fb0ee04..74da5f8 100644 --- a/public/index.html +++ b/public/index.html @@ -158,6 +158,13 @@ +
  • + + + Color palettes + +
    • +
  • @@ -213,6 +220,8 @@ + + diff --git a/public/index.xml b/public/index.xml index a5b9b90..38d9c33 100644 --- a/public/index.xml +++ b/public/index.xml @@ -65,6 +65,16 @@ Infusion offers a couple of ways to do this. The first is by embedding CodePen d &#x7b;{% codePen VpVNKW %}} This will embed the identified codePen into the content wherever you placed the shortcode, with the result view showing by default: + + Color palettes + https://heydon.github.io/infusion/patterns/code/color-palettes/ + Mon, 01 Jan 0001 00:00:00 +0000 + + https://heydon.github.io/infusion/patterns/code/color-palettes/ + There&rsquo;s no reason why your Infusion-powered pattern library has to be all about functionality. You can include style guide-like information such as color palettes too. The colors shortcode makes it easy to exhibit colors and their values together. Just supply a comma-separated list of CSS color values. +&#x7b;{% colors "#111111, #cccccc, #ffffff" %}} The result is a one row strip showing each color supplied in order. The colors for Infusion are greyscale: + + Including images https://heydon.github.io/infusion/patterns/writing/including-images/ diff --git a/public/js/shadyDOM.min.js b/public/js/shadyDOM.min.js deleted file mode 100644 index 6a6e9ea..0000000 --- a/public/js/shadyDOM.min.js +++ /dev/null @@ -1,68 +0,0 @@ -(function(){ -/* - -Copyright (c) 2016 The Polymer Project Authors. All rights reserved. -This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt -The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt -The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt -Code distributed by Google as part of the polymer project is also -subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt -*/ -'use strict';function n(a,b){return{index:a,i:[],m:b}} -function aa(a,b,c,d){var e=0,h=0,g=0,f=0,k=Math.min(b-e,d-h);if(0==e&&0==h)a:{for(g=0;g]/g;function ja(a){switch(a){case "&":return"&";case "<":return"<";case ">":return">";case '"':return""";case "\u00a0":return" "}}function ka(a){for(var b={},c=0;c";break a;case Node.TEXT_NODE:f=f.data;f=k&&ma[k.localName]?f:f.replace(ia,ja);break a;case Node.COMMENT_NODE:f="\x3c!--"+f.data+"--\x3e";break a;default:throw window.console.error(f), -Error("not implemented");}}c+=f}return c};var I={},J=document.createTreeWalker(document,NodeFilter.SHOW_ALL,null,!1),K=document.createTreeWalker(document,NodeFilter.SHOW_ELEMENT,null,!1);function na(a){var b=[];J.currentNode=a;for(a=J.firstChild();a;)b.push(a),a=J.nextSibling();return b}I.parentNode=function(a){J.currentNode=a;return J.parentNode()};I.firstChild=function(a){J.currentNode=a;return J.firstChild()};I.lastChild=function(a){J.currentNode=a;return J.lastChild()};I.previousSibling=function(a){J.currentNode=a;return J.previousSibling()}; -I.nextSibling=function(a){J.currentNode=a;return J.nextSibling()};I.childNodes=na;I.parentElement=function(a){K.currentNode=a;return K.parentNode()};I.firstElementChild=function(a){K.currentNode=a;return K.firstChild()};I.lastElementChild=function(a){K.currentNode=a;return K.lastChild()};I.previousElementSibling=function(a){K.currentNode=a;return K.previousSibling()};I.nextElementSibling=function(a){K.currentNode=a;return K.nextSibling()}; -I.children=function(a){var b=[];K.currentNode=a;for(a=K.firstChild();a;)b.push(a),a=K.nextSibling();return b};I.innerHTML=function(a){return H(a,function(a){return na(a)})};I.textContent=function(a){if(a.nodeType!==Node.ELEMENT_NODE)return a.nodeValue;a=document.createTreeWalker(a,NodeFilter.SHOW_TEXT,null,!1);for(var b="",c;c=a.nextNode();)b+=c.nodeValue;return b};var M=Object.getOwnPropertyDescriptor(Element.prototype,"innerHTML")||Object.getOwnPropertyDescriptor(HTMLElement.prototype,"innerHTML"),N=document.implementation.createHTMLDocument("inert").createElement("div"),O=Object.getOwnPropertyDescriptor(Document.prototype,"activeElement"),oa={parentElement:{get:function(){var a=this.__shady&&this.__shady.parentNode;a&&a.nodeType!==Node.ELEMENT_NODE&&(a=null);return void 0!==a?a:I.parentElement(this)},configurable:!0},parentNode:{get:function(){var a=this.__shady&& -this.__shady.parentNode;return void 0!==a?a:I.parentNode(this)},configurable:!0},nextSibling:{get:function(){var a=this.__shady&&this.__shady.nextSibling;return void 0!==a?a:I.nextSibling(this)},configurable:!0},previousSibling:{get:function(){var a=this.__shady&&this.__shady.previousSibling;return void 0!==a?a:I.previousSibling(this)},configurable:!0},className:{get:function(){return this.getAttribute("class")||""},set:function(a){this.setAttribute("class",a)},configurable:!0},nextElementSibling:{get:function(){if(this.__shady&& -void 0!==this.__shady.nextSibling){for(var a=this.nextSibling;a&&a.nodeType!==Node.ELEMENT_NODE;)a=a.nextSibling;return a}return I.nextElementSibling(this)},configurable:!0},previousElementSibling:{get:function(){if(this.__shady&&void 0!==this.__shady.previousSibling){for(var a=this.previousSibling;a&&a.nodeType!==Node.ELEMENT_NODE;)a=a.previousSibling;return a}return I.previousElementSibling(this)},configurable:!0}},P={childNodes:{get:function(){var a;if(this.__shady&&void 0!==this.__shady.firstChild){if(!this.__shady.childNodes){this.__shady.childNodes= -[];for(var b=this.firstChild;b;b=b.nextSibling)this.__shady.childNodes.push(b)}a=this.__shady.childNodes}else a=I.childNodes(this);a.item=function(b){return a[b]};return a},configurable:!0},childElementCount:{get:function(){return this.children.length},configurable:!0},firstChild:{get:function(){var a=this.__shady&&this.__shady.firstChild;return void 0!==a?a:I.firstChild(this)},configurable:!0},lastChild:{get:function(){var a=this.__shady&&this.__shady.lastChild;return void 0!==a?a:I.lastChild(this)}, -configurable:!0},textContent:{get:function(){if(this.__shady&&void 0!==this.__shady.firstChild){for(var a=[],b=0,c=this.childNodes,d;d=c[b];b++)d.nodeType!==Node.COMMENT_NODE&&a.push(d.textContent);return a.join("")}return I.textContent(this)},set:function(a){if(this.nodeType!==Node.ELEMENT_NODE)this.nodeValue=a;else{for(;this.firstChild;)this.removeChild(this.firstChild);this.appendChild(document.createTextNode(a))}},configurable:!0},firstElementChild:{get:function(){if(this.__shady&&void 0!==this.__shady.firstChild){for(var a= -this.firstChild;a&&a.nodeType!==Node.ELEMENT_NODE;)a=a.nextSibling;return a}return I.firstElementChild(this)},configurable:!0},lastElementChild:{get:function(){if(this.__shady&&void 0!==this.__shady.lastChild){for(var a=this.lastChild;a&&a.nodeType!==Node.ELEMENT_NODE;)a=a.previousSibling;return a}return I.lastElementChild(this)},configurable:!0},children:{get:function(){var a;this.__shady&&void 0!==this.__shady.firstChild?a=Array.prototype.filter.call(this.childNodes,function(a){return a.nodeType=== -Node.ELEMENT_NODE}):a=I.children(this);a.item=function(b){return a[b]};return a},configurable:!0},innerHTML:{get:function(){var a="template"===this.localName?this.content:this;return this.__shady&&void 0!==this.__shady.firstChild?H(a):I.innerHTML(a)},set:function(a){for(var b="template"===this.localName?this.content:this;b.firstChild;)b.removeChild(b.firstChild);for(M&&M.set?M.set.call(N,a):N.innerHTML=a;N.firstChild;)b.appendChild(N.firstChild)},configurable:!0}},pa={shadowRoot:{get:function(){return this.__shady&& -this.__shady.root||null},set:function(a){this.__shady=this.__shady||{};this.__shady.root=a},configurable:!0}},Q={activeElement:{get:function(){var a;a=O&&O.get?O.get.call(document):p.g?void 0:document.activeElement;if(a&&a.nodeType){var b=!!u(this);if(this===document||b&&this.host!==a&&this.host.contains(a)){for(b=v(a);b&&b!==this;)a=b.host,b=v(a);a=this===document?b?null:a:b===this?a:null}else a=null}else a=null;return a},set:function(){},configurable:!0}}; -function R(a,b,c){for(var d in b){var e=Object.getOwnPropertyDescriptor(a,d);e&&e.configurable||!e&&c?Object.defineProperty(a,d,b[d]):c&&console.warn("Could not define",d,"on",a)}}function S(a){R(a,oa);R(a,P);R(a,Q)}var qa=p.g?function(){}:function(a){a.__shady&&a.__shady.N||(a.__shady=a.__shady||{},a.__shady.N=!0,R(a,oa,!0))},ra=p.g?function(){}:function(a){a.__shady&&a.__shady.L||(a.__shady=a.__shady||{},a.__shady.L=!0,R(a,P,!0),R(a,pa,!0))};function sa(a,b,c){qa(a);c=c||null;a.__shady=a.__shady||{};b.__shady=b.__shady||{};c&&(c.__shady=c.__shady||{});a.__shady.previousSibling=c?c.__shady.previousSibling:b.lastChild;var d=a.__shady.previousSibling;d&&d.__shady&&(d.__shady.nextSibling=a);(d=a.__shady.nextSibling=c)&&d.__shady&&(d.__shady.previousSibling=a);a.__shady.parentNode=b;c?c===b.__shady.firstChild&&(b.__shady.firstChild=a):(b.__shady.lastChild=a,b.__shady.firstChild||(b.__shady.firstChild=a));b.__shady.childNodes=null} -function T(a){if(!a.__shady||void 0===a.__shady.firstChild){a.__shady=a.__shady||{};a.__shady.firstChild=I.firstChild(a);a.__shady.lastChild=I.lastChild(a);ra(a);for(var b=a.__shady.childNodes=I.childNodes(a),c=0,d;c
    • +
  • + + + Color palettes + +
    • +
  • diff --git a/public/patterns/code/codepen-embedding/index.html b/public/patterns/code/codepen-embedding/index.html index 1b47406..9fb9d9a 100644 --- a/public/patterns/code/codepen-embedding/index.html +++ b/public/patterns/code/codepen-embedding/index.html @@ -157,6 +157,13 @@
    • +
  • + + + Color palettes + +
    • +
  • @@ -241,6 +248,8 @@ + + diff --git a/public/patterns/project-setup/index.html b/public/patterns/code/color-palettes/index.html similarity index 52% rename from public/patterns/project-setup/index.html rename to public/patterns/code/color-palettes/index.html index 38d82b0..b665a5f 100644 --- a/public/patterns/project-setup/index.html +++ b/public/patterns/code/color-palettes/index.html @@ -4,18 +4,19 @@ - + - - + + - Library setup | Infusion + Color palettes | Infusion + skip to content @@ -56,39 +57,37 @@
    -

    Documentation for the Infusion pattern library builder. This documentation is constructed using the builder itself.

    -
    - + - + diff --git a/public/patterns/code/index.html b/public/patterns/code/index.html index 81e04f0..1635fcb 100644 --- a/public/patterns/code/index.html +++ b/public/patterns/code/index.html @@ -157,6 +157,13 @@
    • +
  • + + + Color palettes + +
    • +
  • @@ -203,6 +210,16 @@
    • +
  • +

    + + + Color palettes + +

    +
    • + +

  • diff --git a/public/patterns/code/index.xml b/public/patterns/code/index.xml index effca78..0f16b19 100644 --- a/public/patterns/code/index.xml +++ b/public/patterns/code/index.xml @@ -33,6 +33,16 @@ Infusion offers a couple of ways to do this. The first is by embedding CodePen d &#x7b;{% codePen VpVNKW %}} This will embed the identified codePen into the content wherever you placed the shortcode, with the result view showing by default: + + Color palettes + https://heydon.github.io/infusion/patterns/code/color-palettes/ + Mon, 01 Jan 0001 00:00:00 +0000 + + https://heydon.github.io/infusion/patterns/code/color-palettes/ + There&rsquo;s no reason why your Infusion-powered pattern library has to be all about functionality. You can include style guide-like information such as color palettes too. The colors shortcode makes it easy to exhibit colors and their values together. Just supply a comma-separated list of CSS color values. +&#x7b;{% colors "#111111, #cccccc, #ffffff" %}} The result is a one row strip showing each color supplied in order. The colors for Infusion are greyscale: + + Writing inline demos https://heydon.github.io/infusion/patterns/code/writing-inline-demos/ diff --git a/public/patterns/code/writing-inline-demos/index.html b/public/patterns/code/writing-inline-demos/index.html index dc7de8a..4d7cc85 100644 --- a/public/patterns/code/writing-inline-demos/index.html +++ b/public/patterns/code/writing-inline-demos/index.html @@ -157,6 +157,13 @@

    • +
  • + + + Color palettes + +
    • +
  • @@ -216,6 +223,8 @@ + + diff --git a/public/patterns/example1/index.html b/public/patterns/example1/index.html deleted file mode 100644 index c507ef8..0000000 --- a/public/patterns/example1/index.html +++ /dev/null @@ -1,164 +0,0 @@ - - - - - - - - - - - - - - Collapsible region | Inclusive Pattern Docs - - - - - - - - - - - - - W3C - SVG - - - - - - - - - - - - - -
    - -
    -
    - -
    -

    Collapsible region

    - -
    - - -
    - -

    Nulla auctor eleifend turpis consequat pharetra: Cras molestie risus a enim convallis vitae luctus libero lacinia. Aliquam nisl enim, tristique tempus placerat at, posuere in lectus. Nulla auctor eleifend turpis consequat pharetra. Sed mauris arcu, aliquet ultrices malesuada sed, pretium id CTRL + V massa. Fusce ac sodales magna.

    - -

    Nulla auctor eleifend turpis consequat pharetra: Sed dapibus, lectus sit amet adipiscing egestas, mauris est viverra nibh (iaculis pretium sem orci aliquet mauris). Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Duis sagittis, est sit amet gravida tristique, purus lectus venenatis urna, id molestie magna risus ut nunc. Aliquam tincidunt velit sit amet ante hendrerit tempus. Vestibulum text-align : justify lacus. Donec et nisi dictum felis sollicitudin congue. Aliquam nisl enim, tristique tempus placerat at, posuere in lectus.

    - -
    - -
    - By Heydon Pickering -
    -
    -
    -
    - - - - - - diff --git a/public/patterns/example2/index.html b/public/patterns/example2/index.html deleted file mode 100644 index 556eb43..0000000 --- a/public/patterns/example2/index.html +++ /dev/null @@ -1,164 +0,0 @@ - - - - - - - - - - - - - - Tab interface | Inclusive Pattern Docs - - - - - - - - - - - - - W3C - SVG - - - - - - - - - - - - - -
    - -
    -
    - -
    -

    Tab interface

    - -
    - - -
    - -

    Vestibulum sit amet ipsum lacus… Nulla lobortis tempus commodo. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Sed dapibus, lectus sit amet adipiscing egestas, mauris est viverra nibh, iaculis pretium sem orci aliquet mauris.

    - -

    Sed mauris arcu, aliquet ultrices malesuada sed, pretium id CTRL + V massa. Nulla lobortis tempus commodo. Nulla vel magna sit — amet dui lobortis commodo — vitae vel nulla. Lorem ipsum dolor sit amet, — consectetur adipiscing — elit. Nulla lobortis tempus commodo.

    - -
    - -
    - By Heydon Pickering -
    -
    -
    -
    - - - - - - diff --git a/public/patterns/index.html b/public/patterns/index.html index 663ff00..eede1f5 100644 --- a/public/patterns/index.html +++ b/public/patterns/index.html @@ -157,6 +157,13 @@
    • +
  • + + + Color palettes + +
    • +
  • diff --git a/public/patterns/installation/index.html b/public/patterns/installation/index.html index ea588ef..03ace9e 100644 --- a/public/patterns/installation/index.html +++ b/public/patterns/installation/index.html @@ -157,6 +157,13 @@
    • +
  • + + + Color palettes + +
    • +
  • @@ -261,6 +268,8 @@ + + diff --git a/public/patterns/landmarks/example-one/index.html b/public/patterns/landmarks/example-one/index.html deleted file mode 100644 index fb31845..0000000 --- a/public/patterns/landmarks/example-one/index.html +++ /dev/null @@ -1,310 +0,0 @@ - - - - - - - - - - - - - - Page region navigation landmark | Inclusive Pattern Docs - - - - - - - - - - - - - W3C - SVG - - - - - - - - - - - - - -
    - -
    -
    - -
    -

    Page region navigation landmark

    - -

    Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Donec a congue leo.

    - - - - - -
      - - - - - - - - - - - - - - -
    • - Add value: Consider the value of features and how they improve the experience for different users. - -
      • - - -
    - - -

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. Donec tempus tempus tellus, ac HTML lacinia turpis mattis ac. Suspendisse potenti. Nunc iaculis risus vel orci ornare dignissim sed vitae nulla. Donec a congue leo? Fusce ac sodales CSS magna.

    - -

    - - -

      - - -
    • - - - 1.1.1 Non-text Content (level A) - - - -
      • - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    -

    - -
    - -
    - By Heydon Pickering -
    -
    -
    -
    - - - - - - diff --git a/public/patterns/landmarks/example2/index.html b/public/patterns/landmarks/example2/index.html deleted file mode 100644 index 4edafe9..0000000 --- a/public/patterns/landmarks/example2/index.html +++ /dev/null @@ -1,453 +0,0 @@ - - - - - - - - - - - - - - Footer | Inclusive Pattern Docs - - - - - - - - - - - - - W3C - SVG - - - - - - - - - - - - - -
    - -
    -
    - -
    -

    Footer

    - - - -

    Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Donec a congue leo.

    - - - - - - -

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. Donec tempus tempus tellus, ac HTML lacinia turpis mattis ac. Suspendisse potenti. Nunc iaculis risus vel orci ornare dignissim sed vitae nulla. Donec a congue leo? Fusce ac sodales CSS magna.

    - -

    Link to widgets example 1

    - -

    Figure example

    - - -
    -

    I LOVE FASCISM!?

    - -
    - You are wrong. -
    -
    - - -

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. Donec tempus tempus tellus, ac HTML lacinia turpis mattis ac. Suspendisse potenti. Nunc iaculis risus vel orci ornare dignissim sed vitae nulla. Donec a congue leo? Fusce ac sodales CSS magna.

    - - -
    -

    I HATE FASCISM!?

    - -
    - This is good news. -
    -
    - - -

    Code block example

    - -
    
-  .expandable + .expandable {
-    margin-top: 1.5rem;
-    padding-top: 1.5rem;
-    border-top: 2px solid;
-  }
-
    - - -

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. Donec tempus tempus tellus, ac HTML lacinia turpis mattis ac. Suspendisse potenti. Nunc iaculis risus vel orci ornare dignissim sed vitae nulla. Donec a congue leo? Fusce ac sodales CSS magna.

    - -

    External refs examples

    - -

    WCAG

    - - - - -
      - - -
    • - - - 1.1.1 Non-text Content (level A) - : - - - All non-text content that is presented to the user has a text alternative that serves the equivalent purpose, except for the situations listed below. ( - -
        - -
      • Controls, Input: - If non-text content is a control or accepts user input, then it has a name that describes its purpose. (Refer to Guideline 4.1 for additional requirements for controls and content that accepts user input.) -
        • - -
      • Time-Based Media: - If non-text content is time-based media, then text alternatives at least provide descriptive identification of the non-text content. (Refer to Guideline 1.2 for additional requirements for media.) -
        • - -
      • Test: - If non-text content is a test or exercise that would be invalid if presented in text, then text alternatives at least provide descriptive identification of the non-text content. -
        • - -
      • Sensory: - If non-text content is primarily intended to create a specific sensory experience, then text alternatives at least provide descriptive identification of the non-text content. -
        • - -
      • CAPTCHA: - If the purpose of non-text content is to confirm that content is being accessed by a person rather than a computer, then text alternatives that identify and describe the purpose of the non-text content are provided, and alternative forms of CAPTCHA using output modes for different types of sensory perception are provided to accommodate different disabilities. -
        • - -
      • Decoration, Formatting, Invisible: - If non-text content is pure decoration, is used only for visual formatting, or is not presented to users, then it is implemented in a way that it can be ignored by assistive technology. -
        • - -
      - - -
      • - - - - - - - - - - - - - - - - - - - - - -
    • - - - 1.3.1 Info and Relationships (level A) - : - - - Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text. - - -
      • - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    • - - - 4.1.2 Name, Role, Value (level A) - : - - - For all user interface components (including but not limited to: form elements, links and components generated by scripts), the name and role can be programmatically determined; states, properties, and values that can be set by the user can be programmatically set; and notification of changes to these items is available to user agents, including assistive technologies. - - -
      • - - -
    - - -

    Inclusive Design Principles

    - -

    - - - -

      - - - - - - -
    • - Be consistent: Use familiar conventions and apply them consistently. - -

      Familiar interfaces borrow from well-established patterns. These should be used consistently within the interface to reinforce their meaning and purpose. This should be applied to functionality, behavior, editorial, and presentation. You should say the same things in the same way and users should be able to do the same things in the same way.

      - -
      • - - - - - - - - - -
    • - Add value: Consider the value of features and how they improve the experience for different users. - -

      Features should add value to the user experience by providing efficient and diverse ways to find and interact with content. Consider device features such as voice, geolocation, camera and vibration API's, and how integration with connected devices or a second screen could provide choice.

      - -
      • - - -
    -

    - -
    - -

    - - - -

    - - -
    - - -
    - -
    - By Heydon Pickering -
    -
    -
    -
    - - - - - - diff --git a/public/patterns/landmarks/index.html b/public/patterns/landmarks/index.html deleted file mode 100644 index 29e74b2..0000000 --- a/public/patterns/landmarks/index.html +++ /dev/null @@ -1,165 +0,0 @@ - - - - - - - - - - - - - - Landmarks | Inclusive Pattern Docs - - - - - - - - - - - - - W3C - SVG - - - - - - - - - - - - - -
    - -
    -
    - -
    -

    - - - Landmarks -

    - -
    - -
    - By Heydon Pickering -
    -
    -
    -
    - - - - - - diff --git a/public/patterns/landmarks/index.xml b/public/patterns/landmarks/index.xml deleted file mode 100644 index 495fa8e..0000000 --- a/public/patterns/landmarks/index.xml +++ /dev/null @@ -1,34 +0,0 @@ - - - - Landmarks on Inclusive Pattern Docs - /patterns/landmarks/ - Recent content in Landmarks on Inclusive Pattern Docs - Hugo -- gohugo.io - en-us - - - - - - Footer - /patterns/landmarks/example2/ - Mon, 01 Jan 0001 00:00:00 +0000 - - /patterns/landmarks/example2/ - Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Donec a congue leo. - See the demo on codePen Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. - - - - Page region navigation landmark - /patterns/landmarks/example-one/ - Mon, 01 Jan 0001 00:00:00 +0000 - - /patterns/landmarks/example-one/ - Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Donec a congue leo. - Add value: Consider the value of features and how they improve the experience for different users. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. - - - - \ No newline at end of file diff --git a/public/patterns/library-setup/index.html b/public/patterns/library-setup/index.html index 904f8dd..78bb79f 100644 --- a/public/patterns/library-setup/index.html +++ b/public/patterns/library-setup/index.html @@ -157,6 +157,13 @@
    • +
  • + + + Color palettes + +
    • +
  • @@ -200,6 +207,8 @@ + + @@ -277,6 +286,8 @@ + + @@ -354,6 +365,8 @@ theme = "infusion" + + @@ -387,6 +400,8 @@ theme = "infusion" + + diff --git a/public/patterns/serving/index.html b/public/patterns/serving/index.html index 8fa47d2..33b5470 100644 --- a/public/patterns/serving/index.html +++ b/public/patterns/serving/index.html @@ -157,6 +157,13 @@
    • +
  • + + + Color palettes + +
    • +
  • diff --git a/public/patterns/widgets/example1/index.html b/public/patterns/widgets/example1/index.html deleted file mode 100644 index 1f15841..0000000 --- a/public/patterns/widgets/example1/index.html +++ /dev/null @@ -1,145 +0,0 @@ - - - - - - - - - - - - - - Card | Inclusive Pattern Docs - - - - - - - - - - - - - W3C - SVG - - - - - - - - - - - - - -
    - -
    -
    - -
    -

    Card

    - -

    Duis sagittis, est sit amet gravida tristique, purus lectus venenatis urna, id molestie magna risus ut nunc. Maecenas sit amet tellus – nec mi gravida posuere non pretium magna. Potenti et eros sed justo commodo bibendum non at nunc. Aliquam nisl enim… tristique tempus placerat at, posuere in lectus. Nulla lobortis tempus commodo. Aliquam nisl enim, tristique tempus placerat at, posuere in lectus.

    - -

    Fusce ac sodales CSS magna. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Donec et nisi dictum felis sollicitudin congue. Donec tempus tempus tellus, ac lacinia turpis mattis ac. Aliquam tincidunt velit sit amet ante hendrerit tempus.

    - -

    Aliquam tincidunt velit sit (amet ante hendrerit tempus). Aliquam nisl enim, tristique tempus placerat at, posuere in lectus. Donec tempus tempus tellus, ac HTML lacinia turpis mattis ac. Aliquam tincidunt velit sit amet ante hendrerit tempus. Curabitur consectetur faucibus nisl ac varius. Donec et nisi dictum felis, sollicitudin, congue Heydon™. Nulla auctor eleifend turpis consequat pharetra. Donec et nisi dictum felis sollicitudin congue.

    - -
    - -
    - By Heydon Pickering -
    -
    -
    -
    - - - - - - diff --git a/public/patterns/widgets/example2/index.html b/public/patterns/widgets/example2/index.html deleted file mode 100644 index 2818491..0000000 --- a/public/patterns/widgets/example2/index.html +++ /dev/null @@ -1,403 +0,0 @@ - - - - - - - - - - - - - - Menu button and menu | Inclusive Pattern Docs - - - - - - - - - - - - - W3C - SVG - - - - - - - - - - - - - -
    - -
    -
    - -
    -

    Menu button and menu

    - -
    - - -
    - -

    Duis sagittis, est sit amet gravida tristique, purus lectus venenatis urna - - - - - - - - - - - - - - - - - - - - - - - Menu button and menu - - - - - - - - - - - - - - - - - -, id molestie magna risus ut nunc. Fusce ac sodales CSS magna. Nulla auctor eleifend turpis consequat pharetra. Sed dapibus, lectus sit amet adipiscing egestas, mauris est viverra nibh, iaculis pretium sem orci aliquet mauris.

    - - -
    - -
    - - - - -
    - - -
    
-  .expandable + .expandable {
-    margin-top: 1.5rem;
-    padding-top: 1.5rem;
-    border-top: 2px solid;
-  }
-
-  .expandable + .expandable {
-    margin-top: 1.5rem;
-    padding-top: 1.5rem;
-    border-top: 2px solid;
-  }
-
    - - -
    {{ .Inner }}
-
    - -

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce ac sodales .generate() magna. Aliquam tincidunt velit sit amet ante hendrerit tempus. Donec et nisi dictum felis sollicitudin congue.

    - - -
    - -
    - -
    - -
    Example caption
    - - -
    - - - -
    - - -

    Nulla vel magna sit — amet dui lobortis commodo — vitae vel nulla. Nulla lobortis tempus commodo.

    - - -
    - -
    - - - - -
    - - -
    -
      -
    • Something good
      • -
    • Something else good
      • -
    • Another great thing
      • -
    - -
    - - -

    Donec et nisi dictum felis sollicitudin congue. Potenti et eros sed justo commodo bibendum non at nunc. Nulla lobortis tempus commodo. Duis sagittis, est sit amet gravida tristique, purus lectus venenatis urna, id molestie magna risus ut nunc. Donec tempus tempus tellus, ac lacinia turpis mattis ac! Fusce ac sodales magna …

    - - - - -

    Donec et nisi dictum felis sollicitudin congue. Potenti et eros sed justo commodo bibendum non at nunc. Nulla lobortis tempus commodo. Duis sagittis, est sit amet gravida tristique, purus lectus venenatis urna, id molestie magna risus ut nunc. Donec tempus tempus tellus, ac lacinia turpis mattis ac! Fusce ac sodales magna …

    - - - - -
    - -
    - By Heydon Pickering -
    -
    -
    -
    - - - - - - diff --git a/public/patterns/widgets/index.html b/public/patterns/widgets/index.html deleted file mode 100644 index bf9afd4..0000000 --- a/public/patterns/widgets/index.html +++ /dev/null @@ -1,165 +0,0 @@ - - - - - - - - - - - - - - Widgets | Inclusive Pattern Docs - - - - - - - - - - - - - W3C - SVG - - - - - - - - - - - - - -
    - -
    -
    - -
    -

    - - - Widgets -

    - -
    - -
    - By Heydon Pickering -
    -
    -
    -
    - - - - - - diff --git a/public/patterns/widgets/index.xml b/public/patterns/widgets/index.xml deleted file mode 100644 index 0e0bbcd..0000000 --- a/public/patterns/widgets/index.xml +++ /dev/null @@ -1,33 +0,0 @@ - - - - Widgets on Inclusive Pattern Docs - /patterns/widgets/ - Recent content in Widgets on Inclusive Pattern Docs - Hugo -- gohugo.io - en-us - - - - - - Card - /patterns/widgets/example1/ - Mon, 01 Jan 0001 00:00:00 +0000 - - /patterns/widgets/example1/ - Duis sagittis, est sit amet gravida tristique, purus lectus venenatis urna, id molestie magna risus ut nunc. Maecenas sit amet tellus &ndash; nec mi gravida posuere non pretium magna. Potenti et eros sed justo commodo bibendum non at nunc. Aliquam nisl enim&hellip; tristique tempus placerat at, posuere in lectus. Nulla lobortis tempus commodo. Aliquam nisl enim, tristique tempus placerat at, posuere in lectus. Fusce ac sodales CSS magna. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. - - - - Menu button and menu - /patterns/widgets/example2/ - Mon, 01 Jan 0001 00:00:00 +0000 - - /patterns/widgets/example2/ - Duis sagittis, est sit amet gravida tristique, purus lectus venenatis urna Menu button and menu , id molestie magna risus ut nunc. Fusce ac sodales CSS magna. Nulla auctor eleifend turpis consequat pharetra. Sed dapibus, lectus sit amet adipiscing egestas, mauris est viverra nibh, iaculis pretium sem orci aliquet mauris. - Press button { background: blue; color: white; border: 0; padding: 0.5rem 1rem; text-transform: uppercase; } [aria-pressed=" - - - - \ No newline at end of file diff --git a/public/patterns/writing/expandable-sections/index.html b/public/patterns/writing/expandable-sections/index.html index 6055e40..b425f6c 100644 --- a/public/patterns/writing/expandable-sections/index.html +++ b/public/patterns/writing/expandable-sections/index.html @@ -157,6 +157,13 @@
    • +
  • + + + Color palettes + +
    • +
  • diff --git a/public/patterns/writing/including-images/index.html b/public/patterns/writing/including-images/index.html index bccc830..2a0adbc 100644 --- a/public/patterns/writing/including-images/index.html +++ b/public/patterns/writing/including-images/index.html @@ -157,6 +157,13 @@
    • +
  • + + + Color palettes + +
    • +
  • diff --git a/public/patterns/writing/index.html b/public/patterns/writing/index.html index 685bec2..f2022ab 100644 --- a/public/patterns/writing/index.html +++ b/public/patterns/writing/index.html @@ -157,6 +157,13 @@
    • +
  • + + + Color palettes + +
    • +
  • diff --git a/public/patterns/writing/library-structure/index.html b/public/patterns/writing/library-structure/index.html index d7e539d..ce2a333 100644 --- a/public/patterns/writing/library-structure/index.html +++ b/public/patterns/writing/library-structure/index.html @@ -157,6 +157,13 @@
    • +
  • + + + Color palettes + +
    • +
  • @@ -266,6 +273,8 @@ title = "Popups" + + diff --git a/public/patterns/writing/markdown-and-metadata/index.html b/public/patterns/writing/markdown-and-metadata/index.html index 533cd3b..5f918e4 100644 --- a/public/patterns/writing/markdown-and-metadata/index.html +++ b/public/patterns/writing/markdown-and-metadata/index.html @@ -157,6 +157,13 @@
    • +
  • + + + Color palettes + +
    • +
  • diff --git a/public/patterns/writing/notes-and-warnings/index.html b/public/patterns/writing/notes-and-warnings/index.html index cab0da3..4fff0f0 100644 --- a/public/patterns/writing/notes-and-warnings/index.html +++ b/public/patterns/writing/notes-and-warnings/index.html @@ -157,6 +157,13 @@
    • +
  • + + + Color palettes + +
    • +
  • diff --git a/public/patterns/writing/references/index.html b/public/patterns/writing/references/index.html index a4f104c..14d9577 100644 --- a/public/patterns/writing/references/index.html +++ b/public/patterns/writing/references/index.html @@ -157,6 +157,13 @@
    • +
  • + + + Color palettes + +
    • +
  • @@ -206,6 +213,8 @@ + + diff --git a/public/sitemap.xml b/public/sitemap.xml index 40fd83a..27a73c0 100644 --- a/public/sitemap.xml +++ b/public/sitemap.xml @@ -36,6 +36,10 @@ https://heydon.github.io/infusion/patterns/code/codepen-embedding/ + + https://heydon.github.io/infusion/patterns/code/color-palettes/ + + https://heydon.github.io/infusion/patterns/code/ diff --git a/public/tags/animated/index.html b/public/tags/animated/index.html deleted file mode 100644 index 7c7a3ca..0000000 --- a/public/tags/animated/index.html +++ /dev/null @@ -1,177 +0,0 @@ - - - - - - - - - - - - - - Animated | Inclusive Pattern Docs - - - - - - - - - - - - - W3C - SVG - - - - - - - - - - - - - -
    - -
    -
    - -
    -

    - - - - - Animated -

    - -
    - -
    - By Heydon Pickering -
    -
    -
    -
    - - - - diff --git a/public/tags/animated/index.xml b/public/tags/animated/index.xml deleted file mode 100644 index 40eee3a..0000000 --- a/public/tags/animated/index.xml +++ /dev/null @@ -1,42 +0,0 @@ - - - - Animated on Inclusive Pattern Docs - /tags/animated/ - Recent content in Animated on Inclusive Pattern Docs - Hugo -- gohugo.io - en-us - - - - - - Collapsible region - /patterns/example1/ - Mon, 01 Jan 0001 00:00:00 +0000 - - /patterns/example1/ - Nulla auctor eleifend turpis consequat pharetra: Cras molestie risus a enim convallis vitae luctus libero lacinia. Aliquam nisl enim, tristique tempus placerat at, posuere in lectus. Nulla auctor eleifend turpis consequat pharetra. Sed mauris arcu, aliquet ultrices malesuada sed, pretium id CTRL + V massa. Fusce ac sodales magna. Nulla auctor eleifend turpis consequat pharetra: Sed dapibus, lectus sit amet adipiscing egestas, mauris est viverra nibh (iaculis pretium sem orci aliquet mauris). - - - - Menu button and menu - /patterns/widgets/example2/ - Mon, 01 Jan 0001 00:00:00 +0000 - - /patterns/widgets/example2/ - Duis sagittis, est sit amet gravida tristique, purus lectus venenatis urna Menu button and menu , id molestie magna risus ut nunc. Fusce ac sodales CSS magna. Nulla auctor eleifend turpis consequat pharetra. Sed dapibus, lectus sit amet adipiscing egestas, mauris est viverra nibh, iaculis pretium sem orci aliquet mauris. - Press button { background: blue; color: white; border: 0; padding: 0.5rem 1rem; text-transform: uppercase; } [aria-pressed=" - - - - Tab interface - /patterns/example2/ - Mon, 01 Jan 0001 00:00:00 +0000 - - /patterns/example2/ - Vestibulum sit amet ipsum lacus&hellip; Nulla lobortis tempus commodo. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Sed dapibus, lectus sit amet adipiscing egestas, mauris est viverra nibh, iaculis pretium sem orci aliquet mauris. Sed mauris arcu, aliquet ultrices malesuada sed, pretium id CTRL + V massa. Nulla lobortis tempus commodo. Nulla vel magna sit &mdash; amet dui lobortis commodo &mdash; vitae vel nulla. Lorem ipsum dolor sit amet, &mdash; consectetur adipiscing &mdash; elit. - - - - \ No newline at end of file diff --git a/public/tags/forms/index.html b/public/tags/forms/index.html deleted file mode 100644 index cf48b9c..0000000 --- a/public/tags/forms/index.html +++ /dev/null @@ -1,157 +0,0 @@ - - - - - - - - - - - - - - Forms | Inclusive Pattern Docs - - - - - - - - - - - - - W3C - SVG - - - - - - - - - - - - - -
    - -
    -
    - -
    -

    - - - - - Forms -

    - -
    - -
    - By Heydon Pickering -
    -
    -
    -
    - - - - diff --git a/public/tags/forms/index.xml b/public/tags/forms/index.xml deleted file mode 100644 index bd5003a..0000000 --- a/public/tags/forms/index.xml +++ /dev/null @@ -1,23 +0,0 @@ - - - - Forms on Inclusive Pattern Docs - /tags/forms/ - Recent content in Forms on Inclusive Pattern Docs - Hugo -- gohugo.io - en-us - - - - - - Collapsible region - /patterns/example1/ - Mon, 01 Jan 0001 00:00:00 +0000 - - /patterns/example1/ - Nulla auctor eleifend turpis consequat pharetra: Cras molestie risus a enim convallis vitae luctus libero lacinia. Aliquam nisl enim, tristique tempus placerat at, posuere in lectus. Nulla auctor eleifend turpis consequat pharetra. Sed mauris arcu, aliquet ultrices malesuada sed, pretium id CTRL + V massa. Fusce ac sodales magna. Nulla auctor eleifend turpis consequat pharetra: Sed dapibus, lectus sit amet adipiscing egestas, mauris est viverra nibh (iaculis pretium sem orci aliquet mauris). - - - - \ No newline at end of file diff --git a/public/tags/interactive/index.html b/public/tags/interactive/index.html deleted file mode 100644 index 78835aa..0000000 --- a/public/tags/interactive/index.html +++ /dev/null @@ -1,157 +0,0 @@ - - - - - - - - - - - - - - Interactive | Inclusive Pattern Docs - - - - - - - - - - - - - W3C - SVG - - - - - - - - - - - - - -
    - -
    -
    - -
    -

    - - - - - Interactive -

    - -
    - -
    - By Heydon Pickering -
    -
    -
    -
    - - - - diff --git a/public/tags/interactive/index.xml b/public/tags/interactive/index.xml deleted file mode 100644 index a6a73b1..0000000 --- a/public/tags/interactive/index.xml +++ /dev/null @@ -1,24 +0,0 @@ - - - - Interactive on Inclusive Pattern Docs - /tags/interactive/ - Recent content in Interactive on Inclusive Pattern Docs - Hugo -- gohugo.io - en-us - - - - - - Menu button and menu - /patterns/widgets/example2/ - Mon, 01 Jan 0001 00:00:00 +0000 - - /patterns/widgets/example2/ - Duis sagittis, est sit amet gravida tristique, purus lectus venenatis urna Menu button and menu , id molestie magna risus ut nunc. Fusce ac sodales CSS magna. Nulla auctor eleifend turpis consequat pharetra. Sed dapibus, lectus sit amet adipiscing egestas, mauris est viverra nibh, iaculis pretium sem orci aliquet mauris. - Press button { background: blue; color: white; border: 0; padding: 0.5rem 1rem; text-transform: uppercase; } [aria-pressed=" - - - - \ No newline at end of file diff --git a/public/tags/typography/index.html b/public/tags/typography/index.html deleted file mode 100644 index 2d1d662..0000000 --- a/public/tags/typography/index.html +++ /dev/null @@ -1,157 +0,0 @@ - - - - - - - - - - - - - - Typography | Inclusive Pattern Docs - - - - - - - - - - - - - W3C - SVG - - - - - - - - - - - - - -
    - -
    -
    - -
    -

    - - - - - Typography -

    - -
    - -
    - By Heydon Pickering -
    -
    -
    -
    - - - - diff --git a/public/tags/typography/index.xml b/public/tags/typography/index.xml deleted file mode 100644 index b27e235..0000000 --- a/public/tags/typography/index.xml +++ /dev/null @@ -1,23 +0,0 @@ - - - - Typography on Inclusive Pattern Docs - /tags/typography/ - Recent content in Typography on Inclusive Pattern Docs - Hugo -- gohugo.io - en-us - - - - - - Tab interface - /patterns/example2/ - Mon, 01 Jan 0001 00:00:00 +0000 - - /patterns/example2/ - Vestibulum sit amet ipsum lacus&hellip; Nulla lobortis tempus commodo. Maecenas sit amet tellus nec mi gravida posuere non pretium magna. Sed dapibus, lectus sit amet adipiscing egestas, mauris est viverra nibh, iaculis pretium sem orci aliquet mauris. Sed mauris arcu, aliquet ultrices malesuada sed, pretium id CTRL + V massa. Nulla lobortis tempus commodo. Nulla vel magna sit &mdash; amet dui lobortis commodo &mdash; vitae vel nulla. Lorem ipsum dolor sit amet, &mdash; consectetur adipiscing &mdash; elit. - - - - \ No newline at end of file