/
index.html
65 lines (58 loc) · 3.41 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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1"><!-- viewport -->
<title>Contato Whatsapp</title>
<!-- css -->
<link rel="stylesheet" type="text/css" media="all" href="style.css" /><!-- style -->
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div id="wppchat">
<button class="wppchat__button" id="button-whatsapp"><svg style="width:18px;height:18px" viewBox="0 0 24 24"><path fill="#fff" d="M16.75,13.96C17,14.09 17.16,14.16 17.21,14.26C17.27,14.37 17.25,14.87 17,15.44C16.8,16 15.76,16.54 15.3,16.56C14.84,16.58 14.83,16.92 12.34,15.83C9.85,14.74 8.35,12.08 8.23,11.91C8.11,11.74 7.27,10.53 7.31,9.3C7.36,8.08 8,7.5 8.26,7.26C8.5,7 8.77,6.97 8.94,7H9.41C9.56,7 9.77,6.94 9.96,7.45L10.65,9.32C10.71,9.45 10.75,9.6 10.66,9.76L10.39,10.17L10,10.59C9.88,10.71 9.74,10.84 9.88,11.09C10,11.35 10.5,12.18 11.2,12.87C12.11,13.75 12.91,14.04 13.15,14.17C13.39,14.31 13.54,14.29 13.69,14.13L14.5,13.19C14.69,12.94 14.85,13 15.08,13.08L16.75,13.96M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22C10.03,22 8.2,21.43 6.65,20.45L2,22L3.55,17.35C2.57,15.8 2,13.97 2,12A10,10 0 0,1 12,2M12,4A8,8 0 0,0 4,12C4,13.72 4.54,15.31 5.46,16.61L4.5,19.5L7.39,18.54C8.69,19.46 10.28,20 12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4Z" /></svg> <span>WhatsApp</span></button>
<section class="popup">
<header class="popup__header">
<div class="popup__close"></div>
<h3 class="popup__title">Olá, seja bem vindo!<br>Escolha um departamento e fale conosco diretamente via WhatsApp.</h3>
</header>
<ul class="attendants">
<li class="attendant attendants__item">
<a href="https://api.whatsapp.com/send?phone=5562993396662&text=Olá, acabo de entrar em contato através do site. Pode me ajudar?" target="_blank">
<figure class="attendant__figure"><img src="assets/img/attendant1.png" class="responsive"></figure>
<div class="attendant__info">
<h5 class="attendant__office">Financeiro</h5>
<h4 class="attendant__name">John Doe</h4>
</div>
</a>
</li>
<li class="attendant attendants__item">
<a href="https://api.whatsapp.com/send?phone=5562993396662&text=Olá, acabo de entrar em contato através do site. Pode me ajudar?" target="_blank">
<figure class="attendant__figure"><img src="assets/img/attendant2.png" class="responsive"></figure>
<div class="attendant__info">
<h5 class="attendant__office">Comercial</h5>
<h4 class="attendant__name">Tom Doe</h4>
</div>
</a>
</li>
<li class="attendant attendants__item">
<a href="https://api.whatsapp.com/send?phone=5562993396662&text=Olá, acabo de entrar em contato através do site. Pode me ajudar?" target="_blank">
<figure class="attendant__figure"><img src="assets/img/attendant3.png" class="responsive"></figure>
<div class="attendant__info">
<h5 class="attendant__office">Suporte</h5>
<h4 class="attendant__name">Harry Doe</h4>
</div>
</a>
</li>
</ul>
</section>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="assets/js/functions.js"></script>
</body>
</html>