ソースを参照

Standardize & cleanup examples (regarding snippets)

Kevin van Zonneveld 9 年 前
コミット
4dd3ad76aa

+ 8 - 11
website/src/examples/cdn.ejs

@@ -13,22 +13,19 @@ CDN
 This example showcases sourcing an UMD dist build straight from a CDN.
 </p>
 
-<p>
-On this page we're using the following HTML snippet:
-</p>
-
-{% include_code &nbsp; lang:html cdn/src/html/app.html %}
 <% include cdn/src/html/app.html %>
+<script src="cdn/static/js/app.js"></script>
+
+<hr />
 
 <p>
-Along with this JavaScript:
+  On this page we're using the following HTML snippet:
 </p>
 
-{% include_code &nbsp; lang:js cdn/src/js/app.js %}
-<script src="cdn/static/js/app.js"></script>
-
-Here you see the result in action:
+{% include_code lang:html cdn/src/html/app.html %}
 
 <p>
-: )
+  Along with this JavaScript:
 </p>
+
+{% include_code lang:js cdn/src/js/app.js %}

+ 4 - 7
website/src/examples/dragdrop.ejs

@@ -4,9 +4,6 @@ type: examples
 order: 2
 ---
 
-<!-- Basic Uppy styles -->
-<link rel="stylesheet" href="dragdrop/static/css/uppy.css">
-
 {% blockquote %}
 Drag &amp; Drop
 {% endblockquote %}
@@ -15,7 +12,7 @@ Drag &amp; Drop
 Here you'll see a demo of how you might set up Drag and Drop with Uppy:
 </p>
 
-<link rel="stylesheet" href="dragdrop/static/js/app.css">
+<link rel="stylesheet" href="dragdrop/src/css/app.css">
 <% include dragdrop/src/html/app.html %>
 <script src="dragdrop/static/js/app.js"></script>
 
@@ -25,16 +22,16 @@ Here you'll see a demo of how you might set up Drag and Drop with Uppy:
   On this page we're using the following HTML snippet:
 </p>
 
-{% include_code &nbsp; lang:html dragdrop/src/html/app.html %}
+{% include_code lang:html dragdrop/src/html/app.html %}
 
 <p>
   Along with this JavaScript:
 </p>
 
-{% include_code &nbsp; lang:js dragdrop/src/js/app.js %}
+{% include_code lang:js dragdrop/src/js/app.js %}
 
 <p>
   And the following CSS:
 </p>
 
-{% include_code &nbsp; lang:js dragdrop/src/css/app.css %}
+{% include_code lang:css dragdrop/src/css/app.css %}

+ 0 - 0
website/src/examples/dragdrop/static/css/style.css → website/src/examples/dragdrop/src/css/style.css


+ 3 - 0
website/src/examples/dragdrop/src/html/app.html

@@ -1,3 +1,6 @@
+<!-- Basic Uppy styles -->
+<link rel="stylesheet" href="dragdrop/static/css/uppy.css">
+
 <form id="upload-target" class="UppyDragDrop" method="post" action="/" enctype="multipart/form-data">
   <svg class="UppyDragDrop-puppy" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 125" enable-background="new 0 0 100 100"><path d="M16.582 21.3L-.085 62.713l32.94 13.295zM99.915 62.714L66.975 76.01 83.25 21.3zM50.917 68.117L62.443 56.59H37.386l11.527 11.526v5.905l-3.063 3.32 1.474 1.36 2.59-2.807 2.59 2.807 1.475-1.358-3.063-3.32zM66.976 41.415c-3.972 0-7.193-3.22-7.193-7.193 0-3.973 3.222-7.193 7.193-7.193 3.974 0 7.193 3.22 7.193 7.192 0 3.973-3.22 7.193-7.194 7.193m2.506-11.732c-.738 0-1.337.6-1.337 1.337s.6 1.336 1.337 1.336 1.337-.598 1.337-1.336-.6-1.337-1.338-1.337zM32.854 41.415c-3.973 0-7.193-3.22-7.193-7.193 0-3.973 3.22-7.193 7.194-7.193 3.973 0 7.192 3.22 7.192 7.192 0 3.973-3.22 7.193-7.192 7.193m2.506-11.732c-.738 0-1.337.6-1.337 1.337s.6 1.336 1.337 1.336 1.337-.598 1.337-1.336-.598-1.337-1.337-1.337z"/></svg>
   <div>

+ 2 - 0
website/src/examples/dragdrop/src/js/app.js

@@ -1,3 +1,5 @@
+console.log('a');
+
 import Uppy from 'uppy/core';
 import { DragDrop, Tus10 } from 'uppy/plugins';
 

+ 2 - 2
website/src/examples/dropbox.ejs

@@ -21,10 +21,10 @@ Here you'll see a demo of how you might set up Dropbox with Uppy:
   On this page we're using the following HTML snippet:
 </p>
 
-{% include_code &nbsp; lang:html dropbox/src/html/app.html %}
+{% include_code lang:html dropbox/src/html/app.html %}
 
 <p>
   Along with this JavaScript:
 </p>
 
-{% include_code &nbsp; lang:js dropbox/src/js/app.js %}
+{% include_code lang:js dropbox/src/js/app.js %}

+ 0 - 1
website/src/examples/dropbox/src/html/app.html

@@ -1,3 +1,2 @@
 <ul id="target"></ul>
 <script src="//cdnjs.cloudflare.com/ajax/libs/dropbox.js/0.10.2/dropbox.min.js"></script>
-<script src="dropbox/static/js/app.js"></script>