Commit 5a3c5ace authored by Douwe Maan's avatar Douwe Maan Committed by Rémy Coutable

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 😉

/cc @DouweM

See merge request !2927
parent cdb8fc5e
...@@ -2,7 +2,9 @@ Please view this file on the master branch, on stable branches it's out of date. ...@@ -2,7 +2,9 @@ Please view this file on the master branch, on stable branches it's out of date.
v 8.5.2 v 8.5.2
- Fix sidebar overlapping content when screen width was below 1200px - Fix sidebar overlapping content when screen width was below 1200px
- Bring the "branded appearance" feature from EE to CE
- Fix error 500 when commenting on a commit - Fix error 500 when commenting on a commit
- Update Rails to 4.2.5.2
v 8.5.1 v 8.5.1
- Fix group projects styles - Fix group projects styles
......
.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;
}
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
...@@ -55,14 +55,15 @@ class UploadsController < ApplicationController ...@@ -55,14 +55,15 @@ class UploadsController < ApplicationController
"user" => User, "user" => User,
"project" => Project, "project" => Project,
"note" => Note, "note" => Note,
"group" => Group "group" => Group,
"appearance" => Appearance
} }
upload_models[params[:model]] upload_models[params[:model]]
end end
def upload_mount 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]) if upload_mounts.include?(params[:mounted_as])
params[:mounted_as] params[:mounted_as]
......
module AppearancesHelper module AppearancesHelper
def brand_item
nil
end
def brand_title def brand_title
'GitLab Community Edition' if brand_item && brand_item.title
brand_item.title
else
'GitLab Community Edition'
end
end end
def brand_image def brand_image
nil if brand_item.logo?
image_tag brand_item.logo
else
nil
end
end end
def brand_text def brand_text
nil markdown(brand_item.description)
end
def brand_item
@appearance ||= Appearance.first
end end
def brand_header_logo 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
end end
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
= 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)}
- 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"
- page_title "Appearance"
%h3.page-title
Appearance settings
%p.light
You can modify the look and feel of GitLab here
= render 'form'
...@@ -56,6 +56,11 @@ ...@@ -56,6 +56,11 @@
= icon('cog fw') = icon('cog fw')
%span %span
Background Jobs Background Jobs
= nav_link(controller: :appearances) do
= link_to admin_appearances_path, title: 'Appearances' do
= icon('image')
%span
Appearance
= nav_link(controller: :applications) do = nav_link(controller: :applications) do
= link_to admin_applications_path, title: 'Applications' do = link_to admin_applications_path, title: 'Applications' do
......
...@@ -154,6 +154,11 @@ Rails.application.routes.draw do ...@@ -154,6 +154,11 @@ Rails.application.routes.draw do
to: "uploads#show", to: "uploads#show",
constraints: { model: /note|user|group|project/, mounted_as: /avatar|attachment/, filename: /[^\/]+/ } constraints: { model: /note|user|group|project/, mounted_as: /avatar|attachment/, filename: /[^\/]+/ }
# Appearance
get ":model/:mounted_as/:id/:filename",
to: "uploads#show",
constraints: { model: /appearance/, mounted_as: /logo|header_logo/, filename: /.+/ }
# Project markdown uploads # Project markdown uploads
get ":namespace_id/:project_id/:secret/:filename", get ":namespace_id/:project_id/:secret/:filename",
to: "projects/uploads#show", to: "projects/uploads#show",
...@@ -251,6 +256,14 @@ Rails.application.routes.draw do ...@@ -251,6 +256,14 @@ Rails.application.routes.draw do
end end
end end
resource :appearances, path: 'appearance' do
member do
get :preview
delete :logo
delete :header_logos
end
end
resource :application_settings, only: [:show, :update] do resource :application_settings, only: [:show, :update] do
resources :services resources :services
put :reset_runners_token put :reset_runners_token
......
class CreateAppearancesCE < ActiveRecord::Migration
def change
unless table_exists?(:appearances)
create_table :appearances do |t|
t.string :title
t.text :description
t.string :header_logo
t.string :logo
t.timestamps null: false
end
end
end
end
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
# #
# It's strongly recommended that you check this file into your version control system. # It's strongly recommended that you check this file into your version control system.
ActiveRecord::Schema.define(version: 20160220123949) do ActiveRecord::Schema.define(version: 20160222153918) do
# These are extensions that must be enabled in order to support this database # These are extensions that must be enabled in order to support this database
enable_extension "plpgsql" enable_extension "plpgsql"
...@@ -24,6 +24,15 @@ ActiveRecord::Schema.define(version: 20160220123949) do ...@@ -24,6 +24,15 @@ ActiveRecord::Schema.define(version: 20160220123949) do
t.datetime "updated_at" t.datetime "updated_at"
end end
create_table "appearances", force: :cascade do |t|
t.string "title"
t.text "description"
t.string "header_logo"
t.string "logo"
t.datetime "created_at", null: false
t.datetime "updated_at", null: false
end
create_table "application_settings", force: :cascade do |t| create_table "application_settings", force: :cascade do |t|
t.integer "default_projects_limit" t.integer "default_projects_limit"
t.boolean "signup_enabled" t.boolean "signup_enabled"
......
# Changing the appearance of the login page
GitLab Community Edition offers a way to put your company's identity on the login page of your GitLab server and make it a branded login page.
By default, the page shows the GitLab logo and description.
![default_login_page](branded_login_page/default_login_page.png)
## Changing the appearance of the login page
Navigate to the **Admin** area and go to the **Appearance** page.
Fill in the required details like Title, Description and upload the company logo.
![appearance](branded_login_page/appearance.png)
After saving the page, your GitLab login page will have the details you filled in:
![company_login_page](branded_login_page/custom_sign_in.png)
# Customize the complete sign-in page (GitLab Enterprise Edition only) # Customize the complete sign-in page
Please see [Branded login page](http://doc.gitlab.com/ee/customization/branded_login_page.html) Please see [Branded login page](branded_login_page.md)
# Add a welcome message to the sign-in page (GitLab Community Edition) # Add a welcome message to the sign-in page (GitLab Community Edition)
It is possible to add a markdown-formatted welcome message to your GitLab It is possible to add a markdown-formatted welcome message to your GitLab
sign-in page. Users of GitLab Enterprise Edition should use the [branded login sign-in page. Users of GitLab Enterprise Edition should use the [branded login
page feature](/ee/customization/branded_login_page.html) instead. page feature](branded_login_page.md) instead.
The welcome message (extra_sign_in_text) can now be set/changed in the Admin UI. The welcome message (extra_sign_in_text) can now be set/changed in the Admin UI.
Admin area > Settings Admin area > Settings
\ No newline at end of file
Feature: Admin Appearance
Scenario: Create new appearance
Given I sign in as an admin
And I visit admin appearance page
When submit form with new appearance
Then I should be redirected to admin appearance page
And I should see newly created appearance
Scenario: Preview appearance
Given application has custom appearance
And I sign in as an admin
When I visit admin appearance page
And I click preview button
Then I should see a customized appearance
Scenario: Custom sign-in page
Given application has custom appearance
When I visit login page
Then I should see a customized appearance
Scenario: Appearance logo
Given application has custom appearance
And I sign in as an admin
And I visit admin appearance page
When I attach a logo
Then I should see a logo
And I remove the logo
Then I should see logo removed
Scenario: Header logos
Given application has custom appearance
And I sign in as an admin
And I visit admin appearance page
When I attach header logos
Then I should see header logos
And I remove the header logos
Then I should see header logos removed
class Spinach::Features::AdminAppearance < Spinach::FeatureSteps
include SharedAuthentication
include SharedPaths
step 'submit form with new appearance' do
fill_in 'appearance_title', with: 'MyCompany'
fill_in 'appearance_description', with: 'dev server'
click_button 'Save'
end
step 'I should be redirected to admin appearance page' do
expect(current_path).to eq admin_appearances_path
expect(page).to have_content 'Appearance settings'
end
step 'I should see newly created appearance' do
expect(page).to have_field('appearance_title', with: 'MyCompany')
expect(page).to have_field('appearance_description', with: 'dev server')
expect(page).to have_content 'Last edit'
end
step 'I click preview button' do
click_link "Preview"
end
step 'application has custom appearance' do
create(:appearance)
end
step 'I should see a customized appearance' do
expect(page).to have_content appearance.title
expect(page).to have_content appearance.description
end
step 'I attach a logo' do
attach_file(:appearance_logo, Rails.root.join('spec', 'fixtures', 'dk.png'))
click_button 'Save'
end
step 'I attach header logos' do
attach_file(:appearance_header_logo, Rails.root.join('spec', 'fixtures', 'dk.png'))
click_button 'Save'
end
step 'I should see a logo' do
expect(page).to have_xpath('//img[@src="/uploads/appearance/logo/1/dk.png"]')
end
step 'I should see header logos' do
expect(page).to have_xpath('//img[@src="/uploads/appearance/header_logo/1/dk.png"]')
end
step 'I remove the logo' do
click_link 'Remove logo'
end
step 'I remove the header logos' do
click_link 'Remove header logo'
end
step 'I should see logo removed' do
expect(page).not_to have_xpath('//img[@src="/uploads/appearance/logo/1/gitlab_logo.png"]')
end
step 'I should see header logos removed' do
expect(page).not_to have_xpath('//img[@src="/uploads/appearance/header_logo/1/header_logo_light.png"]')
end
def appearance
Appearance.last
end
end
...@@ -7,6 +7,10 @@ module SharedPaths ...@@ -7,6 +7,10 @@ module SharedPaths
visit new_project_path visit new_project_path
end end
step 'I visit login page' do
visit new_user_session_path
end
# ---------------------------------------- # ----------------------------------------
# User # User
# ---------------------------------------- # ----------------------------------------
...@@ -187,6 +191,10 @@ module SharedPaths ...@@ -187,6 +191,10 @@ module SharedPaths
visit admin_groups_path visit admin_groups_path
end end
step 'I visit admin appearance page' do
visit admin_appearances_path
end
step 'I visit admin teams page' do step 'I visit admin teams page' do
visit admin_teams_path visit admin_teams_path
end end
......
# Read about factories at https://github.com/thoughtbot/factory_girl
FactoryGirl.define do
factory :appearance do
title "MepMep"
description "This is my Community Edition instance"
end
end
require 'rails_helper'
RSpec.describe Appearance, type: :model do
subject { create(:appearance) }
it { is_expected.to be_valid }
it { is_expected.to validate_presence_of(:title) }
it { is_expected.to validate_presence_of(:description) }
end
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment