UI improved, .main_box css class for show pages

app/assets/stylesheets/common.scss

@@ -1010,15 +1010,16 @@ p.time {
   }
 }
-.project_box,
-.issue_box, 
-.commit_box,
-.merge_request_box{ 
-  @extend .padded;
+/**
+ *  UI box element 
+ *  contains top, middle, bottom blocks
+ * 
+ */
+.main_box { 
   @extend .borders;
   @extend .prepend-top-20;
   @extend .append-bottom-20;
-  border-width:2px;
+  border-width:1px;
   img { max-width: 100%; }
@@ -1027,21 +1028,32 @@ p.time {
       background: none !important;
     }
   }
-}
-.project_box .project_descr,
-.merge_request_box .middle_area,
-.issue_box .middle_area,
-.commit_box .commit_message { 
-  margin: -20px;
-  padding: 20px;
-  margin-top:10px;
-  border-radius:0;
-  border:none;
-  font-size:12px;
-  background-color:#f5f5f5;
-  border:none;
-  border-top:1px solid #eee;
+  .top_box_content, 
+  .middle_box_content, 
+  .bottom_box_content { 
+    padding:20px;
+
+    pre {
+      background: none !important;
+      margin:0;
+      border:none;
+      padding:0;
+    }
+  }
+
+  .middle_box_content { 
+    border-radius:0;
+    border:none;
+    font-size:12px;
+    background-color:#f5f5f5;
+    border:none;
+    border-top:1px solid #eee;
+  }
+
+  .bottom_box_content { 
+    border-top:1px solid #eee;
+  }
 }
 .highlight_word { 
@@ -1058,10 +1070,6 @@ p.time {
   margin-right:20px;
 }
-.merge_request_status_holder { 
-  margin-bottom:20px;
-}
-
 .arrow{ 
   float: right;
   background: #E3E5EA;

app/views/commits/index.html.haml

@@ -14,7 +14,6 @@
   #commits_list= render "commits"
 .clear
 .loading{ :style => "display:none;"}
-  %center= image_tag "ajax-loader.gif"
 - if @commits.count == @limit
   :javascript

app/views/commits/show.html.haml

-.commit_box
-  .commit
+.main_box
+  .top_box_content
     .right
       - unless @notes_count.zero?
         %span.btn.small.disabled.padded= pluralize @notes_count, 'note'
@@ -17,8 +17,9 @@
         = @commit.committer_name
         %small= @commit.committed_date.stamp("Aug 21, 2011 9:23pm")
-  %pre.commit_message
-    = commit_msg_with_link_to_issues(@project, @commit.safe_message)
+  .middle_box_content
+    %pre.commit_message
+      = commit_msg_with_link_to_issues(@project, @commit.safe_message)
 %br
 %p.cgray
   Showing #{pluralize(@commit.diffs.count, "changed file")}

app/views/deploy_keys/index.html.haml

@@ -6,6 +6,6 @@
       Add Deploy Key 
 - if @keys.any?
-  %table.zebra-striped.borders
+  %table
     - @keys.each do |key|
       = render(:partial => 'show', :locals => {:key => key})

app/views/help/web_hooks.html.haml

+%h3 Web hooks
+%br
+
+%p Application will send POST request with some data like example below: 
+%h5 Hooks request example:
+.borders= render "hooks/data_ex"
+

app/views/hooks/index.html.haml

@@ -6,16 +6,14 @@
     = link_to new_project_hook_path(@project), :class => "btn small", :title => "New Web Hook" do 
       Add Post Receive Hook
+    %p Read more about web hooks #{link_to "here", help_web_hooks_path, :class => "vlink"}
+
 -if @hooks.any?
-  %table.zebra-striped.borders
+  %table
     - @hooks.each do |hook|
       %tr
         %td
           = link_to project_hook_path(@project, hook) do
             = hook.url
         %td
-          = link_to 'Remove', project_hook_path(@project, hook), :confirm => 'Are you sure?', :method => :delete, :class => "danger btn small"
-
-.ui-box
-  %h5 Hooks request example
-  .data= render "data_ex"
+          = link_to 'Remove', project_hook_path(@project, hook), :confirm => 'Are you sure?', :method => :delete, :class => "danger btn small right"

app/views/issues/show.html.haml

@@ -22,8 +22,8 @@
   = link_to project_issues_path(@project) do 
     ← To issues list
-.issue_box
-  .merge_request_status_holder
+.main_box
+  .top_box_content
     %h5
       - if @issue.closed
         .alert-message.error.status_info Closed
@@ -31,7 +31,7 @@
         .alert-message.success.status_info Open
       = @issue.title
-  %div.middle_area
+  .middle_box_content
     %cite.cgray Created by
     = image_tag gravatar_icon(@issue.author_email), :width => 16, :class => "lil_av"
     %strong.author= link_to_issue_author(@issue)
@@ -40,9 +40,8 @@
     = image_tag gravatar_icon(@issue.assignee_email), :width => 16, :class => "lil_av"
     %strong.author= link_to_issue_assignee(@issue)
       
-  %div
-    - if @issue.description.present?
-      %hr
+  - if @issue.description.present?
+    .bottom_box_content
       = markdown @issue.description

app/views/keys/index.html.haml

@@ -4,6 +4,6 @@
   
 %br
-%table#keys-table.zebra-striped.borders
+%table#keys-table
   - @keys.each do |key|
     = render(:partial => 'show', :locals => {:key => key})

app/views/merge_requests/show.html.haml

@@ -22,8 +22,8 @@
   = link_to project_merge_requests_path(@project) do 
     ← To merge requests
-.merge_request_box
-  .merge_request_status_holder
+.main_box
+  .top_box_content
     %h5
       - if @merge_request.closed
         .alert-message.error.status_info Closed
@@ -31,8 +31,7 @@
         .alert-message.success.status_info Open
       = @merge_request.title
-
-  %div.middle_area
+  .middle_box_content
     %div
       %cite.cgray Created at #{@merge_request.created_at.stamp("Aug 21, 2011")} by 
       = image_tag gravatar_icon(@merge_request.author_email), :width => 16, :class => "lil_av"
@@ -44,17 +43,15 @@
   - if @merge_request.closed
-    %hr
-    - if @merge_request.merged?
-      %span
-        Merged by #{@merge_request.merge_event.author_name} 
-        %small #{time_ago_in_words(@merge_request.merge_event.created_at)} ago.
-    - elsif @merge_request.closed_event
-      %span
-        Closed by #{@merge_request.closed_event.author_name} 
-        %small #{time_ago_in_words(@merge_request.closed_event.created_at)} ago.
-    %br
-
+    .bottom_box_content
+      - if @merge_request.merged?
+        %span
+          Merged by #{@merge_request.merge_event.author_name} 
+          %small #{time_ago_in_words(@merge_request.merge_event.created_at)} ago.
+      - elsif @merge_request.closed_event
+        %span
+          Closed by #{@merge_request.closed_event.author_name} 
+          %small #{time_ago_in_words(@merge_request.closed_event.created_at)} ago.
 = render "merge_requests/commits"

app/views/projects/_team.html.haml

-%ul.unstyled.ui-box
-  - @project.users_projects.each do |up|
-    = render(:partial => 'team_members/show', :locals => {:member => up})
+.ui-box
+  %h5
+    .cgray Team Members (#{@project.users_projects.count})
+  %ul.unstyled
+    - @project.users_projects.each do |up|
+      = render(:partial => 'team_members/show', :locals => {:member => up})
+
 :javascript
   $(function(){

app/views/projects/show.html.haml

 = render "project_head"
-.project_box
-  %h3
-    = @project.name
-    %span.right
-      - if can? current_user, :download_code, @project
-        = link_to "Download", archive_project_repository_path(@project), :class => "btn small padded"
-      - if @project.merge_requests_enabled && can?(current_user, :write_merge_request, @project)
-        = link_to new_project_merge_request_path(@project), :title => "New Merge Request", :class => "btn small padded" do 
-          Merge Request
-      - if @project.issues_enabled && can?(current_user, :write_issue, @project)
-        = link_to new_project_issue_path(@project), :title => "New Issue", :class => "btn small" do 
-          Issue
-  .back_link
-    = link_to projects_path do 
-      ← To projects list
-  %br
-  .alert-message.block-message.warning
+.main_box
+  .top_box_content
+    %h3
+      = @project.name
+      %span.right
+        - if can? current_user, :download_code, @project
+          = link_to "Download", archive_project_repository_path(@project), :class => "btn small padded"
+        - if @project.merge_requests_enabled && can?(current_user, :write_merge_request, @project)
+          = link_to new_project_merge_request_path(@project), :title => "New Merge Request", :class => "btn small padded" do 
+            Merge Request
+        - if @project.issues_enabled && can?(current_user, :write_issue, @project)
+          = link_to new_project_issue_path(@project), :title => "New Issue", :class => "btn small" do 
+            Issue
+    .back_link
+      = link_to projects_path do 
+        ← To projects list
+  .middle_box_content
     .input
       .input-prepend
         %span.add-on git clone
         = text_field_tag :project_clone, @project.url_to_repo, :class => "xlarge one_click_select git_clone_url"
   - if @project.description.present?
-    .markdown.project_descr= markdown @project.description
+    .bottom_box_content
+      .markdown= markdown @project.description
 - unless @events.blank?
   %br
   %h5.cgray

config/routes.rb

@@ -8,6 +8,7 @@ Gitlab::Application.routes.draw do
   get 'help' => 'help#index'
   get 'help/permissions' => 'help#permissions'
   get 'help/workflow' => 'help#workflow'
+  get 'help/web_hooks' => 'help#web_hooks'
   namespace :admin do
     resources :users do