CSS refactored

8 files changed, 371 insertions, 470 deletions

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index 57d21360f1b..5ce1b64c850 100644
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -22,217 +22,6 @@
   float:right;
 }
 
-/**
- * Common header style
- * 
- */
-header { 
-  /* Account box */
-  .account-box {
-    position: absolute;
-    right: 0;
-    top: 13px;
-    z-index: 10000;
-    width: 128px;
-    font-size: 11px;
-    float: right;
-    display: block;
-    cursor: pointer;
-    img {
-      border-radius: 4px;
-      right: 0px;
-      position: absolute;
-      width: 33px;
-      height: 33px;
-      display: block;
-      top: 0;
-      &:after {
-        content: " ";
-        display: block;
-        position: absolute;
-        top: 0;
-        right: 0;
-        left: 0;
-        bottom: 0;
-        float: right;
-        border-radius: 5px;
-        border: 1px solid rgba(255, 255, 255, 0.1);
-        border-bottom: 0;
-        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, 0.15)), to(rgba(0, 0, 0, 0.25))), -webkit-gradient(linear, left top, right bottom, color-stop(0, rgba(255, 255, 255, 0)), color-stop(0.5, rgba(255, 255, 255, 0.1)), color-stop(0.501, rgba(255, 255, 255, 0)), color-stop(1, rgba(255, 255, 255, 0)));
-        background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.25)), -moz-linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
-        background: linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.25)), linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
-        -webkit-background-origin: border-box;
-        -moz-background-origin: border;
-  background-origin: border-box; } } }
-
-  .account-box {
-    &.hover {
-    height: 138px; }
-    &:hover > .account-links {
-  display: block; } }
-
-  .account-links {
-    background: #79C3E0;
-    display: none;
-    border-radius: 5px;
-    width: 100px;
-    margin-top: 0;
-    float: right;
-    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
-    position: relative;
-    &:before {
-      content: ".";
-      width: 0;
-      height: 0;
-      position: absolute;
-      border: 5px solid transparent;
-      border-color: rgba(255, 255, 255, 0);
-      border-bottom-color: #333;
-      text-indent: -9999px;
-      top: -10px;
-      line-height: 0;
-      right: 10px;
-    z-index: 10; }
-    background: #333;
-    display: none;
-    z-index: 100000;
-    border-radius: 5px;
-    width: 100px;
-    position: absolute;
-    right: 10px;
-    top: 46px;
-    margin-top: 0;
-    float: right;
-    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
-    a {
-      color: #EEE;
-      padding: 6px 10px;
-      display: block;
-      text-shadow: none;
-      border-bottom: 1px solid #555;
-      &:hover {
-        color:#eee;
-        background: #444;
-      }
-    }
-  }
-
-  .account-box.hover .arrow-up {
-    top: 41px;
-    right: 6px;
-    position: absolute; }
-
-  .account-links a {
-    &:first-child {
-      -webkit-border-top-left-radius: 5px;
-      -webkit-border-top-right-radius: 5px;
-      -moz-border-radius-topleft: 5px;
-      -moz-border-radius-topright: 5px;
-      border-top-left-radius: 5px;
-    border-top-right-radius: 5px; }
-    &:last-child {
-      -webkit-border-bottom-right-radius: 5px;
-      -webkit-border-bottom-left-radius: 5px;
-      -moz-border-radius-bottomright: 5px;
-      -moz-border-radius-bottomleft: 5px;
-      border-bottom-right-radius: 5px;
-      border-bottom-left-radius: 5px;
-  border-bottom: 0; } }
-}
-
-/*
- *  Main Menu of Application
- *
- */
-nav.main_menu { 
-  border-radius: 4px;
-  margin: auto;
-  margin:30px 0;
-  background:#eee;
-  border:1px solid #bbb;
-  height:38px;
-  background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #eee), to(#dfdfdf));
-  background-image: -webkit-linear-gradient(#eee 6.6%, #dfdfdf);
-  background-image: -moz-linear-gradient(#eee 6.6%, #dfdfdf);
-  background-image: -o-linear-gradient(#eee 6.6%, #dfdfdf);
-  @include shade;
-  .count { 
-    position: relative;
-	  top: -1px;
-	  display: inline-block;
-	  height: 15px;
-	  margin: 0 0 0 5px;
-	  padding: 0 8px 1px 8px;
-	  height: auto;
-	  font-size: 0.82em;
-	  line-height: 14px;
-	  text-align: center;
-	  color: #777;
-	  background: #f2f2f2;
-	  border-top: 1px solid #CCC;
-	  border-radius: 8px;
-	 -moz-border-radius: 8px;
-  }
-  .label { 
-    background:$hover;
-    text-shadow:none;
-    color:$style_color;
-  }
-  a { 
-    // Landscape phone to portrait tablet
-    @media (max-width: 1080px) { min-width:35px; }
-    // Portrait tablet to landscape and desktop
-    @media (min-width: 1080px) and (max-width: 1200px) { min-width:40px; }
-    // Large desktop
-    @media (min-width: 1200px) { min-width:55px; }
-
-    text-align:center;
-    font-weight:bold;
-    &:first-child{ 
-      -webkit-border-top-left-radius: 4px;
-      -webkit-border-bottom-left-radius: 4px;
-      -moz-border-radius-topleft: 4px;
-      -moz-border-radius-bottomleft: 4px;
-      border-top-left-radius: 4px;
-      border-bottom-left-radius: 4px;
-      border-left: 0;
-    }
-    padding: 10px 25px;
-    display: inline-block;
-    color: $style_color;
-    position: relative;
-    margin: 0;
-    float:left;
-    text-shadow:0 1px 1px white;
-    border-right: 1px solid #DDD;
-    border-left: 1px solid #EEE;
-
-    &.home { 
-      background: url(home_icon.PNG) no-repeat center center;
-      text-indent:-9999px;
-      //min-width:40px;
-      img { 
-        position:relative;
-        top:4px;
-      }
-    }
-    &.current { 
-      background-color:#D5D5D5;
-      border-bottom: 2px solid #474D57;
-      border-right: 1px solid #BBB;
-      border-left: 1px solid #BBB;
-      border-radius: 0 0 1px 1px;
-      &:first-child{ 
-        border-bottom:none;
-      }
-    }
-  }
-}
-/*
- *  End of Main Menu
- *
- */
-
 .profile_avatar_holder { 
   float:left;
   width:60px;
diff --git a/app/assets/stylesheets/header.scss b/app/assets/stylesheets/header.scss
new file mode 100644
index 00000000000..6a6b9fbc07e
--- /dev/null
+++ b/app/assets/stylesheets/header.scss
@@ -0,0 +1,226 @@
+/*
+ *  Application Header
+ *
+ */
+header { 
+  width:100%;
+  padding:0;
+  margin:0;
+  top:1px;
+  left:0;
+  background: #F1F1F1; /* for non-css3 browsers */
+  border-bottom: 1px solid #ccc; 
+  box-shadow: 0 -1px 0 white inset;
+  -moz-box-shadow: 0 -1px 0 white inset;
+  -webkit-box-shadow: 0 -1px 0 white inset;
+  z-index:10;
+  height:60px;
+
+  /**
+   * 
+   * Logo holder
+   *
+   */
+  .app_logo {
+    width:230px;
+    float:left;
+    position:relative;
+    top:-5px;
+
+    a { 
+      float:left;
+
+      h1 { 
+        text-indent:-9999px;
+        width:102px;
+        background: url('logo_text.png') no-repeat 0px -3px;
+        float:left;
+        margin-left:5px;
+        font-size:20px;
+        line-height:36px;
+        font-weight:bold;
+        color:#aaa;
+        text-shadow: 0 1px 1px #FFF;
+        padding-left:50px;
+      }
+    }
+    .separator {
+      margin-left:20px;
+      float: left;
+      height: 60px;
+      width: 1px;
+      background: white;
+      border-left: 1px solid #DDD;
+      margin-top: -10px;
+    }
+  }
+  .container { 
+    .top_panel_content { 
+      margin:auto;
+      position:relative;
+      padding:15px 0;
+    }
+  }
+
+  /**
+   * 
+   * Project / Area name
+   *
+   */
+  .project_name {
+    float:left;
+    margin:0;
+    margin-right:30px;
+    font-size:20px;
+    line-height:36px;
+    font-weight:bold;
+    color:$style_color;
+    text-shadow: 0 1px 1px #FFF;
+  }
+
+  .fbtn { 
+    float: right;
+    margin-right:10px;
+    .btn { 
+      margin-left:8px;
+    }
+  }
+
+
+  /**
+   * 
+   * Search box
+   *
+   */
+  .search { 
+    float: right;
+    margin-right: 55px;
+
+    .search-input { 
+      width:130px;
+      background-image: url("icon-search.png");
+      background-repeat: no-repeat;
+      background-position: 10px;
+      padding-left:25px;
+      @include border-radius(5px);
+      border:1px solid #ccc;
+    }
+  }
+
+  /**
+   * 
+   * Account box
+   *
+   */
+  .account-box {
+    position: absolute;
+    right: 0;
+    top: 13px;
+    z-index: 10000;
+    width: 128px;
+    font-size: 11px;
+    float: right;
+    display: block;
+    cursor: pointer;
+    img {
+      border-radius: 4px;
+      right: 0px;
+      position: absolute;
+      width: 33px;
+      height: 33px;
+      display: block;
+      top: 0;
+      &:after {
+        content: " ";
+        display: block;
+        position: absolute;
+        top: 0;
+        right: 0;
+        left: 0;
+        bottom: 0;
+        float: right;
+        border-radius: 5px;
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        border-bottom: 0;
+        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, 0.15)), to(rgba(0, 0, 0, 0.25))), -webkit-gradient(linear, left top, right bottom, color-stop(0, rgba(255, 255, 255, 0)), color-stop(0.5, rgba(255, 255, 255, 0.1)), color-stop(0.501, rgba(255, 255, 255, 0)), color-stop(1, rgba(255, 255, 255, 0)));
+        background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.25)), -moz-linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
+        background: linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.25)), linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
+        -webkit-background-origin: border-box;
+        -moz-background-origin: border;
+  background-origin: border-box; } } }
+
+  .account-box {
+    &.hover {
+    height: 138px; }
+    &:hover > .account-links {
+  display: block; } }
+
+  .account-links {
+    background: #79C3E0;
+    display: none;
+    border-radius: 5px;
+    width: 100px;
+    margin-top: 0;
+    float: right;
+    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
+    position: relative;
+    &:before {
+      content: ".";
+      width: 0;
+      height: 0;
+      position: absolute;
+      border: 5px solid transparent;
+      border-color: rgba(255, 255, 255, 0);
+      border-bottom-color: #333;
+      text-indent: -9999px;
+      top: -10px;
+      line-height: 0;
+      right: 10px;
+    z-index: 10; }
+    background: #333;
+    display: none;
+    z-index: 100000;
+    border-radius: 5px;
+    width: 100px;
+    position: absolute;
+    right: 10px;
+    top: 46px;
+    margin-top: 0;
+    float: right;
+    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
+    a {
+      color: #EEE;
+      padding: 6px 10px;
+      display: block;
+      text-shadow: none;
+      border-bottom: 1px solid #555;
+      &:hover {
+        color:#eee;
+        background: #444;
+      }
+    }
+  }
+
+  .account-box.hover .arrow-up {
+    top: 41px;
+    right: 6px;
+    position: absolute; }
+
+  .account-links a {
+    &:first-child {
+      -webkit-border-top-left-radius: 5px;
+      -webkit-border-top-right-radius: 5px;
+      -moz-border-radius-topleft: 5px;
+      -moz-border-radius-topright: 5px;
+      border-top-left-radius: 5px;
+    border-top-right-radius: 5px; }
+    &:last-child {
+      -webkit-border-bottom-right-radius: 5px;
+      -webkit-border-bottom-left-radius: 5px;
+      -moz-border-radius-bottomright: 5px;
+      -moz-border-radius-bottomleft: 5px;
+      border-bottom-right-radius: 5px;
+      border-bottom-left-radius: 5px;
+  border-bottom: 0; } }
+}
+
diff --git a/app/assets/stylesheets/main.scss b/app/assets/stylesheets/main.scss
index 851d4295060..7bf56cd0c8b 100644
--- a/app/assets/stylesheets/main.scss
+++ b/app/assets/stylesheets/main.scss
@@ -64,14 +64,28 @@ $hover: #FDF5D9;
   border-radius: $radius;
 }
 
