53 lines
2.3 KiB
HTML
53 lines
2.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="es">
|
|
<head>
|
|
<meta charset="utf-8"/>
|
|
<meta name="viewport" content="width=device-width"/>
|
|
<link rel="stylesheet" href="./reset.css"/>
|
|
<link rel="stylesheet" href="./style.css"/>
|
|
<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=Press+Start+2P&display=swap"
|
|
rel="stylesheet"/>
|
|
<title>Encriptador de mensajes</title>
|
|
</head>
|
|
<body>
|
|
<main>
|
|
<section id="mensaje" style="border-radius: 25px; padding: 10px; background: magenta;">
|
|
<div>
|
|
<img src="./imagenes/logo.png"/>
|
|
</div>
|
|
<div>
|
|
<label for="frase">Ingresa tu mensaje</label>
|
|
</div>
|
|
<div>
|
|
<textarea id="frase" cols="70" rows="10" class="input-frase"
|
|
required placeholder="Ingresa el texto aquí" autofocus></textarea>
|
|
</div>
|
|
<div id="botones">
|
|
<img src="./imagenes/exclamacion.png"/>
|
|
<p>Solo letras minúsculas y sin acentos</p>
|
|
<!--<small>Solo letras minúsculas y sin acentos</small>-->
|
|
<button id="btn-encriptar">Encriptar</button>
|
|
<button id="btn-desencriptar">Desencriptar</button>
|
|
</div>
|
|
</section>
|
|
<section id="info" style="border-radius: 25px; padding: 10px; background: magenta;">
|
|
<div>
|
|
<img src="./imagenes/mono.png">
|
|
<h2>Ningún mensaje fue encontrado</h2>
|
|
<p>Ingresa el texto que deseas encriptar o desencriptar.</p>
|
|
</div>
|
|
<div style="display: block;">
|
|
<textarea cols="29" rows="15" readonly id="resultado"></textarea>
|
|
<button id="btn-copiar">Copiar</button>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
<footer>
|
|
<a href="https://github.com/DevFzn"><img src="./imagenes/github.png" width="5%"/></a>
|
|
</footer>
|
|
<script src="./encriptador.js"></script>
|
|
</body>
|
|
</html>
|