-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
261 lines (249 loc) · 10.3 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
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8" />
<meta name="author" content="Jeferson Tavares" />
<meta
name="description"
content="Meu nome é Ricardo Tavares, consultor de vendas da Motosol. Estou aqui para facilitar seu atendimento e realizar o seu sonho de conquistar sua Honda 0Km."
/>
<meta
name="keywords"
content="moto, motosol, vendedor, Ricardo, Ricardo Tavares, honda, Ricardo motosol, ricotavares, ricardotavares, Santo Antônio de Jesus, SAJ, saj, Ricardo site, Ricardo saj vendedor, Ricardo consultor de vendas"
/>
<meta name="copyright" content="Jeferson Tavares 2022" />
<meta name="theme-color" content="#111010" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta
property="og:image"
content="https://ricardotavares.vercel.app/assets/img/preview.png"
/>
<meta
property="og:title"
content="Ricardo Tavares - Consultor de vendas Motosol"
/>
<meta
property="og:description"
content="Me chamo Ricardo e irei realizar o seu sonho de conquistar sua Honda 0Km."
/>
<title>Ricardo Tavares - Consultor de vendas Motosol</title>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@1,400;1,700&family=IBM+Plex+Sans&family=IBM+Plex+Sans+Thai+Looped&family=Ubuntu&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="./assets/css/style.css" />
<link rel="stylesheet" href="./assets/css/normalize.css" />
<link
rel="apple-touch-icon"
sizes="180x180"
href="./assets/img/favicon/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="./assets/img/favicon/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="./assets/img/favicon/favicon-16x16.png"
/>
<script src="./assets/js/svg-inject.min.js"></script>
<script src="https://unpkg.com/scrollreveal"></script>
<meta name="google-site-verification" content="uAc8AgNrW5UpB-mAJnINoEMJCoE_-W_zLoCIhBUEKT0" />
</head>
<body>
<section id="secao_cartao_apresentacao">
<div id="container_image">
<picture>
<source srcset="./assets/img/logo_marcaG.png" media="(min-width: 2500px)" type="image/png">
<source srcset="./assets/img/logo_marcaM.png" media="(min-width: 1150px)" type="image/png">
<source srcset="./assets/img/logo_marcaP.png" media="(min-width: 800px)" type="image/png">
<img id="logo_marca" src="./assets/img/logo_marcaPP.png" alt="Círculo branco contendo a letra 'R', ao lado direito está escrito na vertical, todo em maiúsculo, Ricardo Motos novas e seminovas"/>
</picture>
</div>
<div id="container_informacoes_cartao">
<div id="informacoes_cartao">
<h1>
<span id="info_cartao_ola">Olá, eu sou</span><br />
<span class="info_cartao_nome" id="app"></span><br />
<span id="info_cartao_profissao">Consultor de vendas Motosol</span>
</h1>
<img
id="logo_honda"
src="./assets/img/honda_logo.svg"
alt="A logomarca Honda tem a forma de uma asa vermelha formada por um traço maior curvado que engloba quatro traços retos, abaixo dessa asa temos escrito, tudo em maiúsculo, 'HONDA' "
loading="lazy"
/>
</div>
</div>
</section>
<section id="secao_sobre">
<div id="conteudo_sobre">
<span id="spn_frase">Me acompanhe nas redes!</span>
<a
href="https://www.instagram.com/ricardomotosol/"
target="_blank"
rel="external"
><button id="btn_insta">
<span id="span_btn_insta">Instagram</span>
</button></a
>
<p id="p_sobre_mim">
Eu prezo pelo melhor atendimento e me doo ao máximo para garantir a
felicidade do meu cliente. <br />...<br />
Me acompanhe nas redes para não perder as novidades e garantir a sua
honda 0Km.
</p>
</div>
</section>
<section class="secao_atendimento" id="particles-js">
<div id="transparent_background">
<h1 id="titulo_atendimento">Quer agilizar o atendimento?</h1>
<div class="cards_atendimento" id="div_consultoria">
<h1 class="titulo_card" id="consultoria">Consultoria</h1>
<p class="texto_card">
Veja o catálogo de motos e agilize o seu atendimento.
</p>
<a
href="./Pages/consultoria.html"
target="_self"
rel="next"
title="Agilize seu atendimento comigo"
><button class="btn_acesso">Acessar</button></a
>
</div>
<div class="cards_atendimento" id="div_oficina">
<h1 class="titulo_card" id="oficina">Oficina</h1>
<p class="texto_card">Fale com o setor de oficina da Motosol.</p>
<a
href="https://api.whatsapp.com/send?phone=+557583694760&text=Olá! Gostaria de uma consulta com o setor da oficina."
target="_blank"
rel="external"
title="Fale o atendimento da Oficina"
><button class="btn_acesso">Entre em contato</button></a
>
</div>
<div class="cards_atendimento" id="div_pecas">
<h1 class="titulo_card" id="pecas">Peças</h1>
<p class="texto_card">Fale com o setor de peças da Motosol.</p>
<a
href="https://api.whatsapp.com/send?phone=+557533114451&text=Olá! Gostaria de uma consulta com o setor de peças."
target="_blank"
rel="external"
title="Fale com o atendimento do setor de Peças"
><button class="btn_acesso">Entre em contato</button></a
>
</div>
</div>
</section>
<section id="secao_contato">
<div id="area_img_frase">
<p class="smallDelay" id="frase_topo">
Para seguro, consórcio, financiamento ou outras dúvidas entre em
contato
</p>
<div id="grid_layout">
<img
id="img_ricardo_perfil"
src="./assets/img/Ricardo_perfil.png"
alt="A moldura da foto é circular com uma sombra para a esquerda. Na foto temos Ricardo, de perfil, utilizando uma camisa branca (farda da motosol), segurando uma chave de moto."
width="256"
height="256"
loading="lazy"
/>
<img
id="seta_tracejada"
src="./assets/img/arrowdashed.svg"
alt="Uma seta preta tracejada aponta para a direita, sessão onde está as formas de contato com Ricardo Tavares"
loading="lazy"
/>
</div>
<p class="smallDelay" id="frase_base">
O seu sonho pode está mais perto, do que você imagina.
</p>
</div>
<div class="container_contato_redes">
<img
id="polygon2"
src="./assets/img/polygon2.svg"
alt="poligono branco"
loading="lazy"
/>
<div class="delayExtraBigReveal" id="informacoes_para_contato">
<h1 id="titulo_name">Ricardo Tavares</h1>
<a
href="https://api.whatsapp.com/send?phone=+5575988006438&text=Oi, Ricardo!"
target="_blank"
rel="external"
class="link_click"
title="Fale comigo pelo whatsapp"
>
<button class="bnt_redes" id="whatsapp">
<div class="icon" id="icon_whats">
<img
id="img_icon"
src="./assets/icons/whatsapp.png"
alt="O ícone do aplicativo whatsapp é formado por balão característico de fala (comuns em quadrinhos, revistas, etc..) um círculo verde com bordas brancas e dentro temos o ícone de um gancho de telefone fixo."
loading="lazy"
/>
</div>
<span class="name_button">whatsapp</span>
</button>
</a>
<a
href="https://www.instagram.com/ricardomotosol/"
target="_blank"
rel="external"
title="Me siga no instagram"
>
<button class="bnt_redes" id="instagram">
<div class="icon" id="icon_insta">
<img
id="img_icon"
src="./assets/icons/instagram.png"
alt="O ícone do aplicativo instagram é formado pelo contorno branco de uma câmera do tipo polaroid e colorida com uma transição de cores de azul, roxo, rosa, laranja, amarelo."
loading="lazy"
/>
</div>
<span class="name_button">Instagram</span>
</button>
</a>
<a
href="https://www.facebook.com/ricardo.tavares.54"
target="_blank"
rel="external"
title="Me siga no facebook"
>
<button class="bnt_redes" id="facebook">
<div class="icon" id="icon_face">
<img
id="img_icon"
src="./assets/icons/facebook.png"
alt="O ícone do aplicativo facebook é formado por um fundo azul e a letra F, no formato minúscula, no centro."
loading="lazy"
/>
</div>
<span class="name_button">Facebook</span>
</button>
</a>
</div>
</div>
</section>
<footer id="footer_copyright">
<div id="div-layout">
<p id="author">© 2022 || Feito por <a id="author-linkedin" href="https://www.linkedin.com/in/jeferson-74vares/" target="_blank">Jeferson Tavares</a></p>
</div>
</footer>
<script type="text/javascript" src="./assets/js/scrollPage.js"></script>
<script src="https://unpkg.com/typewriter-effect@latest/dist/core.js"></script>
<script type="text/javascript" src="./assets/js/typeWriter.js"></script>
<script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>
<script type="text/javascript" src="./assets/js/particles.js"></script>
</body>
</html>