adiciona tela home e cadastro
parents
Showing
README.md
0 → 100644
index.html
0 → 100644
package-lock.json
0 → 100644
This source diff could not be displayed because it is too large.
You can
view the blob
instead.
package.json
0 → 100644
| { | ||
| "name": "ntflix-ntlabs", | ||
| "description": "A Vue.js project", | ||
| "version": "1.0.0", | ||
| "author": "Daniela Olinda", | ||
| "license": "MIT", | ||
| "private": true, | ||
| "scripts": { | ||
| "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", | ||
| "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" | ||
| }, | ||
| "dependencies": { | ||
| "vue": "^2.5.11" | ||
| }, | ||
| "browserslist": [ | ||
| "> 1%", | ||
| "last 2 versions", | ||
| "not ie <= 8" | ||
| ], | ||
| "devDependencies": { | ||
| "babel-core": "^6.26.0", | ||
| "babel-loader": "^7.1.2", | ||
| "babel-preset-env": "^1.6.0", | ||
| "babel-preset-stage-3": "^6.24.1", | ||
| "cross-env": "^5.0.5", | ||
| "css-loader": "^0.28.7", | ||
| "file-loader": "^1.1.4", | ||
| "vue-loader": "^13.0.5", | ||
| "vue-template-compiler": "^2.4.4", | ||
| "webpack": "^3.6.0", | ||
| "webpack-dev-server": "^2.9.1" | ||
| } | ||
| } |
src/App.vue
0 → 100644
| <template> | ||
| <div class= "home"> | ||
| <div class="Menu-Principal"> | ||
| <ul> | ||
| <li><a href="#home">Home</a></li> | ||
| <li><a href="#news">cadastro</a></li> | ||
| <li><a href="#contact">planos</a></li> | ||
| <li><a href="#about">login</a></li> | ||
| </ul> | ||
| </div> | ||
| <br><br><br><br> | ||
| <div class="blocologo"> <img class="img-responsive img-logo" alt="Vue logo" src="./assets/NTFLIXLogo - Copia.jpg"></div> | ||
| <div conteiner ="filmes"> | ||
| <fieldset> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://animesonline.vip/power-rangers-dublado/"> | ||
| <img src="./assets/09-Power-Rangers-1-Temporada.jpg" alt="Forest" width="1000" height="900"> | ||
| </a> | ||
| <div class="desc"> | ||
| power rangers<br> | ||
| A jornada de cinco adolescentes que devem buscar algo extraordinário quando eles tomam consciência | ||
| que a sua pequena cidade Angel Grove - e o mundo - estão à beira de sofrer um ataque alienígena. Escolhidos | ||
| pelo destino, eles irão descobrir que são os únicos que poderão salvar | ||
| o planeta. Mas para isso, eles devem superar seus problemas pessoais e juntarem sua forças, antes que seja tarde demais. | ||
| </div> | ||
| </div> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://animesonline.vip/os-cavaleiros-do-zodiaco-dublado/"> | ||
| <img src="./assets/cavaleiros.jpg" alt="Forest" width="600" height="400"> | ||
| </a> | ||
| <div class="desc"> | ||
| <p>cavaleiros de zodiaco</p> | ||
| conta a história de um grupo de cinco jovens guerreiros | ||
| cuja função era proteger Saori Kido, reencarnação de Atena, a deusa grega da sabedoria. Para lutar, | ||
| eles utilizam a energia interior e do cosmos, e suas armaduras que são inspiradas em constelações e | ||
| na mitologia grega. | ||
| </div> | ||
| </div> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://www.anitube.site/25883/"> | ||
| <img src="./assets/04-Entenda-Melhor-SAILOR-MOON-1.jpg" alt="Sailon Moon" width="300" height="200"> | ||
| </a> | ||
| <div class="desc"> | ||
| Sailor Moon <br> | ||
| Usagi Tsukino, uma estudante do ensino médio de 14 anos, descobre por meio de uma gata falante | ||
| chamada Luna que é uma guerreira mágica, com habilidades especiais. Ela então se transforma em | ||
| Sailor Moon e, junto com suas amigas também superpoderosas, está destinada a proteger a Terra das forças do mal | ||
| </div> | ||
| </div> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://animesonline.vip/caverna-do-dragao/"> | ||
| <img src="./assets/cavena-do-dragao.jpg" alt="Forest" width="600" height="400"> | ||
| </a> | ||
| <div class="desc">Caverna do Dragão | ||
| conta a história de seis jovens que, durante uma brincadeira numa montanha-russa, | ||
| são transportados num portal para um Reino. Lá, com armas e roupas mágicas, eles contam | ||
| com dicas do Mestre dos Magos para se livrar dos vilões e voltar para suas casas | ||
| </div> | ||
| </div> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://animesbr.biz/anime/dragon-ball/"> | ||
| <img src="./assets/Dragon-Ball-Super-brasil.jpg" alt="Forest" width="600" height="400"> | ||
| </a> | ||
| <div class="desc"> | ||
| Dragon Ball Z | ||
| A série segue as aventuras do protagonista, Son Goku, desde sua infância até a idade adulta enquanto ele | ||
| treina artes marciais e explora o mundo em busca de sete esferas conhecidas como as Esferas do Dragão, | ||
| que convocam um dragão que concede um desejo quando reunidas. | ||
| </div> | ||
| </div> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://animesonline.cc/anime/samurai-x/"> | ||
| <img src="./assets/samurai.jpg" alt="Forest" width="600" height="400"> | ||
| </a> | ||
| <div class="desc"> | ||
| Samurai X | ||
| A série, ambientada nos primeiros anos da Era Meiji no Japão, conta a história de Kenshin Himura | ||
| um pacífico espadachim que prometeu nunca mais matar. Entretanto, seu passado como retalhador a | ||
| serviço da Ishin Shishi fará o jovem Himura brandir novamente sua espada contra velhos e novos inimigos. | ||
| </div> | ||
| </div> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://goyabu.org/animes/transformers-cyberverse"> | ||
| <img src="./assets/transformes.jpg" alt="Forest" width="600" height="400"> | ||
| </a> | ||
| <div class="desc">transformers cyberverse | ||
| A recém-formada equipe de Autobots deve impedir que a Shockwave destrua toda a vida no planeta. | ||
| A equipe Autobot finalmente descobre a localização da Arca. A equipe Autobot deve lutar contra o | ||
| Shockwave e seus Decepticons para defender a Arca e despertar o Optimus Prime e os outros Autobots. | ||
| </div> | ||
| </div> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://animesonlinen.com/legendados/532990"> | ||
| <img src="./assets/naruto.jpg" alt="Forest" width="1000" height="900"> | ||
| </a> | ||
| <div class="desc"> | ||
| Naruto<br> | ||
| Naruto é um jovem órfão habitante da Vila da Folha que sonha se tornar o quinto Hokage, o maior guerreiro | ||
| e governante da vila. Ao se graduar como ninja, descobre que tem um demônio raposa selado dentro de si. | ||
| </div> | ||
| </div> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://animesonlinegames.com/animes/as-meninas-super-poderosas/a"> | ||
| <img src="./assets/as-meninas-superpoderosas-hbo-max.jpg" alt="Forest" width="1000" height="900"> | ||
| </a> | ||
| <div class="desc"> | ||
| meninas super poderosas | ||
| Desiludidas de que perderam a infância por estarem combatendo o crime, | ||
| as irmãs enfrentam vários dilemas em suas vidas pessoais e, quando o mundo precisa delas novamente, se | ||
| sentem divididas em voltarem ao papel de super-heroínas. | ||
| </div> | ||
| </div> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://animefire.net/animes/ultraman-dublado-todos-os-episodios"> | ||
| <img src="./assets/ultraman.jpg" alt="Forest" width="500" height="1500"> | ||
| </a> | ||
| <div class="desc"> | ||
| ultraman <br> | ||
| Um alienígena vindo da Galáxia M-78 a bordo de uma cúpula vermelha, ao perseguir o monstro Bemular, | ||
| choca-se com a nave do oficial Hayata da S.I.A Hayata não suporta a gravidade dos ferimentos e morre. | ||
| Para reparar o erro, o alienígena funde sua energia vital à de Hayata, trazendo-o de volta a vida | ||
| e entregando-lhe a Cápsula Beta. e agora Hayata pode se | ||
| transformar em Ultraman para defender a Terra de qualquer ameaça. | ||
| </div> | ||
| </div> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://www.anitube.site/6428/"> | ||
| <img src="./assets/yu-gi-oh.png" alt="Forest" width="1000" height="900"> | ||
| </a> | ||
| <div class="desc"> | ||
| yu-gi-oh<br> | ||
| O jovem estudante do ensino médio Yugi Muto derrota o campeão mundial, Seto Kaiba, em um duelo | ||
| de cartas com a misteriosa ajuda do quebra-cabeça Millenium. Em razão de sua vitória inesperada, | ||
| Yugi se torna famoso em todo o mundo e passa a participar de outros duelos para salvar os amigos e a | ||
| família. | ||
| </div> | ||
| </div> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://animesonlinegames.com/animes/pica-pau/a"> | ||
| <img src="./assets/Pica-Pau-.jpg" alt="Forest" width="1000" height="900"> | ||
| </a> | ||
| <div class="desc"> | ||
| Pica Pal<br> | ||
| O pássaro falante Pica-Pau sempre tenta se dar bem em qualquer situação. Na companhia de seu amigo, | ||
| o cavalo medroso Pé de Pano, ele adora pregar peças em seus inimigos Zeca Urubu, Zé Jacaré, Meany | ||
| Ranheta, entre outros. | ||
| </div> | ||
| </div> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://animesonlinegames.com/animes/he-man/a"> | ||
| <img src="./assets/He-man.jpg" alt="Forest" width="1000" height="900"> | ||
| </a> | ||
| <div class="desc"> | ||
| He-Man <br> | ||
| He-Man é o homem mais poderoso do universo. Ele enfrenta as forças do mal para salvar o planeta Eternia dos | ||
| planos de Esqueleto, e proteger os segredos do Castelo de Grayskull. | ||
| </div> | ||
| </div> | ||
| <div class="img"> | ||
| <a target="_blank" href="https://animesonline.vip/w-i-t-c-h-dublado/"> | ||
| <img src="./assets/witch.jpg" alt="Forest" width="1000" height="900"> | ||
| </a> | ||
| <div class="desc"> | ||
| Witch <br> | ||
| , o desenho animado conta a história de cinco meninas: Will, Irma, Taranee, | ||
| Cornélia e Hay Lin que ganharam poderes mágicos e se tornaram as "Guardians of | ||
| the Veil" (Guardiãs do Véu). | ||
| </div> | ||
| </div> | ||
| </fieldset> | ||
| </div> | ||
| <div class="Menu"> | ||
| <h1>Cadastro </h1> | ||
| <!--Dados de Pessoais--> | ||
| <fieldset> | ||
| <legend>Dados Pessoais</legend> | ||
| <table cellspacing="10"> | ||
| <tr> | ||
| <td> | ||
| <label for="nome">Nome: </label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="text" name="nome"> | ||
| </td> | ||
| <td> | ||
| <label for="sobrenome">Sobrenome: </label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="text" name="sobrenome"> | ||
| </td> | ||
| <td> | ||
| <label for="sobrenome">Sexo: </label> | ||
| </td> | ||
| <td> | ||
| <select name="sexo"> | ||
| <option value="ac">Masculino</option> | ||
| <option value="al">Feminino</option> | ||
| <option value="am">Prefiro não informar</option> | ||
| </select> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td> | ||
| <label>Nascimento: </label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="text" name="dia" size="2" maxlength="2" value="dd"> | ||
| <input type="text" name="mes" size="2" maxlength="2" value="mm"> | ||
| <input type="text" name="ano" size="4" maxlength="4" value="aaaa"> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td> | ||
| <label for="rg">E-mail: </label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="text" name="rg" size="13" maxlength="13"> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td> | ||
| <label>CPF:</label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="text" name="cpf" size="9" maxlength="9"> - <input type="text" name="cpf2" size="2" maxlength="2"> | ||
| </td> | ||
| </tr> | ||
| </table> | ||
| </fieldset> | ||
| <!--Dados de Endereço--> | ||
| <fieldset> | ||
| <legend>Dados de Endereço</legend> | ||
| <table cellspacing="10"> | ||
| <tr> | ||
| <td> | ||
| <label for="rua">Rua:</label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="text" name="rua"> | ||
| </td> | ||
| <td> | ||
| <label for="numero">Numero:</label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="text" name="numero" size="4"> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td> | ||
| <label for="bairro">Bairro: </label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="text" name="bairro"> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td> | ||
| <label for="estado">Estado:</label> | ||
| </td> | ||
| <td align="left"> | ||
| <select name="estado"> | ||
| <option value="ac">Acre</option> | ||
| <option value="al">Alagoas</option> | ||
| <option value="am">Amazonas</option> | ||
| <option value="ap">Amapá</option> | ||
| <option value="ba">Bahia</option> | ||
| <option value="ce">Ceará</option> | ||
| <option value="df">Distrito Federal</option> | ||
| <option value="es">Espírito Santo</option> | ||
| <option value="go">Goiás</option> | ||
| <option value="ma">Maranhão</option> | ||
| <option value="mt">Mato Grosso</option> | ||
| <option value="ms">Mato Grosso do Sul</option> | ||
| <option value="mg">Minas Gerais</option> | ||
| <option value="pa">Pará</option> | ||
| <option value="pb">Paraíba</option> | ||
| <option value="pr">Paraná</option> | ||
| <option value="pe">Pernambuco</option> | ||
| <option value="pi">Piauí</option> | ||
| <option value="rj">Rio de Janeiro</option> | ||
| <option value="rn">Rio Grande do Norte</option> | ||
| <option value="ro">Rondônia</option> | ||
| <option value="rs">Rio Grande do Sul</option> | ||
| <option value="rr">Roraima</option> | ||
| <option value="sc">Santa Catarina</option> | ||
| <option value="se">Sergipe</option> | ||
| <option value="sp">São Paulo</option> | ||
| <option value="to">Tocantins</option> | ||
| </select> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td> | ||
| <label for="cidade">Cidade: </label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="text" name="cidade"> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td> | ||
| <label for="cep">CEP: </label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="text" name="cep" size="5" maxlength="5"> - <input type="text" name="cep2" size="3" maxlength="3"> | ||
| </td> | ||
| </tr> | ||
| </table> | ||
| </fieldset> | ||
| <!--Dados de Pagamento--> | ||
| <fieldset> | ||
| <div class="input-group"> | ||
| Dados de Pagamento : | ||
| Cartão <input type="text" class="from-input" placeholder=""><br><br> | ||
| Boleto <input type="text" class="from-input" placeholder=" "><br><br> | ||
| PIX <input type="text" class="from-input" placeholder=""><br><br> | ||
| <button class="btn btn-primary input-group-btn">Confirma</button> | ||
| </div> | ||
| </fieldset> | ||
| <!--Dados de Login--> | ||
| <fieldset> | ||
| <legend>Dados de login</legend> | ||
| <table cellspacing="10"> | ||
| <tr> | ||
| <td> | ||
| <label for="email">E-mail: </label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="text" name="email"> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td> | ||
| <label for="imagem">Imagem de perfil:</label> | ||
| </td> | ||
| <td> | ||
| <input type="file" name="imagem" > | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td> | ||
| <label for="login">Login de usuário: </label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="text" name="login"> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td> | ||
| <label for="pass">Senha: </label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="password" name="pass"> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td> | ||
| <label for="passconfirm">Confirme a senha: </label> | ||
| </td> | ||
| <td align="left"> | ||
| <input type="password" name="passconfirm"> | ||
| </td> | ||
| </tr> | ||
| </table> | ||
| <input type="submit"> | ||
| <input type="reset" value="Limpar"> | ||
| </fieldset> | ||
| </div> | ||
| </div> | ||
| </template> | ||
| <script src = "https://unpkg.com/vue-router/dist/vue-router.js"></script> | ||
| <script src = "https://cdn.jsdelivr.net/npm/[email protected]"></script> | ||
| <script src = "https://unpkg.com/vue-router/dist/vue-router.js"></script> | ||
| <script> | ||
| export default { | ||
| name: 'app', | ||
| data () { | ||
| return { | ||
| msg: 'Welcome to Your Vue.js App', | ||
| } | ||
| }, | ||
| } | ||
| </script> | ||
| <style> | ||
| div.img { | ||
| margin: 5px; | ||
| border: 1px solid #ccc; | ||
| float: left; | ||
| width: 180px; | ||
| } | ||
| div.img:hover { | ||
| border: 1px solid #777; | ||
| } | ||
| div.img img { | ||
| width: 100%; | ||
| height: auto; | ||
| } | ||
| div.desc { | ||
| padding: 15px; | ||
| text-align: center; | ||
| } | ||
| a{ | ||
| display: block; | ||
| padding: 8px; | ||
| background-color: #199782; | ||
| } | ||
| #menu li { | ||
| border-right: 1px solid #bbb;height:1px; /* IE5.0 bug */ | ||
| padding: 3px 1px; | ||
| margin:0; | ||
| border: 1px solid #f00; | ||
| background: #999; | ||
| text-decoration: none; | ||
| } | ||
| li:last-child { | ||
| border-right: none; | ||
| } | ||
| .blocologo{ | ||
| text-align: center; | ||
| } | ||
| .img-blocologo{ | ||
| size: 15px; | ||
| max-width: 25px; | ||
| margin-top: 50px; | ||
| text-align: center; | ||
| } | ||
| .menu{ | ||
| height:1px; /* IE5.0 bug */ | ||
| font-size: smaller; | ||
| size: 50px; | ||
| text-align: center; | ||
| background: rgb(7, 148, 96); | ||
| } | ||
| ul { | ||
| list-style-type: none; | ||
| margin: 0; | ||
| padding: 0; | ||
| overflow: hidden | ||
| } | ||
| li{ | ||
| float: left; | ||
| } | ||
| .input-groupdadospessoai{ | ||
| text-align: left; | ||
| } | ||
| .input-groupdadospessoai{ | ||
| text-align: height; | ||
| } | ||
| blocologo{ | ||
| size: 50px; | ||
| text-align: center; | ||
| } | ||
| .filmes{ | ||
| text-align: left; | ||
| max-width: 50px; | ||
| border-block-color: blue; | ||
| } | ||
| .menu{ | ||
| background: rgb(12, 186, 220); | ||
| } | ||
| /*Menu - inicial */ | ||
| .Menu-Principal{ | ||
| width: 100%; | ||
| background: #199782; | ||
| float: left; | ||
| display: block; | ||
| font: medium; | ||
| color: hsl(154, 28%, 95%); | ||
| text-align: center; | ||
| padding: 14px 16px; | ||
| text-decoration: none; | ||
| font-size: 17px; | ||
| border-bottom: 2px solid transparent; | ||
| position: relative; | ||
| top: 0; | ||
| left: 0; | ||
| transform: none; | ||
| } | ||
| </style> |
180 KB
127 KB
146 KB
src/assets/He-man.jpg
0 → 100644
266 KB
23 KB
src/assets/Pica-Pau-.jpg
0 → 100644
108 KB
27.2 KB
src/assets/cavaleiros.jpg
0 → 100644
186 KB
87.3 KB
src/assets/naruto.jpg
0 → 100644
258 KB
src/assets/samurai.jpg
0 → 100644
32.1 KB
src/assets/transformes.jpg
0 → 100644
73.9 KB
src/assets/ultraman.jpg
0 → 100644
199 KB
src/assets/witch.jpg
0 → 100644
8.81 KB
src/assets/yu-gi-oh.png
0 → 100644
907 KB
src/componentes/cadastro.vue
0 → 100644
src/main.js
0 → 100644
webpack.config.js
0 → 100644