1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8" /> 5 <title>Trabajo Practico Sistemas Graficos | Martin Klöckner</title> 6 <link rel="icon" href="data:,"> <!-- Do not request favicon --> 7 <style> 8 html, body, #mainContainer { 9 padding: 0; 10 margin: 0; 11 height: 100%; 12 13 #blocker { 14 position: absolute; 15 width: 100%; 16 height: 100%; 17 background-color: rgba(0,0,0,0.5); 18 backdrop-filter: blur(6px); 19 } 20 21 #instructions { 22 width: 100%; 23 height: 100%; 24 25 /* display: flex; */ 26 display: none; 27 flex-direction: column; 28 justify-content: center; 29 align-items: center; 30 31 padding-top: 0; 32 text-align: center; 33 font-size: 22px; 34 cursor: pointer; 35 36 color: antiquewhite; 37 text-shadow: 1px 1px 3px black; 38 } 39 40 #click-to-play { 41 font-size: 42px; 42 padding: 0em; 43 margin: 0em; 44 } 45 </style> 46 </head> 47 <body> 48 <div id="blocker"> 49 <div id="instructions"> 50 <p id="click-to-play"> 51 Click para Activar Controles 52 </p> 53 <p> 54 Mover: WASD<br> 55 Mover Rápido: Shift+w<br> 56 Mirar: MOUSE<br> 57 Animación del Tren: SPACE<br> 58 Camara siguiente: c<br> 59 Camara anterior: C<br> 60 </p> 61 </div> 62 </div> 63 <script type="module" src="src/scene.js"></script> 64 </body> 65 </html>