mp-design-system 0.8.0 → 0.8.6

package/src/index.njk

@@ -1,9 +1,9 @@
 ---
 title: "Welcome"
-subtitle: Our design system helps us create consistent experiences across all our digital properties and beyond. It also makes the design and development process faster, more efficient and scalable.
+subtitle: Our design system helps us create consistent experiences across our websites and beyond. It also makes the design and development process faster, more efficient and scalable.
 layout: system-home-page
 renderData:
-  title: "Welcome to the Malvern Panalytical design system"
+  title: "Welcome to the Project Franklin design system"
 ---
 
 {% from "components/prose/macro.njk" import markdown %}
@@ -14,7 +14,7 @@ renderData:
   {{ card({
     theme: {
       layout: 'single',
-      size: 'medium',
+      size: 'large',
       border: true
     },
     header: {
@@ -34,7 +34,7 @@ renderData:
   {{ card({
     theme: {
       layout: 'single',
-      size: 'medium',
+      size: 'large',
       border: true
     },
     header: {
@@ -54,7 +54,7 @@ renderData:
   {{ card({
     theme: {
       layout: 'single',
-      size: 'medium',
+      size: 'large',
       border: true
     },
     header: {
@@ -73,9 +73,15 @@ renderData:
 </div>
 
 {% set content %}
+## Latest
+##### V.{{ config.dsVersion }} - Jul 15 2022
+
+- Add simple logo variant to logo downloads
+- Misc. library improvements
+
 ## A living resource for everyone
 
-As we've grown, our experiences have become disparate and inconsistent. The goal of this design system is to address this by creating a single source of truth. It will rely on us all using and contributing to it, with the ongoing support of the Design System Team.
+As Malvern Panalytical has grown, our online experiences have become disparate and inconsistent. The goal of this design system is to address this by creating a single source of truth. It will rely on us all using and contributing to it, with the ongoing support of the Design System Team.
 {% endset %}
 
 {{ markdown({

package/src/patterns/form.njk

@@ -122,6 +122,14 @@ layout: patterns-page
                     type: 'number',
                     placeholder: 'Placeholder'
                 })}}
+
+                {{ input({
+                    label: 'File',
+                    name: 'file_input',
+                    id: 'file_input',
+                    type: 'file',
+                    classes: 'c-input--file'
+                })}}
                 
                 {{ input({
                     label: 'Range',

package/src/static/svg/logo-simple.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" id="Layer_1" x="0" y="0" version="1.1" viewBox="0 0 298.1 117.2"><style>.st2{fill:#5bb570}</style><path fill="#313530" d="M122.9 55.2h-4.3v-22h5.5l6.2 14.3h.3l6.2-14.3h5.5v22H138V41.7h-.2l-5.7 13.5H129l-5.7-13.5h-.2v13.5zm40.1 0v-21l4.5-1.1v22.1H163zm6.4-17.1h4.8l3.5 12.7h.3l3.5-12.7h4.7l-5.9 17h-5.1l-5.8-17zm29 12.2h4.2c-.3 1.6-1.2 2.9-2.6 3.8-1.4.9-3.1 1.4-5.2 1.4-2.6 0-4.6-.8-6.1-2.3-1.5-1.5-2.2-3.7-2.2-6.5s.7-5 2.2-6.6c1.5-1.6 3.5-2.4 6-2.4s4.5.8 5.9 2.3c1.4 1.5 2.1 3.6 2.1 6.3v1.4H191v.3c0 1.3.4 2.3 1.1 3 .7.7 1.6 1.1 2.8 1.1.9 0 1.6-.2 2.2-.5.6-.3 1-.7 1.3-1.3zm-3.7-9.1c-1 0-1.9.3-2.6 1-.7.7-1.1 1.6-1.1 2.7h7.3c-.1-1.1-.4-2-1-2.7-.7-.7-1.5-1-2.6-1zm10.6 14v-17h4.4v2.7h.3c.2-.9.7-1.6 1.5-2.1.8-.6 1.7-.8 2.8-.8.8 0 1.3.1 1.7.2v4.1c-.2-.1-.5-.1-.9-.2s-.8-.1-1.2-.1c-1.2 0-2.2.3-3 1-.8.7-1.1 1.6-1.1 2.8v9.4h-4.5zm13.1 0v-17h4.4v2.7h.3c.4-1 1.1-1.7 2-2.3.9-.6 2-.8 3.3-.8 1.9 0 3.4.6 4.4 1.7 1 1.1 1.6 2.7 1.6 4.7v11h-4.5v-9.9c0-1.2-.3-2.1-.8-2.7-.6-.6-1.4-.9-2.4-.9-1.1 0-2 .3-2.7 1-.7.7-1 1.6-1 2.7v9.8h-4.6zm-99.9 7.4h9.3c2.3 0 4.2.7 5.6 2.1 1.4 1.4 2.1 3.3 2.1 5.6s-.7 4.1-2.2 5.5c-1.5 1.4-3.4 2.1-5.7 2.1h-4.4v6.6h-4.7V62.6zm4.7 3.8v7.8h3.4c1.3 0 2.4-.3 3.1-1 .7-.7 1.1-1.6 1.1-2.9 0-1.3-.4-2.2-1.1-2.9-.7-.7-1.8-1-3.1-1h-3.4zm31.7 18.2v-17h4.4v2.7h.3c.4-1 1.1-1.7 2-2.3.9-.6 2-.8 3.3-.8 1.9 0 3.4.6 4.4 1.7 1 1.1 1.6 2.7 1.6 4.7v11h-4.5v-9.9c0-1.2-.3-2.1-.8-2.7-.6-.6-1.4-.9-2.4-.9-1.1 0-2 .3-2.7 1-.7.7-1 1.6-1 2.7v9.8h-4.6zm36.4 0v-21l4.5-1.1v22.1h-4.5zm9.7 6.2h-1.7v-3.6h1c.8 0 1.5-.1 2-.4.5-.3.8-.8 1-1.4l.2-.6-6-17.1h5l3.6 12.9h.3l3.6-12.9h4.8L208.9 85c-.7 2.2-1.7 3.7-2.8 4.6-1.3.8-2.9 1.2-5.1 1.2zm16.8-23.2v-4l4.5-1.2v5.2h3.6v3.7h-3.6V79c0 .7.2 1.3.5 1.6.4.4.9.5 1.7.5.5 0 .9 0 1.3-.1v3.4c-.7.1-1.4.2-2.2.2-2.1 0-3.6-.4-4.4-1.1-.9-.7-1.3-1.9-1.3-3.6v-8.7h-2l1.1-3.7h.8zm11.3 17v-17h4.5v17h-4.5zm0-18.6v-3.3h4.5V66h-4.5zm42.5 18.6v-21l4.5-1.1v22.1h-4.5zm-24.1-4.8c-.2.3-.4.6-.7.8-.6.4-1.3.7-2.3.7-1.2 0-2.1-.5-2.8-1.4-.7-.9-1-2.2-1-3.9 0-1.7.3-2.9 1-3.8.7-.9 1.6-1.3 2.8-1.3.9 0 1.7.2 2.3.7.2.2.4.4.6.7h4.5c-.3-1.4-1-2.5-2-3.4-1.3-1.1-3.1-1.7-5.3-1.7-2.7 0-4.7.8-6.2 2.3-1.4 1.5-2.2 3.7-2.2 6.6 0 2.9.7 5.1 2.2 6.6 1.4 1.6 3.5 2.3 6.2 2.3 2.2 0 4-.6 5.3-1.7 1.1-.9 1.8-2.1 2.1-3.5h-4.5zm-100.9-5.9h.6v-.2c0-2.3-1.4-3-3.3-3-2.5 0-4.7 1.6-4.7 1.6l-1.6-3.1s2.7-2.1 6.7-2.1c4.5 0 7.7 2.5 7.7 6.8v10.7h-4.5V82s-1.3 3-5.2 3c-3.1 0-5.8-1.9-5.8-5.3 0-5.5 7.3-5.8 10.1-5.8zm-3.2 7.8c2.3 0 3.9-2.4 3.9-4.5v-.4h-.7c-2.2 0-5.7.3-5.7 2.7-.1 1.1.7 2.2 2.5 2.2zm11.3-37.3h.6v-.2c0-2.3-1.4-3-3.3-3-2.5 0-4.7 1.6-4.7 1.6l-1.6-3.1s2.7-2.1 6.7-2.1c4.5 0 7.7 2.5 7.7 6.8v10.7h-4.5v-2.6s-1.3 3-5.2 3c-3.1 0-5.8-1.9-5.8-5.3 0-5.4 7.3-5.8 10.1-5.8zm-3.3 7.8c2.3 0 3.9-2.4 3.9-4.5v-.4h-.7c-2.2 0-5.7.3-5.7 2.7 0 1.2.8 2.2 2.5 2.2zm31.3 21.7h.6v-.2c0-2.3-1.4-3-3.3-3-2.5 0-4.7 1.6-4.7 1.6l-1.6-3.1s2.7-2.1 6.7-2.1c4.5 0 7.7 2.5 7.7 6.8v10.7h-4.5V82s-1.3 3-5.2 3c-3.1 0-5.8-1.9-5.8-5.3-.1-5.5 7.3-5.8 10.1-5.8zm-3.3 7.8c2.3 0 3.9-2.4 3.9-4.5v-.4h-.7c-2.2 0-5.7.3-5.7 2.7-.1 1.1.7 2.2 2.5 2.2zm84.2-7.8h.6v-.2c0-2.3-1.4-3-3.3-3-2.5 0-4.7 1.6-4.7 1.6l-1.6-3.1s2.7-2.1 6.7-2.1c4.5 0 7.7 2.5 7.7 6.8v10.7h-4.5V82s-1.3 3-5.2 3c-3.1 0-5.8-1.9-5.8-5.3-.1-5.5 7.3-5.8 10.1-5.8zm-3.3 7.8c2.3 0 3.9-2.4 3.9-4.5v-.4h-.7c-2.2 0-5.7.3-5.7 2.7-.1 1.1.8 2.2 2.5 2.2z"/><path fill="#006776" d="m55.7 58.5.9.9c.3.3.6.4 1 .4s.7-.1 1-.4l34.2-34.2c.5-.5.5-1.4 0-1.9l-.9-.9c-.5-.5-1.4-.5-1.9 0L55.7 56.6c-.6.5-.6 1.4 0 1.9zm5.2 5.3.9.9c.3.3.6.4 1 .4s.7-.1 1-.4l39.4-39.4c.5-.5.5-1.4 0-1.9l-.9-.9c-.5-.5-1.4-.5-1.9 0L60.9 61.8c-.5.5-.5 1.4 0 2zm5.2 5.2.9.9c.3.3.6.4 1 .4s.7-.1 1-.4l44.6-44.6c.5-.5.5-1.4 0-1.9l-.9-.9c-.5-.5-1.4-.5-1.9 0L66.1 67c-.5.6-.5 1.4 0 2z"/><path d="m49.8 62.5-.9.9c-.5.5-.5 1.4 0 1.9l11.3 11.3c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.3-.3.4-.6.4-1s-.1-.7-.4-1L51.7 62.5c-.5-.5-1.4-.5-1.9 0zm25.5 11.2c-.5-.5-1.4-.5-1.9 0l-.9.9c-.5.5-.5 1.4 0 1.9l18.2 18.2c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.5-.5.5-1.4 0-1.9L75.3 73.7zm-5.2 5.2c-.5-.5-1.4-.5-1.9 0l-.9.9c-.5.5-.5 1.4 0 1.9l13 13c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.3-.3.4-.6.4-1s-.1-.7-.4-1L70.1 78.9zm10.4-10.4c-.5-.5-1.4-.5-1.9 0l-.9.9c-.5.5-.5 1.4 0 1.9l23.5 23.5c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.5-.5.5-1.4 0-1.9L80.5 68.5zM114.4 92 85.8 63.3c-.5-.5-1.4-.5-1.9 0l-.9.9c-.5.5-.5 1.4 0 1.9l28.7 28.7c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.4-.5.4-1.4-.2-1.9z" class="st2"/><path fill="#0096b4" d="M60.2 42.2c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.5-.5.5-1.4 0-1.9l-17-16.9c-.5-.5-1.4-.5-1.9 0l-.9.9c-.5.5-.5 1.4 0 1.9l16.9 16.9zM55 47.4c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.5-.5.5-1.4 0-1.9L35.7 22.5c-.5-.5-1.4-.5-1.9 0l-.9.9c-.5.5-.5 1.4 0 1.9L55 47.4zM50.7 53c.4 0 .7-.1 1-.4l.9-.9c.5-.5.5-1.4 0-1.9L25.2 22.5c-.5-.5-1.4-.5-1.9 0l-.9.9c-.5.5-.5 1.4 0 1.9l27.3 27.3c.3.3.7.4 1 .4z"/><path d="M57.8 81c.5-.5.5-1.4 0-1.9L46.5 67.7c-.5-.5-1.4-.5-1.9 0l-.9.9c-.5.5-.5 1.4 0 1.9L55 81.8c.3.3.6.4 1 .4s.7-.1 1-.4l.8-.8zm-16.5-8.1c-.5-.5-1.4-.5-1.9 0l-.9.9c-.3.3-.4.6-.4 1s.1.7.4 1l11.3 11.3c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.5-.5.5-1.4 0-1.9L41.3 72.9zm23.6 11.3c-.5-.5-1.4-.5-1.9 0l-.9.8c-.5.5-.5 1.4 0 1.9l7.8 7.8c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.5-.5.5-1.4 0-1.9l-7.9-7.7zm-5.2 5.2c-.5-.5-1.4-.5-1.9 0l-.9.9c-.5.5-.5 1.4 0 1.9l2.6 2.6c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.5-.5.5-1.4 0-1.9l-2.7-2.6zM36.1 78.1c-.5-.5-1.4-.5-1.9 0l-.9.9c-.5.5-.5 1.4 0 1.9l11.3 11.3c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.5-.5.5-1.4 0-1.9L36.1 78.1zm-5.3 5.3c-.5-.5-1.4-.5-1.9 0l-.9.9c-.5.5-.5 1.4 0 1.9l7.8 7.8c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.3-.3.4-.6.4-1s-.1-.7-.4-1l-7.9-7.7z" class="st2"/><path d="m28 86.2 8.6 8.6c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.3-.3.4-.6.4-1s-.1-.7-.4-1l-8.6-8.6m-5.3 5.3c-.5-.5-1.4-.5-1.9 0l-.9.9c-.5.5-.5 1.4 0 1.9l2.6 2.6c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.5-.5.5-1.4 0-1.9l-2.7-2.6z" class="st2"/><path d="m22.8 91.4 3.4 3.4c.3.3.6.4 1 .4s.7-.1 1-.4l.9-.9c.5-.5.5-1.4 0-1.9l-3.4-3.4" class="st2"/></svg>

package/dist/build/concentric.797defa2.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="641" height="1012" opacity="0.075" fill="none" viewBox="0 0 641 1012"><circle cx="641" cy="506" r="80" stroke="#004157"/><circle cx="641" cy="506" r="20" stroke="#004157"/><circle cx="641" cy="506" r="160" stroke="#004157"/><circle cx="641" cy="506" r="240" stroke="#004157"/><circle cx="641" cy="506" r="320" stroke="#004157"/><circle cx="641" cy="506" r="400" stroke="#004157"/><circle cx="641" cy="506" r="480" stroke="#004157"/><circle cx="641" cy="506" r="560" stroke="#004157"/><circle cx="641" cy="506" r="640" stroke="#004157"/></svg>

package/dist/build/dots-pattern.7a77e237.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="421" height="724" fill="none" viewBox="0 0 421 724"><g stroke="#004157" opacity=".075"><circle cx="36.965" cy="27.974" r="17.5" transform="rotate(-15 36.965 27.974)"/><circle cx="141.285" cy=".021" r="17.5" transform="rotate(-15 141.285 .021)"/><circle cx="3.44" cy="111.496" r="17.5" transform="rotate(-15 3.44 111.496)"/><circle cx="107.76" cy="83.544" r="17.5" transform="rotate(-15 107.76 83.544)"/><circle cx="212.08" cy="55.591" r="17.5" transform="rotate(-15 212.08 55.591)"/><circle cx="74.235" cy="167.067" r="17.5" transform="rotate(-15 74.235 167.067)"/><circle cx="178.555" cy="139.114" r="17.5" transform="rotate(-15 178.555 139.114)"/><circle cx="40.71" cy="250.59" r="17.5" transform="rotate(-15 40.71 250.59)"/><circle cx="145.03" cy="222.637" r="17.5" transform="rotate(-15 145.03 222.637)"/><circle cx="249.35" cy="194.685" r="17.5" transform="rotate(-15 249.35 194.685)"/><circle cx="7.185" cy="334.113" r="17.5" transform="rotate(-15 7.185 334.113)"/><circle cx="111.505" cy="306.16" r="17.5" transform="rotate(-15 111.505 306.16)"/><circle cx="215.825" cy="278.208" r="17.5" transform="rotate(-15 215.825 278.208)"/><circle cx="77.98" cy="389.683" r="17.5" transform="rotate(-15 77.98 389.683)"/><circle cx="182.3" cy="361.73" r="17.5" transform="rotate(-15 182.3 361.73)"/><circle cx="286.62" cy="333.778" r="17.5" transform="rotate(-15 286.62 333.778)"/><circle cx="44.455" cy="473.206" r="17.5" transform="rotate(-15 44.455 473.206)"/><circle cx="148.775" cy="445.254" r="17.5" transform="rotate(-15 148.775 445.254)"/><circle cx="253.095" cy="417.301" r="17.5" transform="rotate(-15 253.095 417.301)"/><circle cx="10.93" cy="556.729" r="17.5" transform="rotate(-15 10.93 556.729)"/><circle cx="115.25" cy="528.776" r="17.5" transform="rotate(-15 115.25 528.776)"/><circle cx="219.57" cy="500.824" r="17.5" transform="rotate(-15 219.57 500.824)"/><circle cx="323.89" cy="472.871" r="17.5" transform="rotate(-15 323.89 472.871)"/><circle cx="81.725" cy="612.299" r="17.5" transform="rotate(-15 81.725 612.299)"/><circle cx="186.045" cy="584.347" r="17.5" transform="rotate(-15 186.045 584.347)"/><circle cx="290.365" cy="556.394" r="17.5" transform="rotate(-15 290.365 556.394)"/><circle cx="48.2" cy="695.822" r="17.5" transform="rotate(-15 48.2 695.822)"/><circle cx="152.52" cy="667.87" r="17.5" transform="rotate(-15 152.52 667.87)"/><circle cx="256.84" cy="639.917" r="17.5" transform="rotate(-15 256.84 639.917)"/><circle cx="361.16" cy="611.965" r="17.5" transform="rotate(-15 361.16 611.965)"/><circle cx="223.315" cy="723.44" r="17.5" transform="rotate(-15 223.315 723.44)"/><circle cx="327.635" cy="695.488" r="17.5" transform="rotate(-15 327.635 695.488)"/></g></svg>

package/src/brand/identity/boilerplate.md

@@ -1,23 +0,0 @@
----
-title: Boilerplate
-layout: content-page
-sidebar: brand
-status: 'Ready'
-version: 1.0.2
-tags: brand
----
-
-### When you make the invisible visible, the impossible is possible.
-
-Our analytical systems and services help our customers to create a better world. Through chemical, physical and structural analysis of materials, they improve everything from the energies that power us and the materials we build with, to the medicines that cure us and the foods we enjoy. 
-
-We partner with many of the world’s biggest companies, universities and research organizations. They value us not only for the power of our solutions, but also for the depth of our expertise, collaboration and integrity.
-
-With over 2200 employees, we serve the world, and we are part of Spectris plc, the world-leading precision measurements group.
-
-**Malvern Panalytical. We’re BIG on small.**
-
-{% alert %}
-### This is our boilerplate.
-It's the default text we use to describe ourselves in press releases and other publications.
-{% endalert %}

package/src/brand/identity/index.md

@@ -1,14 +0,0 @@
----
-title: Brand Identity
-layout: content-page
-sidebar: brand
-status: 'Placeholder'
-version: 0.0.1
-tags: brand
----
-
-## Customer centric
-
-A brand is defined by **what a company does**, not just what it says or shows. It means keeping our promises to our stakeholders, proving to them that Malvern Panalytical will always do its best to deliver what they need when they need it. Successful brands never take their stakeholders for granted.
- 
-We will seek to build **more intimate relationships with customers** across hierarchies, in key sectors that will drive the **development of innovative, customer-focused solutions and value-added services**.

package/src/brand/identity/legal-information.md

@@ -1,9 +0,0 @@
----
-title: Legal information
-layout: content-page
-sidebar: brand
-tags: brand
-version: 0.0.1
-status: 'Placeholder'
----
-In development

package/src/brand/identity/strategy.md

@@ -1,12 +0,0 @@
----
-title: Brand Strategy
-layout: content-page
-sidebar: brand
-status: 'Placeholder'
-version: 0.0.1
-tags: brand
----
-
-Our brand identity visualizes and mirrors Malvern Panalytical’s stature and position as a global leader in the materials characterization market.
-
-The **pragmatic implementation** of the brand identity enables everyone throughout the Malvern Panalytical organization to understand and deliver on the promises implied by the brand. The designs and ideas create a recognizable but straightforward signage program for Malvern Panalytical which expresses **its promise, personality, and values**.