BigW Consortium Gitlab

Skip to content

G
gitlab-ce
Commit 6ff039ac by Jacob Schatz
Options

Merge branch 'lbennett/gitlab-ce-2542-implement-updated-ui-for-new-project-page' into 'master'

Implement UI for new project page ## What does this MR do? Updates the project creation page to conform with the latest UI updates. ## Are there points in the code the reviewer needs to double check? Ney. ## Why was this MR needed? Updated UI. ## What are the relevant issue numbers? Closes #2542. ## Screenshots (if relevant) **Desktop:** ![Screen_Shot_2016-06-18_at_04.00.48](/uploads/0313eee96a2aef9ed5e048989548b133/Screen_Shot_2016-06-18_at_04.00.48.png) **Mobile:** ![Screen_Shot_2016-06-18_at_04.01.00](/uploads/505b110c3fcbf523aac08797db9f6781/Screen_Shot_2016-06-18_at_04.01.00.png) See merge request !4766
parents 7a94432e 95714334
Showing with 180 additions and 106 deletions
CHANGELOG
......@@ -167,6 +167,7 @@ v 8.9.0
- Add Application Setting to configure Container Registry token expire delay (default 5min)
- Cache assigned issue and merge request counts in sidebar nav
- Use Knapsack only in CI environment
- Updated project creation page to match new UI #2542
- Cache project build count in sidebar nav
- Add milestone expire date to the right sidebar
- Manually mark a issue or merge request as a todo
......
app/assets/stylesheets/framework/sidebar.scss
.page-with-sidebar {
padding-top: $header-height;
padding-bottom: 25px;
transition: padding $sidebar-transition-duration;
.sidebar-wrapper {
......
app/assets/stylesheets/pages/projects.scss
......@@ -13,10 +13,53 @@
.new_project,
.edit-project {
fieldset.features {
.control-label {
fieldset {
&.features .control-label {
font-weight: normal;
}
.form-group {
margin-bottom: 5px;
}
&> .form-group {
padding-left: 0;
}
}
.help-block {
margin-bottom: 10px;
}
.project-path {
padding-right: 0;
.form-control {
border-radius: $border-radius-base;
}
}
.input-group > div {
&:last-child {
padding-right: 0;
}
}
@media (max-width: $screen-xs-max) {
.input-group > div {
margin-bottom: 14px;
&:last-child {
margin-bottom: 0;
}
}
fieldset > .form-group:first-child {
padding-right: 0;
}
}
.input-group-addon {
&.static-namespace {
height: 35px;
border-radius: 3px;
border: 1px solid #e5e5e5;
}
&+ .select2 a {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
}
}
......@@ -365,10 +408,28 @@ a.deploy-project-label {
}
}
.project-import .btn {
float: left;
margin-bottom: 10px;
margin-right: 10px;
.project-import {
.form-group {
margin-bottom: 0;
}
.import-buttons {
padding-left: 0;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
.btn {
margin-right: 10px;
padding: 8px 12px;
}
&> div {
margin-bottom: 14px;
padding-left: 0;
&:last-child {
margin-bottom: 0;
}
}
}
}
.project-stats {
......
app/views/projects/new.html.haml
- page_title 'New Project'
- header_title "Projects", dashboard_projects_path
%h3.page-title
New Project
%hr
.project-edit-container
.project-edit-errors
= render 'projects/errors'
.project-edit-content
= form_for @project, html: { class: 'new_project form-horizontal js-requires-input' } do |f|
.form-group
= f.label :path, class: 'control-label' do
Project owner
.col-sm-10
= f.select :namespace_id, namespaces_options(:current_user), {}, {class: 'select2 js-select-namespace', tabindex: 1}
- if current_user.can_create_group?
.help-block
Want to house several dependent projects under the same namespace?
= link_to "Create a group", new_group_path
.form-group
= f.label :path, class: 'control-label' do
Project name
.col-sm-10
= f.text_field :path, placeholder: "my-awesome-project", class: "form-control", tabindex: 2, autofocus: true, required: true
- if import_sources_enabled?
.project-import.js-toggle-container
.form-group
%label.control-label Import project from
.col-sm-10
- if github_import_enabled?
- if github_import_configured?
= link_to status_import_github_path, class: 'btn import_github' do
%i.fa.fa-github
GitHub
- else
= link_to '#', class: 'how_to_import_link btn import_github' do
%i.fa.fa-github
GitHub
= render 'github_import_modal'
- if bitbucket_import_enabled?
- if bitbucket_import_configured?
= link_to status_import_bitbucket_path, class: 'btn import_bitbucket', "data-no-turbolink" => "true" do
%i.fa.fa-bitbucket
Bitbucket
- else
= link_to status_import_bitbucket_path, class: 'how_to_import_link btn import_bitbucket', "data-no-turbolink" => "true" do
%i.fa.fa-bitbucket
Bitbucket
= render 'bitbucket_import_modal'
- if gitlab_import_enabled?
- if gitlab_import_configured?
= link_to status_import_gitlab_path, class: 'btn import_gitlab' do
%i.fa.fa-heart
GitLab.com
.row.prepend-top-default
.col-lg-3.profile-settings-sidebar
%h4.prepend-top-0
New project
%p
Create or Import your project from popular Git services
.col-lg-9
= form_for @project, html: { class: 'new_project' } do |f|
%fieldset.append-bottom-0
.form-group.col-xs-12.col-sm-6
= f.label :namespace_id, class: 'label-light' do
%span
Project path
.form-group
.input-group
- if current_user.can_select_namespace?
.input-group-addon
= root_url
= f.select :namespace_id, namespaces_options(params[:namespace_id] || :current_user, display_path: true), {}, {class: 'select2 js-select-namespace', tabindex: 1}
- else
= link_to status_import_gitlab_path, class: 'how_to_import_link btn import_gitlab' do
%i.fa.fa-heart
GitLab.com
= render 'gitlab_import_modal'
- if gitorious_import_enabled?
= link_to new_import_gitorious_path, class: 'btn import_gitorious' do
%i.icon-gitorious.icon-gitorious-small
Gitorious.org
- if google_code_import_enabled?
= link_to new_import_google_code_path, class: 'btn import_google_code' do
%i.fa.fa-google
Google Code
- if fogbugz_import_enabled?
= link_to new_import_fogbugz_path, class: 'btn import_fogbugz' do
%i.fa.fa-bug
Fogbugz
- if git_import_enabled?
= link_to "#", class: 'btn js-toggle-button import_git' do
%i.fa.fa-git
%span Repo by URL
- if gitlab_project_import_enabled?
= link_to new_import_gitlab_project_path, class: 'btn import_gitlab_project project-submit' do
%i.fa.fa-gitlab
%span GitLab export
.js-toggle-content.hide
= render "shared/import_form", f: f
.prepend-botton-10
.form-group
= f.label :description, class: 'control-label' do
Description
%span.light (optional)
.col-sm-10
= f.text_area :description, class: "form-control", rows: 3, maxlength: 250, tabindex: 3
= render 'shared/visibility_level', f: f, visibility_level: default_project_visibility, can_change_visibility_level: true, form_model: @project
.input-group-addon.static-namespace
#{root_url}#{current_user.username}/
.form-group.col-xs-12.col-sm-6.project-path
= f.label :namespace_id, class: 'label-light' do
%span
Project name
= f.text_field :path, placeholder: "my-awesome-project", class: "form-control", tabindex: 2, autofocus: true, required: true
- if current_user.can_create_group?
.help-block
Want to house several dependent projects under the same namespace?
= link_to "Create a group", new_group_path
- if import_sources_enabled?
.project-import.js-toggle-container
.form-group.clearfix
= f.label :visibility_level, class: 'label-light' do
Import project from
.col-sm-12.import-buttons
%div
- if github_import_enabled?
- if github_import_configured?
= link_to status_import_github_path, class: 'btn import_github' do
%i.fa.fa-github
GitHub
- else
= link_to '#', class: 'how_to_import_link btn import_github' do
%i.fa.fa-github
GitHub
= render 'github_import_modal'
%div
- if bitbucket_import_enabled?
- if bitbucket_import_configured?
= link_to status_import_bitbucket_path, class: 'btn import_bitbucket', "data-no-turbolink" => "true" do
%i.fa.fa-bitbucket
Bitbucket
- else
= link_to status_import_bitbucket_path, class: 'how_to_import_link btn import_bitbucket', "data-no-turbolink" => "true" do
%i.fa.fa-bitbucket
Bitbucket
= render 'bitbucket_import_modal'
%div
- if gitlab_import_enabled?
- if gitlab_import_configured?
= link_to status_import_gitlab_path, class: 'btn import_gitlab' do
%i.fa.fa-heart
GitLab.com
- else
= link_to status_import_gitlab_path, class: 'how_to_import_link btn import_gitlab' do
%i.fa.fa-heart
GitLab.com
= render 'gitlab_import_modal'
%div
- if gitorious_import_enabled?
= link_to new_import_gitorious_path, class: 'btn import_gitorious' do
%i.icon-gitorious.icon-gitorious-small
Gitorious.org
%div
- if google_code_import_enabled?
= link_to new_import_google_code_path, class: 'btn import_google_code' do
%i.fa.fa-google
Google Code
%div
- if fogbugz_import_enabled?
= link_to new_import_fogbugz_path, class: 'btn import_fogbugz' do
%i.fa.fa-bug
Fogbugz
%div
- if git_import_enabled?
= link_to "#", class: 'btn js-toggle-button import_git' do
%i.fa.fa-git
%span Repo by URL
%div
- if gitlab_project_import_enabled?
= link_to new_import_gitlab_project_path, class: 'btn import_gitlab_project project-submit' do
%i.fa.fa-gitlab
%span GitLab export
.js-toggle-content.hide
= render "shared/import_form", f: f
.form-group
= f.label :description, class: 'label-light' do
Project description
%span.light (optional)
= f.text_area :description, placeholder: 'Description format', class: "form-control", rows: 3, maxlength: 250
.form-group.project-visibility-level-holder
= f.label :visibility_level, class: 'label-light' do
Visibility Level
= link_to "(?)", help_page_path("public_access", "public_access")
= render('shared/visibility_radios', model_method: :visibility_level, form: f, selected_level: @project.visibility_level, form_model: @project)
.form-actions
= f.submit 'Create project', class: "btn btn-create project-submit", tabindex: 4
= link_to 'Cancel', dashboard_projects_path, class: 'btn btn-cancel'
......
features/steps/dashboard/new_project.rb
......@@ -10,7 +10,7 @@ class Spinach::Features::NewProject < Spinach::FeatureSteps
end
step 'I see "New Project" page' do
expect(page).to have_content('Project owner')
expect(page).to have_content('Project path')
expect(page).to have_content('Project name')
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