From 38b47132d7bddb4675ba80f6d0c87c51afc6a39d Mon Sep 17 00:00:00 2001
From: Gabriel Dunne <gdunne@quilime.com>
Date: Tue, 29 Apr 2014 23:10:10 -0700
Subject: [PATCH] Cleaning up styles.

---
 _layouts/default.html |  2 +-
 _layouts/post.html    |  2 +-
 css/component.css     | 30 ++++++++++++++++++++++++------
 css/main.css          | 20 ++++++++++++--------
 4 files changed, 38 insertions(+), 16 deletions(-)

diff --git a/_layouts/default.html b/_layouts/default.html
index 38b95e4..a7ecdcc 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -17,7 +17,7 @@
       <!-- content push wrapper -->
       <div class="st-pusher">
         
-        <nav class="st-menu st-effect-3" id="menu-3">
+        <nav class="st-menu st-effect-1" id="menu-1">
           <ul class="posts">
             {% for post in site.posts %}
               <li><a href="{{ site.baseurl }}{{ post.url }}">{{ post.title }}</a></li>
diff --git a/_layouts/post.html b/_layouts/post.html
index 76135ee..2a55bf2 100644
--- a/_layouts/post.html
+++ b/_layouts/post.html
@@ -3,7 +3,7 @@ layout: default
 ---
 
 <div id="st-trigger-effects" class="nav">
-  <div data-effect="st-effect-3">&#9776;</div>
+  <div data-effect="st-effect-1">&#9776;</div>
 </div>
 
 <h1>{{ page.title }}</h1>
diff --git a/css/component.css b/css/component.css
index d816f40..36006cd 100755
--- a/css/component.css
+++ b/css/component.css
@@ -30,8 +30,8 @@ body,
 	left: 0;
 	z-index: 99;
 	height: 100%;
-	-webkit-transition: -webkit-transform 0.35s;
-	transition: transform 0.35s;
+	-webkit-transition: -webkit-transform 0.1s;
+	transition: transform 0.1s;
 }
 
 .st-pusher::after {
@@ -43,8 +43,8 @@ body,
 	background: rgba(0,0,0,0.3);
 	content: '';
 	opacity: 0;
-	-webkit-transition: opacity 0.5s, width 0.1s 0.5s, height 0.1s 0.5s;
-	transition: opacity 0.5s, width 0.1s 0.5s, height 0.1s 0.5s;
+	-webkit-transition: opacity 0.1s, width 0.1s 0.1s, height 0.1s 0.1s;
+	transition: opacity 0.1s, width 0.1s 0.1s, height 0.1s 0.1s;
 }
 
 .st-menu-open .st-pusher::after {
@@ -56,6 +56,7 @@ body,
 }
 
 .st-menu {
+	background:#fff;
 	position: absolute;
 	top: 0;
 	left: 0;
@@ -122,6 +123,23 @@ body,
 
 /* Individual effects */
 
+/* Effect 1: Slide in on top */
+.st-effect-1.st-menu {
+	visibility: visible;
+	-webkit-transform: translate3d(-100%, 0, 0);
+	transform: translate3d(-100%, 0, 0);
+}
+
+.st-effect-1.st-menu-open .st-effect-1.st-menu {
+	visibility: visible;
+	-webkit-transform: translate3d(0, 0, 0);
+	transform: translate3d(0, 0, 0);
+}
+
+.st-effect-1.st-menu::after {
+	display: none;
+}
+
 /* Effect 3: Push*/
 .st-effect-3.st-menu-open .st-pusher {
 	-webkit-transform: translate3d(300px, 0, 0);
@@ -135,8 +153,8 @@ body,
 
 .st-effect-3.st-menu-open .st-effect-3.st-menu {
 	visibility: visible;
-	-webkit-transition: -webkit-transform 0.5s;
-	transition: transform 0.5s;
+	-webkit-transition: -webkit-transform 0.1s;
+	transition: transform 0.1s;
 }
 
 .st-effect-3.st-menu::after {
diff --git a/css/main.css b/css/main.css
index 45c0ceb..3e3ba1a 100755
--- a/css/main.css
+++ b/css/main.css
@@ -21,13 +21,16 @@ html, body { height: 100%; }
 body {
   background-color: #f4f4f4;
   font: 12px Menlo, "Consolas", "Andale Mono", "Lucida Console", monospace;
-  animation: fadein 1s;
-  -moz-animation: fadein 1s; /* Firefox */
-  -webkit-animation: fadein 1s; /* Safari and Chrome */
-  -o-animation: fadein 1s; /* Opera */  
+  /*animation: fadein 1s;*/
+   /* Firefox */
+  /*-moz-animation: fadein 1s;*/
+   /* Safari and Chrome */
+  /*-webkit-animation: fadein 1s;*/
+   /* Opera */  
+  /*-o-animation: fadein 1s;*/
 }
 
-
+/*
 @keyframes fadein {
     from {
         opacity:0;
@@ -59,12 +62,12 @@ body {
     to {
         opacity: 1;
     }
-}
+}*/
 
 h1,h2,h3, h4, h5, h6 {
   font-size: 1em;
   color:#000;
-  line-height:1.2em;
+  line-height:1.5em;
   font-weight:bold;
   margin: 1em 0;
 }
@@ -73,6 +76,7 @@ h1 {
   font-size:2.8em;
   padding-bottom:0.25em;
   text-align:center;
+  line-height:1.1em;
   font-family:lettergothic;
   border-bottom:1px solid #aaa;
 }
@@ -121,7 +125,7 @@ header {
 .posts li {
   font-family: lettergothic, sans;
   font-size:1.2em;
-  line-height:1.5em;
+  line-height:1.1em;
 }
 
 .posts span {
-- 
2.34.1