HAXY

▄▀▀▄ ▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀ ▄▄▀▀▀▀▀▀ ▄▄▄ ▄▀▀▀▀▀▀▀▀▀▀▀▀▀▄ ▄▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▄ ▄▀▀▀▀▀▀▀▀▀▀▀▀▀▀▄▀▀▀▄ ▄▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▄▄ ▄▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▄▄ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▄ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀ ▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀ ▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀▀▀ ▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀▀ ▄▀▀ ▄▀▀▀▀▀▀ ▀▀▀▀▀▀▀▀▀▀ ▀▀▀ ▀▀▀▀▀▀▄ ▀▀▀▀▀▀▀▀ ▀▀▀ ▀▀▀▀▀▀▀ ▀▀▀▀▀▀ ▀▀▀ ▀▀▀▀▀▀ ▀▀▀▀▀▀ ▀▀▀ ▀▀▀▀▀▀▀ ▀▀▀▀▀▀▄ ▀▀▀ ▀▀▀▀▀▀ ▀▀▀▀▀▀▀ ▀▀▀ ▀▀▀▀▀ ▀▀▀▀▀ ▀▀▀ ▀▀▀▀ ▀▀▀▀ ▄▀▀ ▄▀▀▀▀ ▀▀▀▀ ▀▀▀ ▀▀▀▀▀ ▀▀▀▀▄ ▀▀▀ ▄▀▀▀▀ ▀▀▀▀▀ ▀▀▀ ▀▀▀▀▀▀ ▀▀▀▀▀ ▀▀▀ ▀▀▀▀▀▀▀ ▀▀▀▀▀ ▀▀ ▄▀▀▀▀▀▀▀ ▀▀▀▀▄ ▀▀▀▀▀▀▀ ▀▀▀▀▀

╭ index.html ───────────────────────────────────────────────────╮ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ ╰───────────────────────────────────────────────────────────────╯

╭────╮ ╭ clone ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ╮ │http│ ssh │ │ ╰────╯ ╰ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ╯

.. ansi/ ╭─────────────────────────────────╮ │index.html │ ╰─────────────────────────────────╯ not-found.txt script.js term.ttf

1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8"> 5 <title>HAXY</title> 6 <style> 7 html { 8 --bg: rgba(0, 50, 70, 1.0); 9 --fg: rgba(200, 200, 200, 1.0); 10 background-color: var(--bg); 11 color: var(--fg); 12 } 13 14 /* no body margin because it could push content past the viewport and 15 add a window scrollbar */ 16 body { 17 margin: 0; 18 } 19 20 @font-face { 21 font-family: '3270'; 22 src: url('/term.ttf') format('truetype'); 23 } 24 25 .page { 26 font-family: '3270', monospace; 27 font-size: 20px; 28 line-height: 20px; 29 position: relative; 30 } 31 32 #grid { 33 white-space: pre; 34 /* positioning context for the top-level .scroll divs */ 35 position: relative; 36 } 37 38 .ansi-art { 39 position: absolute; 40 top: 0; 41 pointer-events: none; 42 } 43 44 .grid-content { 45 position: relative; 46 } 47 48 body:has(#grid .scroll:not([data-scroll-direction="horiz"])) { 49 height: 100vh; 50 overflow: hidden; 51 } 52 53 /* each web-native Scroll widget: a box positioned over its viewport 54 (left/top/width/height and per-axis overflow come inline, the latter 55 from the widget's scroll direction) */ 56 .scroll { 57 position: absolute; 58 /* scrollbars are hidden; panes scroll via wheel/trackpad and via 59 scrollIntoView on keyboard focus, so a visible bar would only 60 cover content. (Firefox / WebKit respectively.) */ 61 scrollbar-width: none; 62 } 63 .scroll::-webkit-scrollbar { 64 display: none; 65 } 66 67 /* render each colored cell-run as an inline-block to prevent 68 horizontal seams between rows of the block art. */ 69 #grid span { 70 display: inline-block; 71 vertical-align: top; 72 } 73 74 /* a double-width rune pinned to its two grid cells so its advance 75 width can't shift the rest of the row. */ 76 #grid .w2 { 77 width: 2ch; 78 overflow: hidden; 79 } 80 81 /* native controls are positioned over the matching TUI cells. */ 82 .page input, 83 .page textarea, 84 .page button { 85 position: absolute; 86 font: inherit; 87 padding: 0; 88 margin: 0; 89 outline: none; 90 box-sizing: border-box; 91 } 92 93 .page input, 94 .page textarea { 95 color: inherit; 96 background: transparent; 97 border: none; 98 } 99 100 /* the TUI border cells own the frame, so the textarea can't be 101 drag-resized past them */ 102 .page textarea { 103 resize: none; 104 overflow-y: auto; 105 } 106 107 /* the TUI cells under the button render the border + label; 108 the native button stays transparent so they show through 109 and just owns the click + form-submit behavior. */ 110 .page button { 111 background: transparent; 112 color: transparent; 113 border: none; 114 cursor: pointer; 115 } 116 117 #grid a { 118 color: inherit; 119 text-decoration: none; 120 } 121 122 #grid .clickable { 123 cursor: pointer; 124 } 125 126 #grid a.cell-link:hover { 127 text-decoration: underline; 128 } 129 </style> 130 </head> 131 <body> 132 <div class="page"> 133 <div id="grid">{{{ HAXY_HTML }}}</div> 134 </div> 135 <script id="page-data" type="application/json">{{{ HAXY_JSON }}}</script> 136 <script src="/script.js"></script> 137 </body> 138 </html> 139