Styles, example, colors

website/themes/uppy/layout/index.ejs

@@ -1,7 +1,7 @@
 <section id="hero" class="IndexHero">
   <header id="logo-wrap" class="IndexHero-logo">
     <img id="logo" width="200" class="IndexHero-logoImg emoji dog" title="puppy" alt="uppy" src="<%- config.logo_large %>">
-    <h1 class="indexHero-title"><%- config.title %></h1>
+    <h1 class="IndexHero-title"><%- config.title %></h1>
   </header>
 
   <div class="IndexHero-desc">
@@ -26,7 +26,7 @@
 </section>
 
 <section id="example" class="IndexExample">
-  <h2>10 Second Example</h2>
+  <h2 class="IndexExample-title">10 Second Example</h2>
 
   <div class="IndexExample-block"><%- partial('partials/example1') %></div>
 

website/themes/uppy/layout/partials/example1.md

@@ -1,12 +1,12 @@
 ```html
-<div id="drag-drop"></div>
+<div id="upload-target"></div>
 
-<script src="http://assets.transloadit.com/uppy.min.js" />
+<script src="http://assets.transloadit.com/uppy.min.js">
 <script>
-var uppy = new Uppy();
-uppy
-  .use(DragDrop, {selector: '#drag-drop'})
-  .use(Tus10, {endpoint: 'http://master.tus.io:8080'})
-  .run();
+  var uppy = new Uppy.Core();
+  uppy
+    .use(Uppy.plugins.DragDrop, {selector: '#upload-target'})
+    .use(Uppy.plugins.Tus10, {endpoint: 'http://master.tus.io:8080'})
+    .run();
 </script>
 ```

website/themes/uppy/source/css/_settings.scss

@@ -12,7 +12,7 @@ $fontSize-code : .8em;
 // colors
 $color-white      : #fff;
 $color-black      : #000;
-$color-blue       : #01A5E1;
+$color-blue       : #345E86;
 $color-dark       : #2c3e50;
 $color-medium     : #34495e;
 $color-light      : #7f8c8d;
@@ -23,7 +23,8 @@ $color-red        : #ff6666;
 $color-darkgray   : #34393A;
 $color-violet     : #492e7c;
 $color-orange     : #e96900;
-$color-primary    : $color-violet;
+$color-mint       : #02B1AC;
+$color-primary    : $color-blue;
 
 // sizes
 $size-radius : 2px;