styling

stefl · May 20, 2013 · f2ae97b · f2ae97b
1 parent a0a3b38
commit f2ae97b
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 32 deletions.
diff --git a/app/stylesheets/application.scss b/app/stylesheets/application.scss
@@ -472,12 +472,15 @@ nav {
       border-top: 1px solid #eee;
       list-style-type: none;
       a {
-        @include adjust-font-size-to($base-font-size * 1.5, $lines:2);
+        @include adjust-font-size-to($base-font-size * 1.2, $lines:2);
         text-decoration: none;
         display: block;
         &.active {
           color: #222;
         }
+        &:hover {
+          cursor: pointer;
+        }
       }
       text-align: center;
       width: 100%;
@@ -496,16 +499,21 @@ nav {
   }
 }
 
-.button {
-  background-color: #aaa;
-  padding: 0.5em;
-
-}
-
 form {
-  padding: 1em;
-  background-color: #f6f6f6;
   label, input[type=text], input[type=submit], input[type=email] {
-    @include adjust-font-size-to($base-font-size * 1.5, $lines:2);
+    @include adjust-font-size-to($base-font-size * 1.2, $lines:2);
+  }
+}
+
+.email_updates {
+  @include leader(2);
+  text-align: center;
+  input[type=submit] {
+    position: relative;
+    top: -4px;
+  }
+  input[type=email] {
+    margin-left: 1em;
+    padding-left: 1em;
   }
 }
diff --git a/app/views/chapters/show.haml b/app/views/chapters/show.haml
@@ -49,13 +49,17 @@
 
 
 .chapter-list
+  %ul
+    - Chapter.all.order_by([[:ordering, :asc]]).each do |chapter|
+      %li
+        %a{:class => [chapter.slug, @chapter == chapter ? "active" : ""], :href=>"/book/#{chapter.slug}"}= chapter.title
   .email_updates
     :plain
       <div id="mc_embed_signup">
       <form action="http://makeshift.us6.list-manage.com/subscribe/post?u=c14f3f1491719e4e90f5612c9&amp;id=042a791f81" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
 
       <div class="mc-field-group">
-        <label for="mce-EMAIL">Get emailed as I write more</label>
+        <label for="mce-EMAIL">This is a work in progress. Get updates:</label>
         <input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL" placeholder="me@example.com">
         <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="btn">
       </div>
@@ -64,8 +68,4 @@
         <div class="response" id="mce-success-response" style="display:none"></div>
       </div>
       </form>
-      </div>
-  %ul
-    - Chapter.all.order_by([[:ordering, :asc]]).each do |chapter|
-      %li
-        %a{:class => [chapter.slug, @chapter == chapter ? "active" : ""], :href=>"/book/#{chapter.slug}"}= chapter.title
+      </div>
diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
@@ -887,40 +887,49 @@ nav ul li {
 }
 /* line 474, ../../app/stylesheets/application.scss */
 .chapter-list ul li a {
-  font-size: 1.5em;
-  line-height: 2em;
+  font-size: 1.2em;
+  line-height: 2.5em;
   text-decoration: none;
   display: block;
 }
 /* line 478, ../../app/stylesheets/application.scss */
 .chapter-list ul li a.active {
   color: #222;
 }
+/* line 481, ../../app/stylesheets/application.scss */
+.chapter-list ul li a:hover {
+  cursor: pointer;
+}
 
-/* line 489, ../../app/stylesheets/application.scss */
+/* line 492, ../../app/stylesheets/application.scss */
 .start-reading {
   margin-bottom: 6em;
   font-size: 2em;
   line-height: 1.5em;
 }
-/* line 493, ../../app/stylesheets/application.scss */
+/* line 496, ../../app/stylesheets/application.scss */
 .start-reading h2 a {
   color: #222;
 }
 
-/* line 499, ../../app/stylesheets/application.scss */
-.button {
-  background-color: #aaa;
-  padding: 0.5em;
+/* line 503, ../../app/stylesheets/application.scss */
+form label, form input[type=text], form input[type=submit], form input[type=email] {
+  font-size: 1.2em;
+  line-height: 2.5em;
 }
 
-/* line 505, ../../app/stylesheets/application.scss */
-form {
-  padding: 1em;
-  background-color: #f6f6f6;
-}
 /* line 508, ../../app/stylesheets/application.scss */
-form label, form input[type=text], form input[type=submit], form input[type=email] {
-  font-size: 1.5em;
-  line-height: 2em;
+.email_updates {
+  margin-top: 3em;
+  text-align: center;
+}
+/* line 511, ../../app/stylesheets/application.scss */
+.email_updates input[type=submit] {
+  position: relative;
+  top: -4px;
+}
+/* line 515, ../../app/stylesheets/application.scss */
+.email_updates input[type=email] {
+  margin-left: 1em;
+  padding-left: 1em;
 }