+
+
+/**
+ * Header of application. 
+ * Contain application logo, search panel, profile icon
+ */
+@import "header.scss";
+
+/**
+ * Navigation menu of application. 
+ * Panel with links to pages depends on project, profile or admin area
+ */
+@import "nav.scss";
+
 /**
  * This file represent some UI that can be changed 
  * during web app restyle or theme select. 
  * 
  * Next items should be placed there
- * - link colors
- * - header styles
- * - main menu styles
+ * - link, button colors
+ * - header restyles
+ * - main menu restyles
  *
  */
 @import "themes/ui_basic.scss";
diff --git a/app/assets/stylesheets/nav.scss b/app/assets/stylesheets/nav.scss
new file mode 100644
index 00000000000..9403539b888
--- /dev/null
+++ b/app/assets/stylesheets/nav.scss
@@ -0,0 +1,93 @@
+/*
+ *  Main Menu of Application
+ *
+ */
+nav.main_menu { 
+  border-radius: 4px;
+  margin: auto;
+  margin:30px 0;
+  background:#eee;
+  border:1px solid #bbb;
+  height:38px;
+  background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #eee), to(#dfdfdf));
+  background-image: -webkit-linear-gradient(#eee 6.6%, #dfdfdf);
+  background-image: -moz-linear-gradient(#eee 6.6%, #dfdfdf);
+  background-image: -o-linear-gradient(#eee 6.6%, #dfdfdf);
+  @include shade;
+  .count { 
+    position: relative;
+	  top: -1px;
+	  display: inline-block;
+	  height: 15px;
+	  margin: 0 0 0 5px;
+	  padding: 0 8px 1px 8px;
+	  height: auto;
+	  font-size: 0.82em;
+	  line-height: 14px;
+	  text-align: center;
+	  color: #777;
+	  background: #f2f2f2;
+	  border-top: 1px solid #CCC;
+	  border-radius: 8px;
+	 -moz-border-radius: 8px;
+  }
+  .label { 
+    background:$hover;
+    text-shadow:none;
+    color:$style_color;
+  }
+  a { 
+    // Landscape phone to portrait tablet
+    @media (max-width: 1080px) { min-width:35px; }
+    // Portrait tablet to landscape and desktop
+    @media (min-width: 1080px) and (max-width: 1200px) { min-width:40px; }
+    // Large desktop
+    @media (min-width: 1200px) { min-width:55px; }
+
+    text-align:center;
+    font-weight:bold;
+    &:first-child{ 
+      -webkit-border-top-left-radius: 4px;
+      -webkit-border-bottom-left-radius: 4px;
+      -moz-border-radius-topleft: 4px;
+      -moz-border-radius-bottomleft: 4px;
+      border-top-left-radius: 4px;
+      border-bottom-left-radius: 4px;
+      border-left: 0;
+    }
+    padding: 10px 25px;
+    display: inline-block;
+    color: $style_color;
+    position: relative;
+    margin: 0;
+    float:left;
+    text-shadow:0 1px 1px white;
+    border-right: 1px solid #DDD;
+    border-left: 1px solid #EEE;
+
+    &.home { 
+      background: url(home_icon.PNG) no-repeat center center;
+      text-indent:-9999px;
+      //min-width:40px;
+      img { 
+        position:relative;
+        top:4px;
+      }
+    }
+    &.current { 
+      background-color:#D5D5D5;
+      border-bottom: 2px solid #474D57;
+      border-right: 1px solid #BBB;
+      border-left: 1px solid #BBB;
+      border-radius: 0 0 1px 1px;
+      &:first-child{ 
+        border-bottom:none;
+      }
+    }
+  }
+}
+/*
+ *  End of Main Menu
+ *
+ */
+
diff --git a/app/assets/stylesheets/themes/ui_basic.scss b/app/assets/stylesheets/themes/ui_basic.scss
index 16517dc73be..1b731c9192b 100644
--- a/app/assets/stylesheets/themes/ui_basic.scss
+++ b/app/assets/stylesheets/themes/ui_basic.scss
@@ -1,11 +1,6 @@
 /**
  * This file represent some UI that can be changed 
  * during web app restyle or theme select. 
- * 
- * Next items should be placed there
- * - link colors
- * - header styles
- * - main menu styles
  *
  */
 .ui_basic { 
@@ -20,103 +15,4 @@
       color: $blue_link;
     }
   }
-
-
-  /*
-   *  Application Header
-   *
-   */
-  header { 
-    width:100%;
-    padding:0;
-    margin:0;
-    top:1px;
-    left:0;
-    background: #F1F1F1; /* for non-css3 browsers */
-    border-bottom: 1px solid #ccc; 
-    box-shadow: 0 -1px 0 white inset;
-    -moz-box-shadow: 0 -1px 0 white inset;
-    -webkit-box-shadow: 0 -1px 0 white inset;
-    z-index:10;
-    height:60px;
-
-    .app_logo {
-      width:230px;
-      float:left;
-      position:relative;
-      top:-5px;
-
-      a { 
-        float:left;
-
-        h1 { 
-          text-indent:-9999px;
-          width:102px;
-          background: url('logo_text.png') no-repeat 0px -3px;
-          float:left;
-          margin-left:5px;
-          font-size:20px;
-          line-height:36px;
-          font-weight:bold;
-          color:#aaa;
-          text-shadow: 0 1px 1px #FFF;
-          padding-left:50px;
-        }
-      }
-      .separator {
-        margin-left:20px;
-        float: left;
-        height: 60px;
-        width: 1px;
-        background: white;
-        border-left: 1px solid #DDD;
-        margin-top: -10px;
-      }
-    }
-    .container { 
-      .top_panel_content { 
-        margin:auto;
-        position:relative;
-        padding:15px 0;
-      }
-    }
-
-    .project_name {
-      float:left;
-      margin:0;
-      margin-right:30px;
-      font-size:20px;
-      line-height:36px;
-      font-weight:bold;
-      color:$style_color;
-      text-shadow: 0 1px 1px #FFF;
-    }
-
-    .fbtn { 
-      float: right;
-      margin-right:10px;
-      .btn { 
-        margin-left:8px;
-      }
-    }
-
-    .search { 
-      float: right;
-      margin-right: 55px;
-
-      .search-input { 
-        width:130px;
-        background-image: url("icon-search.png");
-        background-repeat: no-repeat;
-        background-position: 10px;
-        padding-left:25px;
-        @include border-radius(5px);
-        border:1px solid #ccc;
-      }
-    }
-  }
-  /*
-   *  End of Application Header
-   *
-   */
 }
diff --git a/app/assets/stylesheets/themes/ui_mars.scss b/app/assets/stylesheets/themes/ui_mars.scss
index feb02e1febc..0fea6144431 100644
--- a/app/assets/stylesheets/themes/ui_mars.scss
+++ b/app/assets/stylesheets/themes/ui_mars.scss
@@ -4,8 +4,7 @@
  * 
  * Next items should be placed there
  * - link colors
- * - header styles
- * - main menu styles
+ * - header restyles
  *
  */
 .ui_mars {
@@ -15,18 +14,11 @@
    *
    */
   header { 
-    width:100%;
-    padding:0;
-    margin:0;
-    top:1px;
-    left:0;
     background: #474D57 url('bg-header.png') repeat-x bottom;
-    z-index:10;
-    height:60px;
+    box-shadow:none;
+    border-bottom: 1px solid #444;
 
     .fbtn { 
-      float: right;
-      margin-right:10px;
       .btn { 
         margin-left:8px;
         background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #595D63), to(#31363E));
@@ -51,20 +43,10 @@
       float: right;
       margin-right: 55px;
       .search-input { 
-        background-image:url("icon-search.png");
-        float: right;
-        text-shadow: none;
-        width: 130px;
-        background-image: url("icon-search.png");
-        background-repeat: no-repeat;
-        background-position: 10px;
-        border-radius: 100px;
         border: 1px solid rgba(0, 0, 0, 0.7);
         box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2), 0 2px 2px rgba(0, 0, 0, 0.4) inset;
         background-color: #D2D5DA;
         background-color: rgba(255, 255, 255, 0.5);
-        padding: 5px;
-        padding-left: 26px;
 
         &:focus {
           background-color: white;
@@ -75,14 +57,7 @@
       color: #666;
     }
     .app_logo {
-      width:230px;
-      float:left;
-      position:relative;
-      top:-5px;
-
       a { 
-        float:left;
-
         h1 { 
           background: url('images.png') no-repeat -3px -6px;
           width: 65px;
@@ -94,25 +69,17 @@
           float:left;
         }
       }
+      .separator {
+        border-color:#444;
+        background:#31363E;
+      }
+
     }
     .project_name {
-      float:left;
-      margin:0;
-      margin-right:30px;
-      font-size:20px;
       line-height:38px;
-      font-weight:bold;
       color:#fff;
       text-shadow: 0 1px 1px #111;
     }
-
-    .container { 
-      .top_panel_content { 
-        margin:auto;
-        position:relative;
-        padding:15px 0;
-      }
-    }
   }
   /*
    *  End of Application Header
diff --git a/app/assets/stylesheets/themes/ui_modern.scss b/app/assets/stylesheets/themes/ui_modern.scss
index cb55bcc8efd..03579d58196 100644
--- a/app/assets/stylesheets/themes/ui_modern.scss
+++ b/app/assets/stylesheets/themes/ui_modern.scss
@@ -9,37 +9,21 @@
  *
  */
 .ui_modern { 
-
-  background:#eee;
-
-  > .container { 
-    background:#FFF;
-    border: 1px solid #ccc;
-    padding:20px;
-    margin-top:30px;
-    -moz-box-shadow: 0 0 1px 1px #E3E3E3;
-    -webkit-box-shadow: 0 0 1px 1px #E3E3E3;
-    box-shadow: 0 0 1px 1px #E3E3E3;
-  }
-
   nav.main_menu { 
-    position: absolute;
-    width: 100%;
-    left: 0;
-    top: 35px;
+    background:none;
+    box-shadow:none;
     @include border-radius(0px);
+    border:none;
+    border-bottom:2px solid #456;
 
-    a.current { 
-      border-bottom:none;
-    }
-  }
-
-  .commit-box, .issue_form_box {
-    margin-top: 0px;
-  }
+    a { 
+      border:none;
 
-  .ui-box { 
-    @include border-radius(0px);
+      &.current {
+        border-bottom:2px solid #f90;
+        background-color:#fff;
+      }
+    }
   }
 
   /*
@@ -47,97 +31,30 @@
    *
    */
   a {
-    color: $link_color;
+    color: #FA8B2A;
     &:hover { 
       text-decoration:none; 
-      color: $blue_link;
+      color: #f90;
     }
   }
 
+  .btn { 
+    &.primary, 
+    &.btn-primary { 
+      border-color:#C60;
+      background:#D70;
 
-  /*
-   *  Application Header
-   *
-   */
-  header { 
-    width:100%;
-    padding:0;
-    margin:0;
-    top:1px;
-    left:0;
-    background: #FFF; /* for non-css3 browsers */
-    z-index:10;
-    height:100px;
-
-    .app_logo {
-      float:left;
-      position:relative;
-      top:-5px;
-
-      a { 
-        float:left;
-
-        h1 { 
-
-          left: -30px;
-          position: relative;
-          text-indent:-9999px;
-          width:112px;
-          background: url('logo_text_tr.png') no-repeat 0px 0;
-          float:left;
-          font-size:20px;
-          line-height:36px;
-          font-weight:bold;
-          color:#aaa;
-          text-shadow: 0 1px 1px #FFF;
-          padding-left:50px;
-        }
-      }
-    }
-    .container { 
-      .top_panel_content { 
-        margin:auto;
-        position:relative;
-        padding:15px 0;
+      &:hover { 
+        background:#F90;
       }
     }
+  }
 
-    .project_name {
-      float:left;
-      margin:0;
-      margin-right:30px;
-      font-size:20px;
-      line-height:36px;
-      font-weight:bold;
-      color:$style_color;
-      text-shadow: 0 1px 1px #FFF;
-    }
-
-    .fbtn { 
-      float: right;
-      margin-right:10px;
-      .btn { 
-        margin-left:8px;
-      }
-    }
-
-    .search { 
-      float: right;
-      margin-right: 55px;
-
-      .search-input { 
-        width:130px;
-        background-image: url("icon-search.png");
-        background-repeat: no-repeat;
-        background-position: 10px;
-        padding-left:25px;
-        @include border-radius(5px);
-        border:1px solid #ccc;
-      }
+  .alert { 
+    &.alert-info { 
+      border-color:#FDA;
+      background:#FED;
+      color:#D70;
     }
   }
-  /*
-   *  End of Application Header
-   *
-   */
 }
diff --git a/app/views/projects/index.html.haml b/app/views/projects/index.html.haml
index 4a47e126043..a8bc8ef31b3 100644
--- a/app/views/projects/index.html.haml
+++ b/app/views/projects/index.html.haml
@@ -12,8 +12,7 @@
       - if @events.any?
         = render @events
       - else
-        .padded
-          %strong.cgray Projects activity will be displayed here
+        %h4.nothing_here_message Projects activity will be displayed here
     .side
       .projects_box
         %h5