From e27d0a6bedf9c6981afb105c8a578a31c9c5e335 Mon Sep 17 00:00:00 2001
From: Matthias Kretschmann <m@kretschmann.io>
Date: Sun, 20 Dec 2015 05:58:40 +0100
Subject: [PATCH] logo component

---
 _src/_assets/images/logo.svg            | 41 +++++++++++++++++++++++++
 _src/_assets/styles/bigchain.scss       |  1 +
 _src/_assets/styles/bigchain/_logo.scss | 35 +++++++++++++++++++++
 _src/index.html                         |  4 +++
 4 files changed, 81 insertions(+)
 create mode 100644 _src/_assets/images/logo.svg
 create mode 100644 _src/_assets/styles/bigchain/_logo.scss

diff --git a/_src/_assets/images/logo.svg b/_src/_assets/images/logo.svg
new file mode 100644
index 0000000..9cdc093
--- /dev/null
+++ b/_src/_assets/images/logo.svg
@@ -0,0 +1,41 @@
+<!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In  -->
+<svg version="1.1"
+	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
+	 x="0px" y="0px" width="717.4px" height="67.1px" viewBox="0 0 717.4 67.1" style="enable-background:new 0 0 717.4 67.1;"
+	 xml:space="preserve">
+<g>
+	<path d="M0,35.9c0-0.4,0.8-0.8,1.2-1.2c1.4-1.4,3.6-1.4,4.9,0C7.4,36,7.4,38,6.1,39.3c-1.3,1.4-3.6,1.4-5,0C0.8,38.9,0,38.5,0,38.1
+		C0,37.4,0,36.6,0,35.9z"/>
+	<path d="M100.9,31.5c1.8,0.5,3.2,0.8,4.5,1.3c5.3,2.1,8.3,6.1,9,11.6c0.3,2.5,0.3,5.1-0.1,7.6c-1.2,6.8-5.8,10.6-12.1,12.5
+		c-3.4,1-7.3,1.4-10.8,1.4C85.4,66,79,66,73,66c0-21.6,0-43.1,0-64.8c1,0,1.6-0.1,2.1-0.1c5.1,0,10.4,0,15.5,0
+		c3.6,0,7.3,0.6,10.7,1.8c4.7,1.7,8.4,4.5,9.6,9.6c1.4,6,0.8,11.6-4.3,15.9c-1.1,0.9-2.4,1.5-3.6,2.1
+		C102.4,31,101.8,31.2,100.9,31.5z M79,61.2c6-0.3,12.6,0.6,18.7-0.6c3.8-0.7,7.2-2.3,9.3-5.9c1.6-2.8,1.9-5.9,1.6-8.9
+		c-0.4-3.8-2.1-6.9-5.5-9.1c-3-2-6.4-2.5-9.8-2.6c-4.1-0.1-8.3,0-12.4,0c-0.6,0-1.9,0.1-1.9,0.2C79,43.3,79,52.1,79,61.2z M79,29.6
+		c5,0,10.1,0.3,14.8-0.1c6.6-0.6,11.2-3.9,11.9-11c0.3-3.8-0.6-7.4-4-9.6C100,7.8,98.1,7,96.1,6.6c-5.3-1.2-10.9-0.8-16.3-0.7
+		C79.6,5.9,79,6,79,6.2C79,13.9,79,21.6,79,29.6z"/>
+	<path d="M607.4,8.6c0.5,19.2,0,38.4,0.2,57.4c-1.9,0-3.6,0-5.6,0c0-22,0-43,0-64.8c2-0.1,4.5-0.1,7.1,0c10,19,19.9,38,29.9,57.4
+		c0-19.4,0-38.6,0-57.6c2,0,3,0,5,0c0,22,0,43.2,0,65c-1,0-2,0-3.3,0c-1.2,0-2.2,0-3.5,0C627.2,46.9,617.4,27.7,607.4,8.6z"/>
+	<path d="M252.1,6.4c-1.2,1.2-2.3,2.4-3.5,3.5c-2.6-1.9-5.4-3.5-8.6-4.3c-10.3-2.6-19.5,2.3-23.6,11.6c-2.9,6.6-3.6,13.5-2.9,20.7
+		c0.3,3.6,0.8,7.1,2,10.6c1.5,4.2,3.7,7.9,7.4,10.5c2.9,2,6.2,3,9.7,3.2c4.9,0.3,9.3-0.5,13.7-2.7c0.3-0.2,0.8-0.4,0.8-0.6
+		c0-7.5,0-14.8,0-22.8c-4,0-7.6,0-11.8,0c-0.3-2-0.5-3-0.7-5c6.4,0,11.6,0,18.6,0c0,10,0,20.4,0,30.8c-4,2.1-7.4,3.6-11.5,4.5
+		c-4.7,1-9.5,1.1-14.2,0c-8.5-2-14-7.5-17.1-15.4c-1.9-4.9-2.6-9.9-2.8-15.2c-0.1-5.4,0.2-10.8,1.8-16c1.9-5.9,5-10.9,9.9-14.7
+		c4.9-3.8,10.5-5.2,16.6-5c5.4,0.2,10.3,1.7,14.6,5C251,5.4,251.6,5.9,252.1,6.4z"/>
+	<path d="M382,29.2c3,0.5,29,0.4,31-0.1c0-9.1,0-18,0-28c2,0,4,0,5.7,0c0.5,2,0.6,62,0.1,65c-1.7,0-3.8,0-5.8,0c0-11,0-21,0-31.3
+		c-2-0.6-29-0.7-31-0.1c0,10.4,0,20.4,0,31.4c-2,0-4,0-6,0c0-22,0-43,0-64.8c1,0,1.9-0.1,2.8-0.1c0.9,0,2.2,0,3.2,0
+		C382,10.5,382,19.8,382,29.2z"/>
+	<path d="M464.1,66c-2,0-3.8,0-5.8,0c7.2-22,14.4-43,21.6-65c2.4,0,4.7,0,7.3,0c7.1,22,14.3,43,21.6,65c-1.2,0-2.1,0-3.1,0
+		c-1,0-1.9,0-3,0c-1.3-4-2.6-8.2-3.9-12.2c-0.4-1.3-1-2.5-1.2-3.8c-0.3-1.5-1.1-1.7-2.4-1.7c-6.2,0-12.3,0-18.5,0
+		c-1.7,0-3.5,0.1-5.2,0c-1.2,0-1.8,0.4-2.2,1.7c-1.5,5.1-3.2,10.1-4.9,15.1C464.4,65.3,464.3,66,464.1,66z M483.3,6.3
+		c-3.9,12.2-7.8,24.7-11.8,36.7c8.1,0,15.8,0,23.9,0C491.6,31,487.6,18.5,483.3,6.3z"/>
+	<path d="M333.8,56.5c1,1.3,1.9,2.4,2.9,3.7c-3.1,3.3-6.9,5.2-11.1,6.1c-6.1,1.3-12.1,1-17.7-1.8c-5.6-2.8-9.2-7.3-11.6-12.9
+		c-2.2-5.1-3.1-10.4-3.2-16c-0.1-5,0.1-9.9,1.4-14.7c1.7-6.3,4.6-11.8,9.8-15.9c4.9-3.8,10.6-5.1,16.6-4.9c5.2,0.2,10,1.9,14.1,5.1
+		c0.2,0.1,0.4,0.3,0.5,0.4c0.1,0.1,0.2,0.2,0.4,0.5C335,7.3,334,8.5,333,9.8c-0.8-0.6-1.6-1.1-2.3-1.5c-6-3.9-12.2-4.5-18.8-1.8
+		c-5,2-8.2,6-10.1,10.9c-2.6,6.6-3.2,13.5-2.5,20.5c0.3,3.4,0.8,6.8,2,10.1c1.4,4,3.5,7.7,7,10.3c6.3,4.6,13.1,5,20.1,1.7
+		C330.2,59.1,331.8,57.8,333.8,56.5z"/>
+	<path d="M548.7,1c1.8,0,3.3,0,5.3,0c0,22,0,43,0,65c-2,0-3.4,0-5.2,0C548.4,64,548.2,5,548.7,1z"/>
+	<path d="M163,66c-2,0-4,0-6,0c0-22,0-43,0-65c1,0,2.3,0,3.2,0c0.9,0,0.8,0,2.8,0C163,23,163,44,163,66z"/>
+	<path d="M42.9,40.3c-1.8-0.1-3.3-1.6-3.2-3.4c0-1.9,1.7-3.4,3.6-3.3c1.8,0.1,3.2,1.7,3.1,3.5C46.3,38.9,44.7,40.4,42.9,40.3z"/>
+	<path d="M671.5,37c0-1.8,1.5-3.3,3.3-3.3c1.9,0,3.5,1.6,3.4,3.5c-0.1,1.8-1.6,3.3-3.4,3.2C673,40.3,671.5,38.8,671.5,37z"/>
+	<path d="M714.1,33.6c1.8,0,3.3,1.5,3.4,3.3c0,1.9-1.6,3.5-3.4,3.4c-1.8-0.1-3.3-1.6-3.2-3.4C710.8,35.2,712.3,33.7,714.1,33.6z"/>
+</g>
+</svg>
diff --git a/_src/_assets/styles/bigchain.scss b/_src/_assets/styles/bigchain.scss
index 31c8304..cf721d4 100644
--- a/_src/_assets/styles/bigchain.scss
+++ b/_src/_assets/styles/bigchain.scss
@@ -15,6 +15,7 @@
 // Components
 @import 'bigchain/_fonts';
 @import 'bigchain/_typography';
