-
Notifications
You must be signed in to change notification settings - Fork 0
/
c6bank.html
82 lines (72 loc) · 5.42 KB
/
c6bank.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
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Banco com Conta Digital, Cartão sem tarifas e mais | C6 Bank</title>
<link rel="stylesheet" href="./assets/css/main.css">
<script type="text/javascript" src="./assets/js/main.js" defer></script>
<!-- MIME Type: (type = "...") -->
</head>
<body>
<header class="top-site">
<div>
<svg class="jss6 jss12" viewBox="0 0 120 24" xmlns="http://www.w3.org/2000/svg">
<path clip-rule="evenodd" shape-rendering="geometricPrecision"
d="M15.034 16.045c.778-.681 1.285-1.576 1.524-2.684h7.68c-.352 3.167-1.627 5.731-3.824 7.694C18.216 23.018 15.51 24 12.298 24c-2.343 0-4.452-.515-6.328-1.544-1.876-1.029-3.34-2.459-4.392-4.29C.526 16.335 0 14.28 0 12c0-2.28.526-4.335 1.578-6.166C2.63 4.003 4.094 2.573 5.97 1.544 7.846.514 9.955 0 12.298 0c3.161 0 5.83.947 8.007 2.842 2.176 1.894 3.462 4.377 3.855 7.448H16.59c-.321-1.013-.87-1.828-1.648-2.446-.777-.617-1.648-.926-2.612-.926-1.327 0-2.397.467-3.21 1.401-.815.934-1.221 2.161-1.221 3.68 0 1.51.41 2.732 1.228 3.666.82.934 1.886 1.4 3.203 1.4 1.026 0 1.928-.34 2.705-1.02zm27.26-6.24c1.491 1.43 2.237 3.28 2.237 5.547 0 2.592-.858 4.682-2.575 6.268-1.718 1.587-3.98 2.38-6.79 2.38-2.776 0-5.033-.796-6.772-2.388-1.74-1.593-2.609-3.656-2.609-6.193 0-1.385.239-2.779.716-4.181.477-1.402 1.215-2.936 2.214-4.6l3.53-5.87 7.46-.001-4.177 6.926c.417-.022.746-.033.988-.033 2.359 0 4.284.715 5.777 2.145zm-5.037 7.675c.537-.547.806-1.256.806-2.128 0-.871-.269-1.586-.806-2.145-.538-.559-1.235-.838-2.09-.838-.856 0-1.554.28-2.09.838-.539.559-.807 1.274-.807 2.145 0 .872.268 1.581.806 2.128.537.548 1.235.822 2.09.822.856 0 1.553-.274 2.09-.822zm21.259-6.52c2.65.784 4.324 3.129 4.324 6.16 0 1.675-.578 3.13-1.718 4.325-1.133 1.186-2.554 1.788-4.224 1.788h-7.226a.101.101 0 0 1-.1-.102V.869c0-.056.044-.102.1-.102h6.365c1.547 0 2.824.517 3.793 1.538.996.98 1.504 2.29 1.504 3.887 0 2.142-1.063 3.908-2.818 4.768zm2 9.912c1.016-1.035 1.51-2.262 1.51-3.753 0-1.656-.507-3.013-1.507-4.031-1.035-1.053-2.31-1.566-3.898-1.566h-6.234v10.881h6.51c1.432 0 2.65-.515 3.619-1.53zM50.386 1.597v9.096h5.651c1.322 0 2.405-.422 3.221-1.253.837-.852 1.261-1.945 1.261-3.248 0-2.706-1.843-4.595-4.482-4.595h-5.65zm69.595 21.475a.101.101 0 0 1-.081.16h-.758a.1.1 0 0 1-.083-.043l-8.099-11.565-3.577 4.206v7.3a.101.101 0 0 1-.1.103h-.602a.101.101 0 0 1-.1-.102V.869c0-.056.045-.102.1-.102h.602c.055 0 .1.046.1.102v13.724L119 .803a.101.101 0 0 1 .077-.036h.796c.056 0 .101.046.101.102 0 .025-.01.048-.024.066l-8.451 10.032 8.482 12.105zM101.496.767c.055 0 .1.046.1.102v22.262a.101.101 0 0 1-.1.102h-.277a.098.098 0 0 1-.081-.042l-14.58-20.6v20.54a.101.101 0 0 1-.1.102h-.614a.101.101 0 0 1-.1-.102V.869c0-.056.045-.102.1-.102h.39a.1.1 0 0 1 .08.042l14.467 20.44V.87c0-.056.045-.102.1-.102h.615zM82.118 23.095a.101.101 0 0 1-.094.138h-.638a.1.1 0 0 1-.094-.068l-2.552-6.883H68.337l-2.551 6.885a.1.1 0 0 1-.094.066h-.639a.101.101 0 0 1-.093-.139L73.25.833a.1.1 0 0 1 .094-.066h.388a.1.1 0 0 1 .095.067l8.29 22.261zm-13.482-7.643h9.806L73.54 2.369l-4.903 13.083z">
</path>
</svg>
</div>
<nav>
<ul>
<li><a href="#">Pessoa Física</a></li>
<li><a href="#">Pessoa Jurídica</a></li>
<li><a href="#">C6 MEI</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Tire suas dúvidas</a></li>
</ul>
</nav>
<button class="top-button open-account" title="Abra sua conta">Abra sua conta</button>
</header>
<section class="full-banner">
<div class="destak">
<h3><span>C6 GLOBAL INVEST</span> Bolsa Americana e fundos globais direto no app</h3>
<h1>O banco da vida de<br>20 milhões de pessoas</h1>
<h2>Conta digital, cartão de crédito, investimento e mais:<br>tudo em um só app.</h2>
<button>Nossos produtos</button>
</div>
</section>
<footer></footer>
<script>
const HEADER = document.querySelector('.top-site');
const BUTTON = document.querySelector('.top-button');
const BODY = document.querySelector('body');
const SVG = document.querySelector('.jss6');
HEADER.style.background = 'none';
//JS = linguagem dirigida a eventos.
BUTTON.classList.add('disabled');
window.addEventListener('scroll', e => {
// const ARRAY_A = HEADER.querySelectorAll('a');
console.log(BODY.clientHeight);
if (window.scrollY < 100) {
HEADER.style.background = 'none';
BUTTON.classList.add('disabled');
} else {
// ARRAY_A.forEach(item => item.style.color = '#000');
HEADER.style.background = "#FFF";
BUTTON.classList.remove('disabled');
SVG.style.fill = "#000"
HEADER.classList.remove('footer-link-a');
}
if (window.scrollY >= BODY.clientHeight - 1800) {
// ARRAY_A.forEach(item => item.style.color = '#FFF');
HEADER.style.background = "#000";
SVG.style.fill = "#fff";
HEADER.classList.add('footer-link-a')
}
})
//função mais simples = Arrow function
</script>
</body>
</html>