Redesign project home page

Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>

app/assets/stylesheets/pages/projects.scss

@@ -15,48 +15,31 @@
 }
 
 .project-home-panel {
-  margin-top: 10px;
-  margin-bottom: 15px;
-  position: relative;
-  padding-left: 65px;
-  min-height: 50px;
+  text-align: center;
+  margin-bottom: 20px;
 
   .project-identicon-holder {
-    position: absolute;
-    left: 0;
-    top: -14px;
+    margin-bottom: 15px;
 
-    .avatar {
-      width: 50px;
-      height: 50px;
+    .avatar, .identicon {
+      margin: 0 auto;
+      float: none;
     }
 
     .identicon {
-      font-size: 26px;
-      line-height: 50px;
+      @include border-radius(50%);
     }
   }
 
-  .project-home-row {
-    @extend .clearfix;
-    margin-bottom: 15px;
-
-    &.project-home-row-top {
-      margin-bottom: 15px;
-    }
-
-    .project-home-desc {
-      color: $gray;
-      float: left;
-      font-size: 16px;
-      line-height: 1.3;
-      margin-right: 250px;
-
-      // Render Markdown-generated HTML inline for this block
+  .lead {
     p {
       display: inline;
     }
   }
+
+  .git-clone-holder {
+    max-width: 600px;
+    margin: 0 auto;
   }
 
   .visibility-level-label {
@@ -67,22 +50,19 @@
   }
 
   .project-repo-buttons {
-    margin-top: -3px;
-    position: absolute;
-    right: 0;
-    width: 265px;
-    text-align: right;
-
+    margin-top: 25px;
+    margin-bottom: 25px;
     .btn {
+      @extend .btn-info;
       font-weight: bold;
       font-size: 14px;
       line-height: 16px;
+      padding: 8px 12px;
 
       .count {
-        padding-left: 10px;
-        border-left: 1px solid #ccc;
+        padding-left: 7px;
         display: inline-block;
-        margin-left: 10px;
+        margin-left: 7px;
       }
     }
   }
@@ -307,3 +287,15 @@ table.table.protected-branches-list tr.no-border {
   float: left;
   margin-right: 10px;
 }
+
+.project-stats {
+  text-align: center;
+
+  ul.nav-pills { display:inline-block; }
+  li { display:inline; }
+  a { float:left; }
+}
+
+pre.light-well {
+  border-color: #f1f1f1;
+}

app/views/projects/_home_panel.html.haml

 - empty_repo = @project.empty_repo?
 .project-home-panel.clearfix{:class => ("empty-project" if empty_repo)}
   .project-identicon-holder
-    = project_icon(@project, alt: '', class: 'avatar project-avatar')
-  .project-home-row.project-home-row-top
-    .project-home-desc
+    = project_icon(@project, alt: '', class: 'project-avatar avatar s90')
+  .lead
     - if @project.description.present?
       = markdown(@project.description, pipeline: :description)
-      - if can?(current_user, :admin_project, @project)
-        –
-        = link_to 'Edit', edit_namespace_project_path
-      - elsif !empty_repo && @repository.readme
-        - readme = @repository.readme
-        –
-        = link_to namespace_project_blob_path(@project.namespace, @project, tree_join(@repository.root_ref, readme.name)) do
-          = readme.name
+
+
   .project-repo-buttons
     .inline.star.js-toggler-container{class: @show_star ? 'on' : ''}
       - if current_user
@@ -35,3 +28,5 @@
           - else
             = link_to new_namespace_project_fork_path(@project.namespace, @project), title: "Fork project", class: 'btn btn-sm btn-default' do
               = link_to_toggle_fork
+
+  = render "shared/clone_panel"

app/views/projects/empty.html.haml

@@ -4,30 +4,28 @@
 
 = render "home_panel"
 
-.center.well
-  %h3
+.center.light-well
+  %h3.page-title
     The repository for this project is empty
-  %h4
+  %p
     You can
-    = link_to namespace_project_new_blob_path(@project.namespace, @project, 'master'), class: 'btn btn-new btn-lg' do
+    = link_to namespace_project_new_blob_path(@project.namespace, @project, 'master'), class: 'btn btn-new' do
       add a file
      or do a push via the command line.
 
-.well
-  = render "shared/clone_panel"
-%h4
-  %strong Command line instructions
+%h3.page-title
+  Command line instructions
 %div.git-empty
   %fieldset
-    %legend Git global setup
-    %pre.dark
+    %h5 Git global setup
+    %pre.light-well
       :preserve
         git config --global user.name "#{git_user_name}"
         git config --global user.email "#{git_user_email}"
 
   %fieldset
-    %legend Create a new repository
-    %pre.dark
+    %h5 Create a new repository
+    %pre.light-well
       :preserve
         git clone #{ content_tag(:span, default_url_to_repo, class: 'clone')}
         cd #{@project.path}
@@ -37,8 +35,8 @@
         git push -u origin master
 
   %fieldset
-    %legend Existing folder or Git repository
-    %pre.dark
+    %h5 Existing folder or Git repository
+    %pre.light-well
       :preserve
         cd existing_folder
         git init

app/views/projects/show.html.haml

@@ -7,10 +7,40 @@
   = render 'shared/no_password'
 
 = render "home_panel"
-= render 'shared/show_aside'
+.project-stats
+  %ul.nav.nav-pills
+    %li
+      = link_to namespace_project_commits_path(@project.namespace, @project, @ref || @repository.root_ref) do
+        = pluralize(number_with_delimiter(@repository.commit_count), 'commit')
+    %li
+      = link_to namespace_project_branches_path(@project.namespace, @project) do
+        = pluralize(number_with_delimiter(@repository.branch_names.count), 'branch')
+    %li
+      = link_to namespace_project_tags_path(@project.namespace, @project) do
+        = pluralize(number_with_delimiter(@repository.tag_names.count), 'tag')
+    - if @repository.changelog
+      %li
+        = link_to changelog_url(@project) do
+          Changelog
+    - if @repository.license
+      %li
+        = link_to license_url(@project) do
+          License
+    - if @repository.contribution_guide
+      %li
+        = link_to contribution_guide_url(@project) do
+          Contribution guide
 
-.row
-  %section.col-md-8
-    = render 'section'
-  %aside.col-md-4.project-side
-    = render 'aside'
+%hr
+%section
+  - if readme = @repository.readme
+    %article.readme-holder#README
+      .clearfix
+        %small.pull-right
+          = link_to namespace_project_blob_path(@project.namespace, @project, tree_join(@repository.root_ref, readme.name)), class: 'light' do
+            %i.fa.fa-file
+            = readme.name
+      .wiki
+        = render_readme(readme)
+  - else
+    %h4 Add README to this repository

app/views/shared/_clone_panel.html.haml

@@ -20,7 +20,7 @@
         :"data-container" => "body"}
         = gitlab_config.protocol.upcase
   = text_field_tag :project_clone, default_url_to_repo(project), class: "js-select-on-focus form-control input-sm", readonly: true
-  - if project.kind_of?(Project) && project.empty_repo?
+  - if project.kind_of?(Project)
     .input-group-addon
       .visibility-level-label.has_tooltip{'data-title' => "#{visibility_level_label(project.visibility_level)} project" }
         = visibility_level_icon(project.visibility_level)