adding some style'

site/Makefile

@@ -25,5 +25,7 @@ coffee:
 clean:
 	rm -f $(STATIC_CSS)/hy.css
 
+devel:
+	@./devel.sh
 
-.PHONY: build clean less coffee
+.PHONY: build clean less coffee devel

site/devel.sh

@@ -0,0 +1,13 @@
+#!/bin/bash
+shopt -s extglob
+
+last=""
+while [ true ]; do
+    now=$(find coffee less -type f -printf "%T@ %Tx %TX %p\n" | sort -n -r | head -1)
+    if [ "$last" != "$now" ]; then
+        make >/dev/null
+        echo "Updated."
+    fi
+    last=$now
+    sleep 1
+done

site/less/hy.less

@@ -1,6 +1,4 @@
 /* Copyright (c) Paul Tagliamonte <paultag@debian.org> 2013 under the
  *  terms and conditions of Hy it's self.  */
 
-body {
+@import "layout.less";
-    color: #DFCDCDC;
-}

site/less/layout.less

@@ -0,0 +1,44 @@
+.shadow {
+    box-shadow:                 5px 5px rgba(15,15,15,0.05);
+}
+
+
+.popover {
+    position:                   fixed;
+    height:                     100%;
+    width:                      100%;
+    .focus {
+        .shadow;
+        border:                 1px solid #CCCCCC;
+        background-color:       #FFFFFF;
+        border-radius:          5px;
+        width:                  90%;
+        height:                 85%;
+        margin-left:            auto;
+        margin-right:           auto;
+        margin-top:             3%;
+    }
+}
+
+#repl-input {
+    border-right:               1px solid #DDDDDD;
+}
+
+.repl {
+    height:                     100%;
+    padding:                    3px;
+    .repl-left {
+        float:                  left;
+    }
+    .repl-right {
+        float:                  right;
+    }
+    .repl-pane {
+        padding:                0px;
+        margin:                 0px;
+        border:                 0px solid #000000;
+        resize:                 none;
+        width:                  48%;
+        height:                 99%;
+    }
+}

site/templates/index.html

@@ -8,6 +8,9 @@
 (print "foo bar")
 {% endcode %}{% endautoescape %} #}
 
+        <div id = 'popshim' >
+        <div class = 'popover' >
+            <div class = 'focus' >
                 <div class = 'repl' >
                     <textarea id = 'repl-input' class = 'repl-pane repl-left' >
 (defn square [x]
@@ -15,10 +18,9 @@
 
 (print (square 4))
 </textarea>
-                    <pre
+            <pre id = 'repl-output' class = 'repl-pane repl-right' ></pre>
-                        id = 'repl-output'
+        </div>
-                        class = 'repl-pane repl-right'
+    </div>
-                    ></pre>
 </div>
 
 {% endblock %}