From bdc177372d013a2801880e10f848db75604fff97 Mon Sep 17 00:00:00 2001
From: Severyn Kozak <severyn.kozak@gmail.com>
Date: Thu, 8 May 2014 20:42:06 -0400
Subject: [PATCH] Finalize base template/styling; add _variables.

Add:
    static/sass/main.sass
        -Complete `template/layout.html` positioning rules.
        -Add some styling to the footer.

    static/sass/_variables.sass
        -Add `SASS` partial to contain all project-wide variables.

    templates/index.html
        -Add project-wide layout template (should've been packaged into the
        previous commit).
---
 .gitignore                  |  2 ++
 static/sass/_variables.sass |  5 +++++
 static/sass/main.sass       | 55 +++++++++++++++++++++++++++++++--------------
 templates/index.html        | 30 -------------------------
 templates/layout.html       | 23 ++++++++++++++-----
 5 files changed, 62 insertions(+), 53 deletions(-)
 create mode 100644 static/sass/_variables.sass

diff --git a/.gitignore b/.gitignore
index 319057d..32ecf3f 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,5 @@
+static/css
+
 *.swp
 .sass-cache
 .DS_Store
diff --git a/static/sass/_variables.sass b/static/sass/_variables.sass
new file mode 100644
index 0000000..9ac81fc
--- /dev/null
+++ b/static/sass/_variables.sass
@@ -0,0 +1,5 @@
+/*
+ Partial to contain all globally-applicable variables.
+ */
+
+$lightBlue: #37a5d4
diff --git a/static/sass/main.sass b/static/sass/main.sass
index da76428..300e46b 100644
--- a/static/sass/main.sass
+++ b/static/sass/main.sass
@@ -3,28 +3,49 @@
  */
 
 @import mixins
+@import variables
 
 body
     margin: 0px
 
-div#center
-    background-color: red
-    margin-left: auto
-    margin-right: auto
-    margin-top: 0px
-    width: 75%
+    *
+        font-family: sans-serif
 
-div#footer
-    @extend .t3
+    div#main
+        padding-top: 4%
 
-    background-color: yellow
-    bottom: -20px
-    position: fixed
-    width: 100%
-    text-align: center
+        div#center
+            margin-left: auto
+            margin-right: auto
+            margin-top: 0px
+            width: 75%
 
-    a
-        padding-left: 10%
+    div#footer
+        @extend .t3
 
-    &:hover
-        bottom: 0px
+        background-color: $lightBlue
+        bottom: -50px
+        padding-top: 12px
+        position: fixed
+        width: 100%
+        text-align: center
+
+        *
+            color: white
+
+        a
+            @extend .t3
+
+            text-decoration: none
+            font-size: 1.2em
+            margin-left: 5%
+            margin-right: 5%
+
+            &:hover
+                text-decoration: underline
+
+        p span
+            font-size: 0.7em
+
+        &:hover
+            bottom: 0px
diff --git a/templates/index.html b/templates/index.html
index 0490da5..3253631 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -6,34 +6,4 @@
 
 = block body
   <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
-  <div>Hello, world.</div>
 = endblock
diff --git a/templates/layout.html b/templates/layout.html
index 9ab3eac..54b5bfd 100644
--- a/templates/layout.html
+++ b/templates/layout.html
@@ -9,10 +9,8 @@
     </title>
 
     <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
-    <meta name="description" content="bitshift is an online code snippet
-      exchange."/>
-    <meta name="keywords" content="code snippet exchange golf programming
-      software community"/>
+    <meta name="description" content="bitshift is a source code search engine."/>
+    <meta name="keywords" content="source code language search engine"/>
     <meta name="author" content="Benjamin Attal Ben Kurtovic Severyn Kozak"/>
 
     {{ assets.tag("main.css") }}
@@ -21,7 +19,20 @@
     = endblock
   </head>
   <body>
-    = block body
-    = endblock
+    <div id="main">
+      <div id="center">
+        = block body
+        = endblock
+      </div>
+    </div>
+
+    <div id="footer">
+      <a href="/">home</a>
+      <a href="/about">about</a>
+      <a href="/developers">developers</a>
+      <p>
+        &copy; 2012-2013 bitshift. <span>All Rights Reserved.</span>
+      </p>
+    </div>
   </body>
 </html>