From c9c7c7b85ed16b8ad82c3da6696be3cf79130cd3 Mon Sep 17 00:00:00 2001
From: Adam Procter <adamprocter@researchnot.es>
Date: Mon, 14 Dec 2020 12:53:13 +0000
Subject: [PATCH] added icon

---
 app/src/components/UploadLayer.vue | 132 ++++++++++++++++++++++++++++-
 1 file changed, 130 insertions(+), 2 deletions(-)

diff --git a/app/src/components/UploadLayer.vue b/app/src/components/UploadLayer.vue
index 4dbd105..41bfe5e 100644
--- a/app/src/components/UploadLayer.vue
+++ b/app/src/components/UploadLayer.vue
@@ -12,7 +12,69 @@
         />
         <!--  -->
         <p>Drop media here to upload.</p>
-
+        <svg
+          class="icon"
+          xmlns="http://www.w3.org/2000/svg"
+          width="50"
+          height="50"
+        >
+          <g>
+            <circle cx="6.5" cy="30.5" r="5.5" fill="grey" />
+            <circle cx="40.5" cy="30.5" r="5.5" fill="grey" />
+            <circle cx="17.5" cy="27.5" r="8.5" fill="grey" />
+            <circle cx="28.5" cy="25.5" r="10.5" fill="grey" />
+            <rect
+              fill-rule="evenodd"
+              clip-rule="evenodd"
+              x="6"
+              y="31"
+              width="35"
+              height="5"
+              fill="grey"
+            />
+            <circle
+              cx="9.5"
+              cy="25.5"
+              r="4.5"
+              fill="white"
+              stroke="grey"
+              stroke-width="2"
+            />
+            <circle
+              cx="43.5"
+              cy="25.5"
+              r="4.5"
+              fill="white"
+              stroke="grey"
+              stroke-width="2"
+            />
+            <circle
+              cx="20.5"
+              cy="22.5"
+              r="7.5"
+              fill="white"
+              stroke="grey"
+              stroke-width="2"
+            />
+            <circle
+              cx="31.5"
+              cy="20.5"
+              r="9.5"
+              fill="white"
+              stroke="grey"
+              stroke-width="2"
+            />
+            <rect x="9" y="23" width="35" height="6" fill="white" />
+            <rect x="9" y="23" width="12" height="5" fill="white" />
+            <rect x="18" y="21" width="9" height="6" fill="white" />
+            <rect x="17" y="17" width="21" height="5" fill="white" />
+            <rect x="21" y="18" width="10" height="4" fill="white" />
+            <path
+              d="M30.5303 15.4697C30.2374 15.1768 29.7626 15.1768 29.4697 15.4697L24.6967 20.2426C24.4038 20.5355 24.4038 21.0104 24.6967 21.3033C24.9896 21.5962 25.4645 21.5962 25.7574 21.3033L30 17.0607L34.2426 21.3033C34.5355 21.5962 35.0104 21.5962 35.3033 21.3033C35.5962 21.0104 35.5962 20.5355 35.3033 20.2426L30.5303 15.4697ZM30.75 28L30.75 16L29.25 16L29.25 28L30.75 28Z"
+              fill="grey"
+            />
+          </g>
+        </svg>
         <textarea id="ipfshash" v-model="copytext"></textarea>
         <div class="btn-row">
           <button v-on:click.prevent="copyDone()" id="copyme" hidden>
@@ -35,7 +97,69 @@
         />
         <!--  -->
         <p>Drop media here to upload.</p>
-
+        <svg
+          class="icon"
+          xmlns="http://www.w3.org/2000/svg"
+          width="50"
+          height="50"
+        >
+          <g>
+            <circle cx="6.5" cy="30.5" r="5.5" fill="grey" />
+            <circle cx="40.5" cy="30.5" r="5.5" fill="grey" />
+            <circle cx="17.5" cy="27.5" r="8.5" fill="grey" />
+            <circle cx="28.5" cy="25.5" r="10.5" fill="grey" />
+            <rect
+              fill-rule="evenodd"
+              clip-rule="evenodd"
+              x="6"
+              y="31"
+              width="35"
+              height="5"
+              fill="grey"
+            />
+            <circle
+              cx="9.5"
+              cy="25.5"
+              r="4.5"
+              fill="white"
+              stroke="grey"
+              stroke-width="2"
+            />
+            <circle
+              cx="43.5"
+              cy="25.5"
+              r="4.5"
+              fill="white"
+              stroke="grey"
+              stroke-width="2"
+            />
+            <circle
+              cx="20.5"
+              cy="22.5"
+              r="7.5"
+              fill="white"
+              stroke="grey"
+              stroke-width="2"
+            />
+            <circle
+              cx="31.5"
+              cy="20.5"
+              r="9.5"
+              fill="white"
+              stroke="grey"
+              stroke-width="2"
+            />
+            <rect x="9" y="23" width="35" height="6" fill="white" />
+            <rect x="9" y="23" width="12" height="5" fill="white" />
+            <rect x="18" y="21" width="9" height="6" fill="white" />
+            <rect x="17" y="17" width="21" height="5" fill="white" />
+            <rect x="21" y="18" width="10" height="4" fill="white" />
+            <path
+              d="M30.5303 15.4697C30.2374 15.1768 29.7626 15.1768 29.4697 15.4697L24.6967 20.2426C24.4038 20.5355 24.4038 21.0104 24.6967 21.3033C24.9896 21.5962 25.4645 21.5962 25.7574 21.3033L30 17.0607L34.2426 21.3033C34.5355 21.5962 35.0104 21.5962 35.3033 21.3033C35.5962 21.0104 35.5962 20.5355 35.3033 20.2426L30.5303 15.4697ZM30.75 28L30.75 16L29.25 16L29.25 28L30.75 28Z"
+              fill="grey"
+            />
+          </g>
+        </svg>
         <textarea id="ipfshash" v-model="copytext"></textarea>
         <div class="btn-row">
           <button v-on:click.prevent="copyDone()" id="copyme" hidden>
@@ -272,6 +396,10 @@ export default {
 </script>
 
 <style lang="css" scoped>
+.icon {
+  margin-top: -1.5em;
+  margin-left: 4.5em;
+}
 .fileInput {
   display: none;
 }
-- 
GitLab