Merge branch '11489-branded-appearance-to-ce' into 'master'

Branded appearance to CE

Closes #11489 

The difference with the EE version is only that there is no distinction between light and dark logos, though this wasn't used anyway. If this is fine, I'll create a MR on EE too.

TODO:
- [x] Copy docs
- [x] Make new screenshots
- [ ] Remove Custom Welcome message feature?

@rymai: I was unsure what labels to add to ping you, so I just ping you like this :wink: 

/cc @DouweM

See merge request !2927

9 files changed, 199 insertions, 10 deletions

diff --git a/app/assets/stylesheets/pages/appearances.scss b/app/assets/stylesheets/pages/appearances.scss
new file mode 100644
index 00000000000..e2070f17c3b
--- /dev/null
+++ b/app/assets/stylesheets/pages/appearances.scss
@@ -0,0 +1,11 @@
+.appearance-logo-preview {
+  max-width: 400px;
+  margin-bottom: 20px;
+}
+
+.appearance-light-logo-preview {
+  background-color:  $background-color;
+  max-width: 72px;
+  padding: 10px;
+  margin-bottom: 10px;
+}
diff --git a/app/controllers/admin/appearances_controller.rb b/app/controllers/admin/appearances_controller.rb
new file mode 100644
index 00000000000..26cf74e4849
--- /dev/null
+++ b/app/controllers/admin/appearances_controller.rb
@@ -0,0 +1,57 @@
+class Admin::AppearancesController < Admin::ApplicationController
+  before_action :set_appearance, except: :create
+
+  def show
+  end
+
+  def preview
+  end
+
+  def create
+    @appearance = Appearance.new(appearance_params)
+
+    if @appearance.save
+      redirect_to admin_appearances_path, notice: 'Appearance was successfully created.'
+    else
+      render action: 'show'
+    end
+  end
+
+  def update
+    if @appearance.update(appearance_params)
+      redirect_to admin_appearances_path, notice: 'Appearance was successfully updated.'
+    else
+      render action: 'show'
+    end
+  end
+
+  def logo
+    @appearance.remove_logo!
+
+    @appearance.save
+
+    redirect_to admin_appearances_path, notice: 'Logo was succesfully removed.'
+  end
+
+  def header_logos
+    @appearance.remove_header_logo!
+    @appearance.save
+
+    redirect_to admin_appearances_path, notice: 'Header logo was succesfully removed.'
+  end
+
+  private
+
+  # Use callbacks to share common setup or constraints between actions.
+  def set_appearance
+    @appearance = Appearance.last || Appearance.new
+  end
+
+  # Only allow a trusted parameter "white list" through.
+  def appearance_params
+    params.require(:appearance).permit(
+      :title, :description, :logo, :logo_cache, :header_logo, :header_logo_cache,
+      :updated_by
+    )
+  end
+end
diff --git a/app/controllers/uploads_controller.rb b/app/controllers/uploads_controller.rb
index 868b05929d7..509f4f412ca 100644
--- a/app/controllers/uploads_controller.rb
+++ b/app/controllers/uploads_controller.rb
@@ -55,14 +55,15 @@ class UploadsController < ApplicationController
       "user"    => User,
       "project" => Project,
       "note"    => Note,
-      "group"   => Group
+      "group"   => Group,
+      "appearance" => Appearance
     }
 
     upload_models[params[:model]]
   end
 
   def upload_mount
-    upload_mounts = %w(avatar attachment file)
+    upload_mounts = %w(avatar attachment file logo header_logo)
 
     if upload_mounts.include?(params[:mounted_as])
       params[:mounted_as]
diff --git a/app/helpers/appearances_helper.rb b/app/helpers/appearances_helper.rb
index c5820bf4c50..e0abc3a2869 100644
--- a/app/helpers/appearances_helper.rb
+++ b/app/helpers/appearances_helper.rb
@@ -1,21 +1,33 @@
 module AppearancesHelper
-  def brand_item
-    nil
-  end
-
   def brand_title
-    'GitLab Community Edition'
+    if brand_item && brand_item.title
+      brand_item.title
+    else
+      'GitLab Community Edition'
+    end
   end
 
   def brand_image
-    nil
+    if brand_item.logo?
+      image_tag brand_item.logo
+    else
+      nil
+    end
   end
 
   def brand_text
-    nil
+    markdown(brand_item.description)
+  end
+
+  def brand_item
+    @appearance ||= Appearance.first
   end
 
   def brand_header_logo
-    render 'shared/logo.svg'
+    if brand_item && brand_item.header_logo?
+      image_tag brand_item.header_logo
+    else
+      render 'shared/logo.svg'
+    end
   end
 end
