From 00a42c2092dc4177cb26e376b423434b5b32f16c Mon Sep 17 00:00:00 2001
From: Nicolas Constant <github@nicolas-constant.com>
Date: Sun, 10 Feb 2019 22:42:51 -0500
Subject: [PATCH] added arrows to tutorial

---
 .../components/tutorial/tutorial.component.html  |   6 ++++--
 .../components/tutorial/tutorial.component.scss  |  12 ++++++++----
 src/assets/img/arrow_1.png                       | Bin 0 -> 3000 bytes
 src/assets/img/arrow_2.png                       | Bin 0 -> 2197 bytes
 4 files changed, 12 insertions(+), 6 deletions(-)
 create mode 100644 src/assets/img/arrow_1.png
 create mode 100644 src/assets/img/arrow_2.png

diff --git a/src/app/components/tutorial/tutorial.component.html b/src/app/components/tutorial/tutorial.component.html
index 41292be0..6d5b6927 100644
--- a/src/app/components/tutorial/tutorial.component.html
+++ b/src/app/components/tutorial/tutorial.component.html
@@ -1,13 +1,15 @@
 <!-- <div class="tutorial"> -->
 <div class="add-account" *ngIf="showAddAccount">
-    <div class="add-account__arrow"></div>
+    <!-- <div class="add-account__arrow"></div> -->
+    <img class="add-account__arrow" src="assets/img/arrow_1.png" alt="arrow pointing the +">
     <h3 class="add-account__title">Welcome to Sengi!</h3>
     <p class="add-account__description">
         Let's start, click the "+" button to add a new account.
     </p>
 </div>
 <div class="open-account" *ngIf="showOpenAccount">
-    <div class="open-account__arrow"></div>
+    <!-- <div class="open-account__arrow"></div> -->
+    <img class="open-account__arrow" src="assets/img/arrow_2.png" alt="arrow pointing the first account">
     <div class="open-account__mouse-icon"></div>
     <h3 class="open-account__title">Nice!</h3>
     <p class="open-account__description">
