Clean up text styling a little and add text shadows

Author: kaixiong

css/style.css

@@ -55,6 +55,7 @@ p {
 }
 #header .tagline {
   text-indent: -9999em;
+  overflow: hidden;
 }
 #header .download {
   font-family: "Comfortaa", sans-serif;
@@ -72,32 +73,33 @@ p {
 #site-name {
   display: block;
   position: absolute;
-  left: 0;
-  top: 80px;
+  left: 10px;
+  top: 70px;
   width: 460px;
   height: 100px;
   text-indent: -9999em;
+  overflow: hidden;
 }
 
 #feature {
   margin-bottom: 20px;
   height: 200px;
-}
-#feature .title {
-  font-size: 35px;
+  /* FIXME: Remove hard-coded height */
 }
 
 #content {
   padding: 20px 0;
   margin-bottom: 10px;
 }
-#content .title {
-  font-size: 35px;
-}
 #content .project-name {
   color: white;
 }
 
+.block .title {
+  font-size: 35px;
+  text-shadow: 0px 0px 5px #111;
+}
+
 #footer {
   font-size: 13px;
   padding: 20px 0;

css/style.scss

@@ -5,6 +5,11 @@ $mono-font: 'Droid Sans Mono', Courier New, monospace;
 $heading-font: 'Comfortaa', sans-serif;
 $highlight-color: #ff7f2a;
 
+@mixin text-replace {
+  text-indent: -9999em;
+  overflow: hidden;
+}
+
 // Font
 
 body {
@@ -57,7 +62,7 @@ p {
   margin-bottom: 20px;
 
   .tagline {
-    text-indent: -9999em;
+    @include text-replace;
   }
 
   .download {
@@ -78,35 +83,32 @@ p {
 #site-name {
   display: block;
   position: absolute;
-  left: 0;
-  top: 80px;
+  left: 10px;
+  top: 70px;
   width: 460px;
   height: 100px;
-  text-indent: -9999em;
+  @include text-replace;
 }
 
 #feature {
   margin-bottom: 20px;
-  height: 200px;  // FIXME: Remove hard-coded height
-
-  .title {
-    font-size: 35px;
-  }
+  height: 200px;  /* FIXME: Remove hard-coded height */
 }
 
 #content {
   padding: 20px 0;
   margin-bottom: 10px;
 
-  .title {
-    font-size: 35px;
-  }
-
   .project-name {
     color: white;
   }
 }
 
+.block .title {
+  font-size: 35px;
+  text-shadow: 0px 0px 5px #111;
+}
+
 #footer {
   font-size: 13px;
   padding: 20px 0;

index.html

@@ -32,15 +32,15 @@
       </div> <!-- header -->
 
       <div id="feature" class="container_12">
-        <div class="grid_6">
+        <div class="block grid_6">
           <h3 class="title">We are back!</h3>
           <p>After a 5-year hiatus, we are back! Progress is moving
             swiftly on the next stable release 0.5.0. Among the changes
             already made are, a new CMake build system, Android support,
             and a new tool for testing and benchmarking.</p>
           <div class="clearfix"></div>
         </div>
-        <div class="grid_6">
+        <div class="block grid_6">
           <h3 class="title">Working with LV</h3>
           <p>We are now on <a target="lv-github-page" href="https://github.com/Libvisual/libvisual">GitHub</a> and use Git for versioning.</p>
           <p class="code" style="letter-spacing:-0.025em;">git clone https://github.com/Libvisual/libvisual.git
@@ -50,7 +50,7 @@ <h3 class="title">Working with LV</h3>
       </div> <!-- feature -->
 
       <div id="content" class="container_12">
-        <div class="grid_4">
+        <div class="block grid_4">
           <h2 class="title">About <span class="project-name">LV</span></h2>
           <p>Libvisual instantly transforms your favourite music into
             psychedelic art. It works by running audio from your
@@ -61,7 +61,7 @@ <h2 class="title">About <span class="project-name">LV</span></h2>
           <div class="clearfix"></div>
         </div> <!-- column-left -->
 
-        <div class="grid_4">
+        <div class="block grid_4">
           <h2 class="title">Run <span class="project-name">LV</span></h2>
           <p>Lorem ipsum dolor sit amet, consectetur adipiscing
             elit. Etiam nec lectus metus, non varius mi. Etiam vitae
@@ -71,7 +71,7 @@ <h2 class="title">Run <span class="project-name">LV</span></h2>
           <div class="clearfix"></div>
         </div> <!-- column-middle -->
 
-        <div class="grid_4">
+        <div class="block grid_4">
           <h2 class="title">Build <span class="project-name">LV</span></h2>
           <p>We need all the help we can get to bring Libvisual to the
             next level. Areas that need always work