diff --git a/public/index.php b/public/index.php
index 49e2cd7..ba9c4af 100644
--- a/public/index.php
+++ b/public/index.php
@@ -16,49 +16,63 @@
     along with Foobar. If not, see <https://www.gnu.org/licenses/>.
 -->
 <html>
-
 <?php
-    # Generate an uid for each new document
-    $uid   = exec("head /dev/urandom | tr -dc 'a-zA-Z0-9' | head -c 10");
-    # groff settings
-    $groff = "/usr/bin/groff";
-    $comp = "$groff -ketpG -mspdf -Tpdf tmp/$uid.ms > tmp/$uid.pdf";
-    # In case you want to use an external
-    # script to compile with groff:
-    #$comp = "sh groff-compiler.sh";
-?>
+    exec("mkdir -p gen && rm -rf gen/*");
+    $uid = bin2hex(random_bytes(5));
 
+    # Configuration
+    $groff = "/usr/bin/groff";
+    $cmd = "$groff -ketpG -mspdf -Tpdf gen/$uid.ms > gen/$uid.pdf";
+    # In case you want to use an external script
+    #$cmd = "sh groff-compiler.sh";
+
+    if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['codebox'])) {
+        $code = $_POST['codebox'];
+        file_put_contents("gen/$uid.ms", $code);
+        exec("$cmd");
+    }
+?>
 <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="Minimal web front-end to the GNU roff typesetting program.">
     <title>Groff Web</title>
-    <link rel="shortcut icon" href="#">
     <style>
-        * {
+        body,pre,.button {
             background-color: #121212;
+            color: #928374;
             font-family: monospace;
             text-align: center;
-            margin: 4px auto;
-            color: #928374;
+            border-radius: 10px;
+            border-width: 1px;
+            padding: 10px 30px;
+            margin: 10px auto;
         }
-
-        h1,h2,h3,h4,h5 {
+        textarea,pre,.button {
+            border: 1px solid #3a3e41;
+        }
+        .button:hover {
+            border-color: #928374;
+            color: #fe8019;
+        }
+        strong,a {
+            background-color: #121212;
             color: #fe8019;
         }
-
         textarea,object,.columns {
             border-radius: 10px;
             border-width: 1px;
             max-width: 1300px;
+            margin: 10px auto;
             width: 100%;
             columns: 2;
         }
-
         @media only screen and (max-width: 800px) {
             .columns {
                 columns: 1;
                 width: 90%;
             }
         }
-
         /* codebox */
         textarea {
             background-color: #282828;
@@ -66,56 +80,71 @@
             color: #83a598;
             height: 734px;
         }
-
         /* pdf */
         object {
             height: 800px;
         }
-
-        .button {
-            border-radius: 10px;
-            border-width: 1px;
-            padding: 5px 30px;
-            margin: 10px;
+        pre {
+            text-align: left;
+            white-space: pre-wrap;
+            font-family: monospace;
+        }
+        textarea:focus {
+            outline: none !important;
+            border:1px solid #928374;
         }
     </style>
 </head>
-
-<?php
-    exec("mkdir -p tmp && rm -rf tmp/*");
-    if($_POST['codebox']){
-        $file_open = fopen("tmp/$uid.ms","w+");
-        fwrite($file_open, $_POST['codebox']);
-        fclose($file_open);
-    }
-    exec("$comp");
-?>
-
 <body>
-    <h1>Groff Web</h1>
-    <p><?php echo exec("$groff -v | head -n 1")?></p>
-
-    <div class=columns>
-        <div style="width: 100%"><form method="POST">
-            <div><input type=submit value="Compile PDF" class=button></div>
-
-            <textarea id="codebox" name="codebox"><?php
-                $datalines = file ("tmp/$uid.ms");
-                foreach ($datalines as $zz) {
-                echo $zz; }
-            ?></textarea>
-        </form></div>
-
-        <object type="application/pdf" data="/tmp/<?php echo $uid?>.pdf?#&navpanes=0">
-                <p>PDF cannot be displayed.</p>
+    <header><p>
+        <strong>Groff Web</strong> | <?php echo exec("$groff -v | head -n 1")?>
+    </p> </header>
+    <div class="columns">
+        <form method="POST">
+            <div><input type="submit" value="Compile" class="button"></div>
+            <textarea name="codebox"><?= htmlspecialchars(file_get_contents("gen/$uid.ms")) ?></textarea>
+        </form>
+        <object type="application/pdf" data="/gen/<?php echo $uid?>.pdf?#&navpanes=0">
+            <div><button class="button"><a href="/gen/<?php echo $uid?>.pdf">Download PDF</a></div>
+            <div>
+                <pre><code>
+.\" Template
+.\" .ds FAM T       \" H=Helvetica C=Courier
+.\" .nr PS 10p      \" Point size
+.\" .nr VS 12p      \" Line spacing
+.\" .so report.tmac \" Cover page
+.\" .so utils.tmac  \" General utils
+.\" .so toc.tmac    \" Relocate toc
+.\" .so md.tmac     \" Md-like sections
+.\" .so math.tmac   \" Math utils
+.\" .so es.tmac     \" Spanish
+.
+.TL
+title
+.AU
+author
+.AI
+institution
+.
+.AB
+abstract
+.AE
+.
+.NH
+.XN "numbered heading"
+.
+.PP
+indented \f[CW]paragraph\f[] \m[blue]with\m[] \f[B]some\f[] \f[I]formatting\f[]
+.
+.\" .TC
+                </code></pre>
+            </div>
         </object>
     </div>
-
     <footer><p>
         Copyright (C) 2023 Gustavo Calvo |
         <a href="https://gitlab.com/tavo-wasd/groff-web" target="_blank" rel="noopener noreferrer">Source</a> |
         <a href="https://www.gnu.org/licenses/gpl-3.0.txt" target="_blank" rel="noopener noreferrer">GPL-3.0</a>
     </p></footer>
 </body>
-
-</html> 
+</html>
