Demo tweaks (snaplet#30)

* Update link to demo.

* Remove blur + animations.

* Rename repo.

Author: peterp

README.md

@@ -1,10 +1,10 @@
 <div align="center">
-  <h1 align="center">Postgres Browser</h1>
+  <h1 align="center">Postgres WASM</h1>
   <p align="center">A PostgresQL server instance running in a virtual machine running in the browser<br />
   <i>by Supabase &amp; Snaplet</i></p>
   <img align="center" src="https://user-images.githubusercontent.com/44849/192262287-29d1ecb2-8ff7-40cb-bd1f-68d707493a86.png" alt="Snaplet, Supabase and friends" width="480">
   <br /><br />
-  <a href="about:blank">Demo</a>
+  <a href="https://postgres-wasm.netlify.com">Demo</a>
   <span>&nbsp;&nbsp;•&nbsp;&nbsp;</span>
   <a href="https://app.snaplet.dev/chat">Discord</a>
   <span>&nbsp;&nbsp;•&nbsp;&nbsp;</span>

packages/runtime/index.html

@@ -75,7 +75,6 @@
                     if (line.startsWith("postgres=# boot_completed")) {
                         emulator.remove_listener(handleBoot);
                         setTimeout(() => {
-                            document.getElementById("terminal").style = 'filter: none;';
                             emulator.serial_adapter.term.focus();
                         }, 300);
                     }
@@ -165,7 +164,7 @@
     <hr />
     <div class="container">
         <div class="xterminal">
-            <div id="terminal" style="filter: blur(3px);"></div>
+            <div id="terminal"></div>
         </div>
     </div>
 </body>

packages/runtime/styles.css

@@ -24,7 +24,6 @@ body {
 	width: calc(80ch + 16px * 2);
 	height: 60%;
 	background: black;
-	/* linear-gradient(0deg, #000, #272727); */
 	border-radius: 7px;
 	display: flex;
 }
@@ -42,7 +41,6 @@ body {
 	width: calc(100% + 2px);
 	height: calc(100% + 2px);
 	z-index: -1;
-	animation: steam 120s linear infinite;
 }
 
 .xterm .xterm-viewport {
@@ -60,19 +58,6 @@ body {
 	background: var(--highlight);
 }
 
-@keyframes steam {
-	0% {
-		background-position: 0 0;
-	}
-
-	50% {
-		background-position: 400% 0;
-	}
-
-	100% {
-		background-position: 0 0;
-	}
-}
 
 .xterminal:after {
 	filter: blur(50px);