index.html 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>Bankline</title>
  8. <meta name="description" content="Simgle page basic server optimized for speed and PWA">
  9. <!-- Above the fold styles -->
  10. <style></style>
  11. <!-- Non blocking styles -->
  12. <link rel="preload" href="styles.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
  13. <noscript><link rel="stylesheet" href="styles.css"></noscript>
  14. <!-- PWA stuff -->
  15. <link rel="manifest" href="manifest.json">
  16. <meta name="theme-color" content="white">
  17. <link rel="apple-touch-icon" href="apple-touch-icon.png">
  18. <link rel="preconnect" href="https://fonts.gstatic.com">
  19. <!-- Non blocking font -->
  20. <link rel="preload" href="https://fonts.googleapis.com/css2?family=Signika:wght@300&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'">
  21. <noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Signika:wght@300&display=swap"></noscript>
  22. <link href="crop_square.svg" rel="shortcut icon" type="image/x-icon">
  23. </head>
  24. <body>
  25. <header>
  26. <p> Banco Fontineli </p>
  27. </header>
  28. <div class="container">
  29. <h1> Formulário de cadastro </h1>
  30. <section class ="wrapper">
  31. <div class ="name">
  32. <label for="name"><b>Nome</b></label>
  33. <input type="nome" placeholder="Digite seu nome" name="nome" class="required">
  34. </div>
  35. <div>
  36. <label for="cpf"><b>CPF</b> <span>inválido</span></label>
  37. <input onkeydown="cpfMask()" maxlength="14" type="text" placeholder="Digite seu cpf" id="cpf"class="required">
  38. </div>
  39. <div>
  40. <label for="rg"><b>RG</b></label>
  41. <input type="nome" placeholder="Digite seu RG" name="rg">
  42. </div>
  43. <div>
  44. <label for="sexo"><b>Sexo</b></label>
  45. <select id="sexo" class="w100">
  46. <option selected>Escolha seu sexo</option>
  47. <option value="feminino">Feminino</option>
  48. <option value="masculino">Masculino</option>
  49. <option value="outro">Outro</option>
  50. </select>
  51. </div>
  52. <div>
  53. <label for="cep"><b>CEP</b></label>
  54. <input type="text" placeholder="Digite seu CEP" name="cep" onblur="searchCep(this.value)">
  55. </div>
  56. <div>
  57. <label for="endereco"><b>Endereço</b></label>
  58. <input type="text" placeholder="Digite seu endereço" name="endereco" class="required" id="endereco">
  59. </div>
  60. <div>
  61. <label for="numero"><b>Número</b></label>
  62. <input type="text" placeholder="Digite o número" name="numero" class="required w100">
  63. </div>
  64. <div>
  65. <label for="bairro"><b>Bairro</b></label>
  66. <input type="nome" placeholder="Digite seu bairro" name="bairro" id="bairro">
  67. </div>
  68. <div>
  69. <label for="cidade"><b>Cidade</b></label>
  70. <input type="nome" placeholder="Digite sua cidade" name="cidade" id="cidade">
  71. </div>
  72. <div>
  73. <label for="estado"><b>Estado</b></label>
  74. <input type="text" placeholder="Digite seu estado" name="estado" id="estado" class="w100">
  75. </div>
  76. <div>
  77. <label for="fixo"><b>Telefone fixo</b></label>
  78. <input type="text" placeholder="Digite o número do seu fixo" name="fixo">
  79. </div>
  80. <div>
  81. <label for="celular"><b>Telefone celular</b></label>
  82. <input onkeydown="phoneMask()" type="text" placeholder="Digite número do celular" maxlength="15"id="celular" class="required">
  83. </div>
  84. <div>
  85. <button onclick="return validate()" type="submit" class="signupbtn">Enviar</button>
  86. </div>
  87. </section>
  88. </div>
  89. <footer>
  90. <p>Direitos reservados a Gabriel Fontineli</p>
  91. </footer>
  92. <!-- Assync scripts -->
  93. <script type="text/javascript" src="scripts.js" async></script>
  94. </body>
  95. </html>