Refactored theme css, added Modern theme pre version

10 files changed, 172 insertions, 11 deletions

diff --git a/app/assets/images/logo_text_tr.png b/app/assets/images/logo_text_tr.png
new file mode 100644
index 00000000000..fdb32ee29fe
--- /dev/null
+++ b/app/assets/images/logo_text_tr.png
diff --git a/app/assets/stylesheets/gitlab_bootstrap.scss b/app/assets/stylesheets/gitlab_bootstrap.scss
index af319b51405..839ee641e7a 100644
--- a/app/assets/stylesheets/gitlab_bootstrap.scss
+++ b/app/assets/stylesheets/gitlab_bootstrap.scss
@@ -403,7 +403,7 @@ form {
   margin-bottom: 40px;
   @include round-borders-all(4px);
   @include shade;
-  border-color:#CCC;
+  border-color:#DDD;
 
   ul { 
     margin:0;
diff --git a/app/assets/stylesheets/main.scss b/app/assets/stylesheets/main.scss
index 23108561c77..851d4295060 100644
--- a/app/assets/stylesheets/main.scss
+++ b/app/assets/stylesheets/main.scss
@@ -74,12 +74,17 @@ $hover: #FDF5D9;
  * - main menu styles
  *
  */
-@import "ui_basic.scss";
+@import "themes/ui_basic.scss";
 
 /**
  * UI mars theme
  */
-@import "ui_mars.scss";
+@import "themes/ui_mars.scss";
+
+/**
+ * UI Modern theme
+ */
+@import "themes/ui_modern.scss";
 
 /**
  * Gitlab bootstrap.
diff --git a/app/assets/stylesheets/ui_basic.scss b/app/assets/stylesheets/themes/ui_basic.scss
index 16517dc73be..16517dc73be 100644
--- a/app/assets/stylesheets/ui_basic.scss
+++ b/app/assets/stylesheets/themes/ui_basic.scss
diff --git a/app/assets/stylesheets/ui_mars.scss b/app/assets/stylesheets/themes/ui_mars.scss
index feb02e1febc..feb02e1febc 100644
--- a/app/assets/stylesheets/ui_mars.scss
+++ b/app/assets/stylesheets/themes/ui_mars.scss
diff --git a/app/assets/stylesheets/themes/ui_modern.scss b/app/assets/stylesheets/themes/ui_modern.scss
new file mode 100644
index 00000000000..cb55bcc8efd
--- /dev/null
+++ b/app/assets/stylesheets/themes/ui_modern.scss
@@ -0,0 +1,143 @@
+/**
+ * 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_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;
+    @include border-radius(0px);
+
+    a.current { 
+      border-bottom:none;
+    }
+  }
+
+  .commit-box, .issue_form_box {
+    margin-top: 0px;
+  }
+
+  .ui-box { 
+    @include border-radius(0px);
+  }
+
+  /*
+   * Common styles
+   *
+   */
+  a {
+    color: $link_color;
+    &:hover { 
+      text-decoration:none; 
+      color: $blue_link;
+    }
+  }
+
+
+  /*
+   *  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;
+      }
+    }
+
+    .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/helpers/application_helper.rb b/app/helpers/application_helper.rb
index 85595c1ebe2..6b9e457cc9d 100644
--- a/app/helpers/application_helper.rb
+++ b/app/helpers/application_helper.rb
@@ -85,11 +85,6 @@ module ApplicationHelper
   end
 
   def app_theme
-    if current_user && current_user.theme_id == 1
-      "ui_basic"
-    else
-      "ui_mars"
-    end
+    Gitlab::Theme.css_class_by_id(current_user.try(:theme_id))
   end
-
 end
diff --git a/app/views/profile/design.html.haml b/app/views/profile/design.html.haml
index 1942e83d7a2..ff6ae7f5778 100644
--- a/app/views/profile/design.html.haml
+++ b/app/views/profile/design.html.haml
@@ -10,6 +10,10 @@
       = label_tag do
         = f.radio_button :theme_id, 2
         Classic
+
+      = label_tag do
+        = f.radio_button :theme_id, 3
+        Modern
     %br
   %h3 Code review
   %hr
diff --git a/app/views/refs/_tree_file.html.haml b/app/views/refs/_tree_file.html.haml
index 201028dc2ab..ee56ab36194 100644
--- a/app/views/refs/_tree_file.html.haml
+++ b/app/views/refs/_tree_file.html.haml
@@ -21,8 +21,7 @@
             = preserve do
               = raw file.colorize(options: { linenos: 'True'})
         - else
-          %h3
-            %center Empty file
+          %h4.nothing_here_message Empty file
   - elsif file.image?
     .view_file_content_image
       %img{ :src => "data:#{file.mime_type};base64,#{Base64.encode64(file.data)}"}
diff --git a/lib/gitlab/theme.rb b/lib/gitlab/theme.rb
new file mode 100644
index 00000000000..6e2be76508a
--- /dev/null
+++ b/lib/gitlab/theme.rb
@@ -0,0 +1,15 @@
+module Gitlab
+  class Theme
+    def self.css_class_by_id(id)
+      themes = { 
+        1 => "ui_basic",
+        2 => "ui_mars",
+        3 => "ui_modern"
+      }
+
+      id ||= 1
+
+      return themes[id]
+    end
+  end
+end