From ef7bb183b6221f2a7b019d2f1f9fe8b4d598406c Mon Sep 17 00:00:00 2001
From: Adam Argyle <atom@argyleink.com>
Date: Sat, 11 Aug 2018 20:16:11 -0700
Subject: [PATCH 1/2] layout with css grid

---
 index.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index 7c6b509..bbd77c0 100644
--- a/index.html
+++ b/index.html
@@ -2,9 +2,9 @@
     oninput="i.srcdoc=h.value+'<style>'+c.value+
             '</style><script>'+j.value+'<\/script>'">
     <style>
-        textarea,iframe{width:100%;height:50%}
-        body{margin:0}
-        textarea{width:33.33%;font-size:18}
+        textarea,iframe{width:100%;height:100%;}
+        iframe{grid-row:2;grid-column:1/4;border:none;}
+        body{margin:0;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:50vh 50vh;grid-gap:2px;}
     </style>
     <textarea placeholder=HTML id=h></textarea>
     <textarea placeholder=CSS id=c></textarea>

From d54c20f7ade0a6021c9f8792365525ad7fdeaf39 Mon Sep 17 00:00:00 2001
From: Adam Argyle <atom@argyleink.com>
Date: Sat, 11 Aug 2018 20:16:32 -0700
Subject: [PATCH 2/2] use system monospace font for editor ux

---
 index.html | 1 +
 1 file changed, 1 insertion(+)

diff --git a/index.html b/index.html
index bbd77c0..1598eaa 100644
--- a/index.html
+++ b/index.html
@@ -5,6 +5,7 @@
         textarea,iframe{width:100%;height:100%;}
         iframe{grid-row:2;grid-column:1/4;border:none;}
         body{margin:0;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:50vh 50vh;grid-gap:2px;}
+        textarea{font-size:14;font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,Courier,monospace;border:none;background:hsl(0,0%,94%);}
     </style>
     <textarea placeholder=HTML id=h></textarea>
     <textarea placeholder=CSS id=c></textarea>