diff --git a/src/app/components/tutorial/tutorial.component.scss b/src/app/components/tutorial/tutorial.component.scss
index f6e3795e..a5fcd38d 100644
--- a/src/app/components/tutorial/tutorial.component.scss
+++ b/src/app/components/tutorial/tutorial.component.scss
@@ -24,7 +24,9 @@
     position: absolute;
 
     &__arrow {
-
+        position: fixed;
+        top: 15px;
+        left: 60px;
     }
 
     &__title{
@@ -35,8 +37,8 @@
 
     &__description {
         position: relative;
-        top: 40px;
-        left: 70px;
+        top: 45px;
+        left: 75px;
 
         text-align: center;
 
@@ -53,7 +55,9 @@
     position: absolute;
 
     &__arrow {
-        position: relative;
+        position: fixed;
+        top: 85px;
+        left: 65px;
     }
 
     &__title{
diff --git a/src/assets/img/arrow_1.png b/src/assets/img/arrow_1.png
new file mode 100644
index 0000000000000000000000000000000000000000..f74cd353bd02bbd47399f4f5c04a750719a917f4
GIT binary patch
literal 3000
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

literal 0
HcmV?d00001

diff --git a/src/assets/img/arrow_2.png b/src/assets/img/arrow_2.png
new file mode 100644
index 0000000000000000000000000000000000000000..6946ad8670c9eecf2898a6c7328360fdb67c9e4c
GIT binary patch
literal 2197
zcmcImeNYr-96oI{0X30n;!9mu$T0SH_deN`L-7uS@caNAPc6s2-S^;tyIpq|?$9aB
zG%*oO!_fv6l?hD)9Sx8&Q$!pYzcRzdQPi|7MI%g&QhOJU%W2f%pLS;Vecyeb_xU})
zkNwTAm_GH5A%Wq6DwS$TO0p#ljwX1I9yAa>v-7tFz#%|Lo-L_VLystTzp~edMyON+
z&Nwq{vdub$W_g#I;dnbxdtCxVt5oq5yaL1K02#4^OsCs~-udz%ia0qFI!kXQtb!S2
zIg=NPAbsJ~40d4-OL6Fg1SH-|Ljo6&8N}<#bxX9@gm&}NaIU<@QKTCp=a|q$#UNs{
zPDjkV2oSy6fU%@bj~FR6Y0&B@Di+ZYWE@V!;iMKL4YZD+H5$Zsq0pMhIp{RYWS=d#
zGND<rEYLXa@p#l8t(q4zagw4aoY3GJ4F(aIRN$5wFXooU^fFk0#EMQqcJgjSVPx!l
zo@_#)(jFIFf}hqc`N9MPhI<(SC)I@FQZLYIeLmFX@}ng=DIZ$#>3u4(lu;l6JPk;E
zp2&iveBhSH^cv$>|5+hV%<cA+V{woRTo5KfVWi)bkj2Zql*K>85C68`8-X^9fRTAI
zgXeR56E(e;1u>hI#8Aj<vz%^@_ee2{DBl@iVPs%Jm3@rRU?h>D(a>5Qtv6tVo+gMM
zs1=q1$H+|Iz&z)46!ZmZwbChWNoL$ENU@kuC`#>gax?{4oxx!@VmiIXjya4v2BSE*
zG&uAWtD(3!-~ipa;CTzr<|z?W&i7O<$Fq>bA0*mAQgM`>wPOTeILt`u>=<JtNKB(6
z?S$Sz=;H`&FWWTH2|pet_eoYo6$cp^J;xf14uDY%tHm5ZXT%tiA}~^~H`?PI9MEfx
zD8jL{gBM*4EET7V$ppCI&P0)a)tLEQUbONYjJZ}RXvhw|NOnpvdj-BvBpod9&2pVc
zciqtptCYJ5WtBVw4)wiuJ|%j6)7eAo$pVn{Imz#VNxVb$Fd|6Igpuw`ec{j2FERPg
zSKqhX|G(;e!DX`;cP4-x6h{?*aHZGuqz3<Q*1Gqe=u5qD*zA<4zstgfzfS`<q!wWp
zZub_nt5p57Q!I%Yw#N4JsoSkHBAYv;QwwTl9WHAKJGTGlDD{}A`+*??D+do=og7oT
zp;AuL*e?f%r5suC;gnGCtHTSfe>AD!+U(;+YdV^*6=v66xHw)@e_`aV@8{JVxaVna
zdwlRwPTBOXwzM6K)fGWE`iD0X1NM?X6)tu+_b+dbh%HSzhRNf*gb{7Og+-8P&FK-g
zrK$DH&EDlNZ@(7Y@Iugn=!tc9<Gc!Eso~;#P4&x`+ae0@CsZ@pmnvG;FWc!YK6m2~
z`1=r9+!7*(=_8LU+Lic9?b49HO3KV9Hodr{dVYAx<*<8ON@jYO;`J-T%=);PZ6Pz|
z7jLDN2L+5es=50kwdrc!zWX19H)wyqT`am5-^>0i;fI6k$gkI(srqF5&QH5C-rxJy
zVO#Fe9jg6Bbq|IW{+Yk{(c#wJ?VD$K`ke@EeREauSHTa%S9I<AF0?Y<Hh0V)rq9KY
zsyzX0>Xo87r>*6O-i>TpyZhqi2TLQaG!-__+gOg=+`pmg8^`3fYfH)_qN3Z*hN=>B
z9;II?J^ID1IxR<pbdoX0AI7cNXdC`*Te#ss0+&9mvNCq<^@V6nRn+X%yVEALrmv~4
zikf?B^&(Sa<($rG6QkcLy0P-y?2?W>p>Kz-G7K)=-I*7Aa`gl-lX%J4F|P9ThHzrw
zg~lx>PPCj6x$+A2)#zGAwBxsr%!@B#f&1jyMl^8z%29h}-M2inL=GxVFrQQhk6T}2
z3N9`m^h>J{Z@;}M{!;nJjVtdIxo&FmlOit-=GV8}+*&Ji-W0~(`?d7^u#u)#54Ua7
r$sl6v*81A3hJ8I*Z-B#NXID_{=ur=wLhpntKMpBLQ!Uk#<}djNL69Ip

literal 0
HcmV?d00001