update wiki pages with new design

6 files changed, 64 insertions, 44 deletions

diff --git a/app/assets/stylesheets/pages/wiki.scss b/app/assets/stylesheets/pages/wiki.scss
index ab9c2e2e3e1..216b8ab3c7f 100644
--- a/app/assets/stylesheets/pages/wiki.scss
+++ b/app/assets/stylesheets/pages/wiki.scss
@@ -5,31 +5,27 @@
   padding-right: 7px;
 }
 
-.top-area {
+.wiki-page-header {
+  @extend .top-area;
   position: relative;
 
-  button.sidebar-toggle {
-    position: absolute;
-    right: 0;
-    top: 11px;
-    display: block;
-  }
-
-  @media (min-width: $screen-sm-min) {
-    padding-right: 40px;
+  .wiki-page-title {
+    margin: 0;
+    font-size: 22px;
   }
 
-  @media (min-width: $screen-md-min) {
-    padding-right: 0;
+  .wiki-last-edit-by {
+    color: $gl-gray-light;
 
-    button.sidebar-toggle {
-      display: none;
+    strong {
+      color: $gl-text-color;
     }
   }
-}
 
-.wiki-page-header {
-  @extend .top-area;
+  .light {
+    font-weight: normal;
+    color: $gl-gray-light;
+  }
 
   .git-access-header {
     padding: 16px 0 11px;
@@ -38,13 +34,30 @@
   }
 
   .git-clone-holder {
-    width: 480px;
+    width: 100%;
     padding-bottom: 40px;
   }
 
-  @media (max-width: $screen-xs-max) {
+  button.sidebar-toggle {
+    position: absolute;
+    right: 0;
+    top: 11px;
+    display: block;
+  }
+
+  @media (min-width: $screen-sm-min) {
+    padding-right: 40px;
+
     .git-clone-holder {
-      width: 100%;
+      width: 480px;
+    }
+  }
+
+  @media (min-width: $screen-md-min) {
+    padding-right: 0;
+
+    button.sidebar-toggle {
+      display: none;
     }
   }
 }
diff --git a/app/views/projects/wikis/_form.html.haml b/app/views/projects/wikis/_form.html.haml
index 4e41a15d9f4..c52527332bc 100644
--- a/app/views/projects/wikis/_form.html.haml
+++ b/app/views/projects/wikis/_form.html.haml
@@ -34,9 +34,6 @@
     - if @page && @page.persisted?
       = f.submit 'Save changes', class: "btn-save btn"
       .pull-right
-        - if can?(current_user, :admin_wiki, @project)
-          = link_to namespace_project_wiki_path(@project.namespace, @project, @page), data: { confirm: "Are you sure you want to delete this page?"}, method: :delete, class: "btn btn-danger btn-grouped" do
-            Delete
         = link_to "Cancel", namespace_project_wiki_path(@project.namespace, @project, @page), class: "btn btn-cancel btn-grouped"
     - else
       = f.submit 'Create page', class: "btn-create btn"
diff --git a/app/views/projects/wikis/edit.html.haml b/app/views/projects/wikis/edit.html.haml
index 7483af54d76..23117128bbb 100644
--- a/app/views/projects/wikis/edit.html.haml
+++ b/app/views/projects/wikis/edit.html.haml
@@ -2,25 +2,33 @@
 - page_title "Edit", @page.title.capitalize, "Wiki"
 
 %div{ class: container_class }
-  .top-area
+  .wiki-page-header
     %button.btn.btn-default.sidebar-toggle.js-sidebar-wiki-toggle{ role: "button", type: "button" }
       = icon('angle-double-left')
 
     .nav-text
-      %strong
+      %h2.wiki-page-title
         - if @page.persisted?
           = link_to @page.title.capitalize, namespace_project_wiki_path(@project.namespace, @project, @page)
         - else
           = @page.title.capitalize
-      %span.light
-        ·
-        Edit Page
+        %span.light
+          ·
+          - if @page.persisted?
+            Edit Page
+          - else
+            Create Page
 
     .nav-controls
-      - if !(@page && @page.persisted?)
-        - if can?(current_user, :create_wiki, @project)
-          = link_to '#modal-new-wiki', class: "add-new-wiki btn btn-new", "data-toggle" => "modal" do
-            New Page
+      - if can?(current_user, :create_wiki, @project)
+        = link_to '#modal-new-wiki', class: "add-new-wiki btn btn-new", "data-toggle" => "modal" do
+          New Page
+      - if @page.persisted?
+        = link_to namespace_project_wiki_history_path(@project.namespace, @project, @page), class: "btn" do
+          Page History
+        - if can?(current_user, :admin_wiki, @project)
+          = link_to namespace_project_wiki_path(@project.namespace, @project, @page), data: { confirm: "Are you sure you want to delete this page?"}, method: :delete, class: "btn btn-danger" do
+            Delete
 
   = render 'form'
 
diff --git a/app/views/projects/wikis/history.html.haml b/app/views/projects/wikis/history.html.haml
index 58ef26d215a..5f9c3067cc1 100644
--- a/app/views/projects/wikis/history.html.haml
+++ b/app/views/projects/wikis/history.html.haml
@@ -1,15 +1,16 @@
 - page_title "History", @page.title.capitalize, "Wiki"
 
 %div{ class: container_class }
-  .top-area
+  .wiki-page-header
     %button.btn.btn-default.sidebar-toggle.js-sidebar-wiki-toggle{ role: "button", type: "button" }
       = icon('angle-double-left')
+
     .nav-text
-      %strong
+      %h2.wiki-page-title
         = link_to @page.title.capitalize, namespace_project_wiki_path(@project.namespace, @project, @page)
-      %span.light
-        ·
-        History
+        %span.light
+          ·
+          History
 
   .table-holder
     %table.table
diff --git a/app/views/projects/wikis/pages.html.haml b/app/views/projects/wikis/pages.html.haml
index e843b1fb3d3..d89f860d9a8 100644
--- a/app/views/projects/wikis/pages.html.haml
+++ b/app/views/projects/wikis/pages.html.haml
@@ -2,12 +2,12 @@
 - page_title "Pages", "Wiki"
 
 %div{ class: container_class }
-  .top-area
+  .wiki-page-header
     %button.btn.btn-default.sidebar-toggle.js-sidebar-wiki-toggle{ role: "button", type: "button" }
       = icon('angle-double-left')
 
     .nav-text
-      %strong
+      %h2.wiki-page-title
         Wiki Pages
 
   %ul.content-list
diff --git a/app/views/projects/wikis/show.html.haml b/app/views/projects/wikis/show.html.haml
index f331201b52e..28c1c5ab7d1 100644
--- a/app/views/projects/wikis/show.html.haml
+++ b/app/views/projects/wikis/show.html.haml
@@ -2,16 +2,18 @@
 - page_title @page.title.capitalize, "Wiki"
 
 %div{ class: container_class }
-  .top-area
+  .wiki-page-header
     %button.btn.btn-default.sidebar-toggle.js-sidebar-wiki-toggle{ role: "button", type: "button" }
       = icon('angle-double-left')
 
     .nav-text
-      %strong= @page.title.capitalize
+      %h2.wiki-page-title= @page.title.capitalize
 
       %span.wiki-last-edit-by
-        ·
-        last edited by #{@page.commit.author.name} #{time_ago_with_tooltip(@page.commit.authored_date)}
+        Last edited by
+        %strong
+          #{@page.commit.author.name}
+        #{time_ago_with_tooltip(@page.commit.authored_date)}
 
     .nav-controls
       = render 'main_links'
@@ -21,7 +23,6 @@
       This is an old version of this page.
       You can view the #{link_to "most recent version", namespace_project_wiki_path(@project.namespace, @project, @page)} or browse the #{link_to "history", namespace_project_wiki_history_path(@project.namespace, @project, @page)}.
 
-
   .wiki-holder.prepend-top-default.append-bottom-default
     .wiki
       = preserve do