+@import 'bigchain/_logo';
 @import 'bigchain/_grid';
 @import 'bigchain/_sections';
 
diff --git a/_src/_assets/styles/bigchain/_logo.scss b/_src/_assets/styles/bigchain/_logo.scss
new file mode 100644
index 0000000..b9edd44
--- /dev/null
+++ b/_src/_assets/styles/bigchain/_logo.scss
@@ -0,0 +1,35 @@
+//
+// Logo
+// ---
+// bigchain.io
+//
+
+// default logo
+.logo {
+    fill: $brand-main-black;
+    width: 300px;
+    height: 30px;
+}
+
+
+//
+// size modifiers
+//
+.logo--sm {
+    width: 140px;
+    height: 12px;
+}
+
+.logo--full {
+    display: block;
+    width: 99%;
+    height: auto;
+}
+
+
+//
+// color modifiers
+//
+.logo--blue {
+    fill: $brand-main-blue;
+}
diff --git a/_src/index.html b/_src/index.html
index f92f0f0..cb3aaae 100644
--- a/_src/index.html
+++ b/_src/index.html
@@ -6,6 +6,10 @@ front_page: true
 
 <section class="section">
     <div class="row">
+        <svg class="logo logo--blue logo--full" aria-labelledby="title">
+            <title>Logo</title>
+            <use xlink:href="/assets/img/sprite.svg#logo"></use>
+        </svg>
         <h1 class="section-title">Bigchain is coming</h1>
         <div class="section-description">
             <div class="grid grid--gutters">