A framework-agnostic, universal document renderer with optional chunked loading polyrender.wisp.place/
6
fork

Configure Feed

Select the types of activity you want to include in your feed.

at main 89 lines 2.5 kB view raw
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>PolyRender — Vanilla TS Example</title> 7 <link rel="stylesheet" href="./styles.css" /> 8 <style> 9 * { 10 margin: 0; 11 padding: 0; 12 box-sizing: border-box; 13 } 14 15 body { 16 font-family: 17 system-ui, 18 -apple-system, 19 sans-serif; 20 background: #0f0f0f; 21 color: #e0e0e0; 22 display: flex; 23 flex-direction: column; 24 align-items: center; 25 min-height: 100vh; 26 padding: 2rem; 27 } 28 29 h1 { 30 font-size: 1.5rem; 31 font-weight: 600; 32 margin-bottom: 0.5rem; 33 color: #fff; 34 } 35 36 .subtitle { 37 font-size: 0.875rem; 38 color: #888; 39 margin-bottom: 1.5rem; 40 } 41 42 #viewer { 43 width: 100%; 44 max-width: 900px; 45 height: 80vh; 46 border-radius: 8px; 47 overflow: hidden; 48 border: 1px solid #2a2a2a; 49 } 50 51 .controls { 52 margin-top: 1rem; 53 display: flex; 54 gap: 0.5rem; 55 } 56 57 .controls label { 58 font-size: 0.875rem; 59 color: #aaa; 60 display: flex; 61 align-items: center; 62 gap: 0.5rem; 63 } 64 65 .controls input[type="file"] { 66 font-size: 0.8rem; 67 color: #ccc; 68 } 69 </style> 70 </head> 71 <body> 72 <h1>PolyRender — Vanilla TS Example</h1> 73 <p class="subtitle"> 74 No Vite. Just TypeScript + esbuild. Pick a file below to view it. 75 </p> 76 <div class="controls"> 77 <label> 78 Open a document: 79 <input 80 type="file" 81 id="file-input" 82 accept=".pdf,.epub,.docx,.odt,.ods,.csv,.tsv,.txt,.md,.json,.js,.ts,.py,.rs,.go,.java,.c,.cpp,.html,.xml,.svg,.cbz,.cbr,.cb7,.cbt" 83 /> 84 </label> 85 </div> 86 <div id="viewer"></div> 87 <script type="module" src="./main.js"></script> 88 </body> 89</html>