diff --git a/app/models/appearance.rb b/app/models/appearance.rb
new file mode 100644
index 00000000000..4cf8dd9a8ce
--- /dev/null
+++ b/app/models/appearance.rb
@@ -0,0 +1,9 @@
+class Appearance < ActiveRecord::Base
+  validates :title,       presence: true
+  validates :description, presence: true
+  validates :logo,        file_size: { maximum: 1.megabyte }
+  validates :header_logo, file_size: { maximum: 1.megabyte }
+
+  mount_uploader :logo,         AttachmentUploader
+  mount_uploader :header_logo,  AttachmentUploader
+end
diff --git a/app/views/admin/appearances/_form.html.haml b/app/views/admin/appearances/_form.html.haml
new file mode 100644
index 00000000000..6f325914d14
--- /dev/null
+++ b/app/views/admin/appearances/_form.html.haml
@@ -0,0 +1,58 @@
+= form_for @appearance, url: admin_appearances_path, html: { class: 'form-horizontal'} do |f|
+  - if @appearance.errors.any?
+    .alert.alert-danger
+      - @appearance.errors.full_messages.each do |msg|
+        %p= msg
+
+  %fieldset.sign-in
+    %legend
+      Sign in/Sign up pages:
+  .form-group
+    = f.label :title, class: 'control-label'
+    .col-sm-10
+      = f.text_field :title, class: "form-control"
+  .form-group
+    = f.label :description, class: 'control-label'
+    .col-sm-10
+      = f.text_area :description, class: "form-control", rows: 10
+      .hint
+        Description parsed with #{link_to "GitLab Flavored Markdown", help_page_path('markdown', 'markdown'), target: '_blank'}.
+  .form-group
+    = f.label :logo, class: 'control-label'
+    .col-sm-10
+      - if @appearance.logo?
+        = image_tag @appearance.logo_url, class: 'appearance-logo-preview'
+        - if @appearance.persisted?
+          %br
+          = link_to 'Remove logo', logo_admin_appearances_path, data: { confirm: "Logo will be removed. Are you sure?"}, method: :delete, class: "btn btn-remove btn-small remove-logo"
+        %hr
+      = f.hidden_field :logo_cache
+      = f.file_field :logo, class: ""
+      .hint
+        Maximum file size is 1MB. Pages are optimized for a 640x360 px logo.
+
+  %fieldset.app_logo
+    %legend
+      Navigation bar:
+  .form-group
+    = f.label :header_logo, 'Header logo', class: 'control-label'
+    .col-sm-10
+      - if @appearance.header_logo?
+        = image_tag @appearance.header_logo_url, class: 'appearance-light-logo-preview'
+        - if @appearance.persisted?
+          %br
+          = link_to 'Remove header logo', header_logos_admin_appearances_path, data: { confirm: "Header logo will be removed. Are you sure?"}, method: :delete, class: "btn btn-remove btn-small remove-logo"
+        %hr
+      = f.hidden_field :header_logo_cache
+      = f.file_field :header_logo, class: ""
+      .hint
+        Maximum file size is 1MB. Pages are optimized for a 72x72 px header logo
+
+  .form-actions
+    = f.submit 'Save', class: 'btn btn-save'
+    - if @appearance.persisted?
+      = link_to 'Preview last save', preview_admin_appearances_path, class: 'btn', target: '_blank'
+
+    - if @appearance.updated_at
+      %span.pull-right
+        Last edit #{time_ago_with_tooltip(@appearance.updated_at)}
diff --git a/app/views/admin/appearances/preview.html.haml b/app/views/admin/appearances/preview.html.haml
new file mode 100644
index 00000000000..dd4a64e80bc
--- /dev/null
+++ b/app/views/admin/appearances/preview.html.haml
@@ -0,0 +1,29 @@
+- page_title "Preview | Appearance"
+%h3.page-title
+  Appearance settings - Preview
+%hr
+
+.ui-box
+  .title
+    Sign-in page
+  %div
+    .login-page
+      .container
+        .content
+          .login-title
+            %h1= brand_title
+      %hr
+      .container
+        .content
+          .row
+            .col-sm-7
+              .brand-image
+                = brand_image
+              .brand_text
+                = brand_text
+            .col-sm-4
+              .login-box
+                %h3.page-title Sign in
+                = text_field_tag :login, nil, class: "form-control top", placeholder: "Username or Email"
+                = password_field_tag :password, nil, class: "form-control bottom", placeholder: "Password"
+                = button_tag "Sign in", class: "btn-create btn"
diff --git a/app/views/admin/appearances/show.html.haml b/app/views/admin/appearances/show.html.haml
new file mode 100644
index 00000000000..089e8e4cb7a
--- /dev/null
+++ b/app/views/admin/appearances/show.html.haml
@@ -0,0 +1,7 @@
+- page_title "Appearance"
+%h3.page-title
+  Appearance settings
+%p.light
+  You can modify the look and feel of GitLab here
+
+= render 'form'
diff --git a/app/views/layouts/nav/_admin.html.haml b/app/views/layouts/nav/_admin.html.haml
index ac1d5429382..280a1b93729 100644
--- a/app/views/layouts/nav/_admin.html.haml
+++ b/app/views/layouts/nav/_admin.html.haml
@@ -56,6 +56,11 @@
       = icon('cog fw')
       %span
         Background Jobs
+  = nav_link(controller: :appearances) do
+    = link_to admin_appearances_path, title: 'Appearances' do
+      = icon('image')
+      %span
+        Appearance
 
   = nav_link(controller: :applications) do
     = link_to admin_applications_path, title: 'Applications' do