broadfield-dev/stack-overflow-game
0
1<!DOCTYPE html>2<html lang="en">3<head>4 <meta charset="UTF-8">5 <meta name="viewport" content="width=device-width, initial-scale=1.0">6 <title>Retro Tetris</title>7 <meta name="twitter:card" content="player"/>8 <meta name="twitter:site" content=""/>9 <meta name="twitter:player" content="https://broadfield-dev-stack-overflow-game.hf.space"/>10 <meta name="twitter:player:stream" content="https://broadfield-dev-stack-overflow-game.hf.space"/>11 <meta name="twitter:player:width" content="100%"/>12 <meta name="twitter:player:height" content="100%"/> 13 <meta property="og:title" content="Retro Tetris"/>14 <meta property="og:description" content="Interactive X App"/>15 <meta property="og:image" content="https://huggingface.co/spaces/Space-Share/iLearn/resolve/main/card_im_crop.png"/>16 <style>17 @font-face {18 font-family: 'RetroArcade';19 src: url('/assets/fonts/RetroArcade.ttf') format('truetype');20 }21 body {22 margin: 0;23 padding: 0;24 background: #000;25 display: flex;26 flex-direction: column;27 justify-content: center;28 align-items: center;29 min-height: 100vh;30 font-family: 'RetroArcade', monospace;31 }32 #tv-frame {33 position: relative;34 width: 100%;35 height: 500px;36 background: url(assets/tv.png) no-repeat center;37 background-size: contain;38 align-content: center;39 }40 #game-container {41 position: relative;42 width: 512px;43 height: 390.25px;44 /* left: 200px; */45 /* top: 46.75px; */46 place-self: anchor-center;47 }48 #game-container canvas {49 image-rendering: -moz-crisp-edges;50 image-rendering: -webkit-crisp-edges;51 image-rendering: pixelated;52 image-rendering: crisp-edges;53 width: 100% !important;54 height: 100% !important;55 }56 #credits {57 margin-top: 20px;58 font-size: 11px;59 color: #eeeeee;60 text-align: center;61 font-family: Arial, sans-serif;62 }63 #credits a {64 color: #eeeeee;65 text-decoration: none;66 }67 #credits a:hover {68 text-decoration: underline;69 }70 </style>71</head>72<body>73 <div id="tv-frame">74 <div id="game-container"></div>75 </div>76 <div id="credits">77 Created by Marco van Hylckama Vlieg - <a href="https://ai-created.com" target="_blank">ai-created.com</a> - <a href="https://x.com/AIandDesign" target="_blank">x.com/AIandDesign</a>78 </div>79 <script type="module" src="/src/main.js"></script>80</body>81</html>82 83