-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
151 lines (151 loc) · 7.51 KB
/
index.html
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
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@500;700&family=Inter:wght@400;500;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="assets/css/tablet.css" media="(min-width:930px)">
<link rel="shortcut icon" href="assets/icons/batata.svg" type="image/x-icon">
<title>Batata Bit</title>
</head>
<body>
<header class="header">
<img class="header__img" src="assets/img/logo.svg" alt="">
<div class="header__title--container">
<h1>La proxima revolucion en el intercambio de criptomonedas</h1>
<p>Batatabit te ayuda a navegar entre los dierentes precios y tendencias</p>
<a href="#plans" class="header__button">Conoce nuestros planes <span></span></a>
</div>
</header>
<main>
<section class="exchange">
<div>
<div class="exchange__img"></div>
<div class="exchange__title--container">
<h2>Visibilizamos todas las tasas de cambio</h2>
<p>Traemos informacion en tiempo real de
las casas de cambio y las monedas mas
importantes del mundo.</p>
</div>
</div>
<div class="exchange__table--master">
<section class="exchange__table--container">
<p>Monedas</p>
<div class="exchange__table">
<div class="exchange__table--item">Bitcoin</div>
<div class="exchange__table--item exchange__table--num">$ 1.96 <span class="down"></span></div>
<div class="exchange__table--item">Ethereum</div>
<div class="exchange__table--item exchange__table--num">$ 0.07 <span class="up"></span></div>
<div class="exchange__table--item">Ripple</div>
<div class="exchange__table--item exchange__table--num">$ 2.15 <span class="down"></span></div>
<div class="exchange__table--item">Stellar</div>
<div class="exchange__table--item exchange__table--num">$ 4.96 <span class="down"></span></div>
</div>
<span><b>Actualizado: </b> 19 Julio 23:45</span>
</section>
<section class="exchange__table--container">
<p class="blue">Comisiones</p>
<div class="exchange__table">
<div class="exchange__table--item">Bitrade</div>
<div class="exchange__table--item exchange__table--num">$ 12.96</div>
<div class="exchange__table--item">Bitpreco</div>
<div class="exchange__table--item exchange__table--num">$ 13.07</div>
<div class="exchange__table--item">Novadax</div>
<div class="exchange__table--item exchange__table--num">$ 13.15</div>
<div class="exchange__table--item">Coinext</div>
<div class="exchange__table--item exchange__table--num">$ 14.96</div>
</div>
<span class="blue"><b>Actualizado: </b> 31 Julio 23:45</span>
</section>
</div>
</section>
<section class="product">
<span class="product__logo"></span>
<div class="product__title--container">
<h2>Creamos un producto sin comparacion.</h2>
<p>Confiable y diseñado para su uso diario</p>
</div>
<section class="product__cards--container">
<article class="product__cards">
<span class="clock"></span>
<p class="product__card--title">Tiempo Real</p>
<p class="product__card--txt">Nuestra API toma informacion
minuto a minuto sobre las tasas
que mas determinan el comportamiento</p>
</article>
<article class="product__cards">
<span class="eye"></span>
<p class="product__card--title">No hay tasas escondidas</p>
<p class="product__card--txt">Ni en la compra o al momento de exit,
Batabit siempre te muestra el costo real de lo que estas adquiriendo
</p>
</article>
<article class="product__cards">
<span class="cash"></span>
<p class="product__card--title">Compara Monedas</p>
<p class="product__card--txt">No mas rumores, con Batabit sabras
el valor real de cada moneda en el mercado actual.
</p>
</article>
<article class="product__cards">
<span class="check"></span>
<p class="product__card--title">Informacion Confiable</p>
<p class="product__card--txt">Nuestras fuentes estan 100%
verificadas y continuamos auditando su contenido
mientras se actualizan.
</p>
</article>
</section>
</section>
<section class="bitcoin">
<h2>Conocelo hoy.</h2>
</section>
<section id="plans" class="plans">
<div class="plans__title">
<h2>Escoge el plan que mejor se ajuste a ti.</h2>
<p>Cualquier plan te da acceso a nuestra plataforma.</p>
</div>
<section class="plans__slider">
<article class="plans__slider--card">
<div class="slider__card--body">
<h3>Pago Anual</h3>
<p class="price"><span>$</span> 99</p>
<p class="saving">*Ahorras $129 comparado al plan mensual.</p>
<button class="ca">Escoger este <span></span></button>
</div>
</article>
<article class="plans__slider--card">
<span class="recommended">Recomendado</span>
<div class="slider__card--body">
<h3>Pago Anual</h3>
<p class="price"><span>$</span> 99</p>
<p class="saving">*Ahorras $129 comparado al plan mensual.</p>
<button class="ca">Escoger este <span></span></button>
</div>
</article>
<article class="plans__slider--card">
<div class="slider__card--body">
<h3>Pago Anual</h3>
<p class="price"><span>$</span> 99</p>
<p class="saving">*Ahorras $129 comparado al plan mensual.</p>
<button class="ca">Escoger este <span></span></button>
</div>
</article>
</section>
</section>
</main>
<footer>
<section class="left">
<ul>
<li><a href="#">Linkedin</a></li>
<li><a href="#">Crunchbase</a></li>
<li><a href="#">Hckernews</a></li>
</ul>
</section>
<section>
<img src="assets/img/logo-footer.svg" alt="Logo de batatabit 2024">
</section>
</footer>
</body>
</html>