-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathmisc
More file actions
133 lines (95 loc) · 4.5 KB
/
misc
File metadata and controls
133 lines (95 loc) · 4.5 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<!-- Entire footer container holds the left and right sides
of the footer, indicated by their classes footer-left
and right. -->
<section class="entire-footer">
<div class="upper-footer">
<div class="footer-left">
<img class="mojo-logo" src="/assets/svgs/mojo-logo.svg" alt="" />
<!-- Container to hold both login and open account buttons -->
<div class="badge-wrapper">
<img src="/assets/svgs/app-store-badge-blue.svg" alt="">
<a href="https://play.google.com/store/apps/details?id=com.interpaylb.mojo&pcampaignid=web_share">
<img src="/assets/svgs/icn-google-store-badge-blue.svg" alt="">
</a>
</div>
<!-- Mobile number wrapper -->
<div class="mobile-number">
<img src="/assets/svgs/icn-call.svg" alt="" />
<span id="text-rg" class="number-txt">(24) 522 720</span>
</div>
<!-- Footer links contains two sections of the class "links-column"-->
<div class="footer-links">
<div class="links-column">
<span routerLink="/about-us" class="gray-link">About Us</span>
<span routerLink="about-us/terms-and-conditions" class="blue-link">Terms and Conditions</span>
</div>
<div class="divider"></div>
<div class="links-column">
<span routerLink="about-us/privacy-policy" class="blue-link">Privacy Policy</span>
<span class="blue-link"></span>
</div>
</div>
<!---->
</div>
<div class="footer-right">
<span>OUR SOCIAL HANDLES</span>
<div class="socials-group">
<a href="https://www.linkedin.com/company/mojowallet/">
<img src="/assets/svgs/icn-linkedin.svg" alt="" />
</a>
<a href="https://www.tiktok.com/@mojo_wallet?_t=8j51wNePn5r&_r=1">
<img src="/assets/svgs/icn-tiktok.svg" alt="" />
</a>
<a href="https://www.instagram.com/mojo_wallet/">
<img src="/assets/svgs/icn-instagram.svg" alt="" />
</a>
<img src="/assets/svgs/icn-twitter.svg" alt="" />
<a href="https://www.facebook.com/profile.php?id=61552052282277">
<img src="/assets/svgs/icn-facebook.svg" alt="" />
</a>
</div>
</div>
</div>
<div class="extra-info">
<div class="location">
<span id="text-rg">Mojo Head Office, Cap 41 (opposite ABC) <br>
Seaside Road, Floor 3 <br>
Dbayeh</span>
</div>
<div class="second-extra-info">
<img src="/assets/svgs/lebanese-flag.svg"/>
<div class="info-txt">
<span id="text-rg">Central Bank of Lebanon Decision No.35/27/22</span>
<span id="text-rg">Interpay Sal</span>
</div>
</div>
</div>
</section>
<section id="container" class="entire-newsletter flex flex-col items-center bg-[#4500FF] relative overflow-hidden h-[35rem]">
<!-- Dividing the newsletter container into two parts;
left for the information, and right for the mockups -->
<div class="newsletter-left flex flex-col items-center justify-center gap-2">
<span id="text-sm" class="mini-header-txt text-[#C4C4C4]">Subscribe Now</span>
<span id="text-lg" class="main-header-txt text-white text-center">Subscribe to our newsletter</span>
<div class="input-wrapper lg:hidden flex flex-row items-center bg-white rounded-lg p-4 gap-4">
<input type="email" name="" id="" placeholder="Enter your email address" />
<button id="btn-filled" class="bg-[#D7D7D7] p-4 rounded-md" type="submit"></button>
</div>
<div class="input-wrapper hidden lg:flex flex-row items-center bg-white rounded-lg p-4 gap-4">
<input class="w-72" type="email" name="" id="" placeholder="Enter your email address" />
<button id="btn-filled" class="bg-[#D7D7D7] p-4 rounded-md" type="submit">Subscribe</button>
</div>
</div>
<div class="newsletter-right flex flex-row justify-center relative">
<div class="absolute top-10 left-36 hidden lg:flex flex-col items-start gap-6">
<img src="/assets/images/m-logo-footer.png" alt="">
<div class="flex flex-row items-center gap-4">
<img src="/assets/images/app-store-logo-white.png" alt="">
<img src="/assets/images/play-store-logo-white.png" alt="">
</div>
</div>
<!-- <img class="phone-1 absolute z-10 bottom-[-18rem]" src="/assets/images/phone-mockup-4.png" alt="" />
<img class="phone-2 absolute" src="/assets/images/phone-mockup-5.png" alt="" /> -->
<img class="relative scale-150 top-32 left-4 lg:scale-100 lg:top-0 lg:left-56 xl:top-[-8rem] xl:left-[22rem] 2xl:left-[24rem] 3xl:left-3/4" src="/assets/images/mock-group.png" alt=""/>
</div>
</section>