Merge branch 'leipert-42037-long-instance-names-group-names-covers-namespace-dropdown' into 'master'
Prevent overflow of long instance urls during Project creation Closes #42037 See merge request gitlab-org/gitlab-ce!17717
This commit is contained in:
commit
e03160c5ab
|
@ -9,7 +9,6 @@
|
||||||
.new_project,
|
.new_project,
|
||||||
.edit-project,
|
.edit-project,
|
||||||
.import-project {
|
.import-project {
|
||||||
|
|
||||||
.help-block {
|
.help-block {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
@ -18,18 +17,25 @@
|
||||||
border-radius: $border-radius-base;
|
border-radius: $border-radius-base;
|
||||||
}
|
}
|
||||||
|
|
||||||
.input-group > div {
|
.input-group {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
&:last-child {
|
.select2-container {
|
||||||
padding-right: 0;
|
display: unset;
|
||||||
|
max-width: unset;
|
||||||
|
width: unset !important;
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
> div {
|
||||||
|
&:last-child {
|
||||||
|
padding-right: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: $screen-xs-max) {
|
@media (max-width: $screen-xs-max) {
|
||||||
.input-group > div {
|
.input-group > div {
|
||||||
|
|
||||||
margin-bottom: 14px;
|
|
||||||
|
|
||||||
&:last-child {
|
&:last-child {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
@ -41,17 +47,24 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.input-group-addon {
|
.input-group-addon {
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
line-height: unset;
|
||||||
|
width: unset;
|
||||||
|
max-width: 50%;
|
||||||
|
text-align: left;
|
||||||
|
|
||||||
&.static-namespace {
|
&.static-namespace {
|
||||||
height: 35px;
|
height: 35px;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
border: 1px solid $border-color;
|
border: 1px solid $border-color;
|
||||||
|
max-width: 100%;
|
||||||
|
flex-grow: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
+ .select2 a,
|
+ .select2 a,
|
||||||
+ .btn-default {
|
+ .btn-default {
|
||||||
border-top-left-radius: 0;
|
border-radius: 0 $border-radius-base $border-radius-base 0;
|
||||||
border-bottom-left-radius: 0;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -290,7 +303,7 @@
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
font-weight: $gl-font-weight-bold;
|
font-weight: $gl-font-weight-bold;
|
||||||
line-height: 13px;
|
line-height: 13px;
|
||||||
letter-spacing: .4px;
|
letter-spacing: 0.4px;
|
||||||
padding: 6px 14px;
|
padding: 6px 14px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
|
@ -443,7 +456,7 @@ a.deploy-project-label {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
||||||
&.disabled {
|
&.disabled {
|
||||||
opacity: .3;
|
opacity: 0.3;
|
||||||
cursor: not-allowed;
|
cursor: not-allowed;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -600,26 +613,26 @@ a.deploy-project-label {
|
||||||
}
|
}
|
||||||
|
|
||||||
.first-column {
|
.first-column {
|
||||||
@media(min-width: $screen-xs-min) {
|
@media (min-width: $screen-xs-min) {
|
||||||
max-width: 50%;
|
max-width: 50%;
|
||||||
padding-right: 30px;
|
padding-right: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media(max-width: $screen-xs-max) {
|
@media (max-width: $screen-xs-max) {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.second-column {
|
.second-column {
|
||||||
@media(min-width: $screen-xs-min) {
|
@media (min-width: $screen-xs-min) {
|
||||||
width: 50%;
|
width: 50%;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
padding-left: 30px;
|
padding-left: 30px;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media(max-width: $screen-xs-max) {
|
@media (max-width: $screen-xs-max) {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
|
@ -632,7 +645,7 @@ a.deploy-project-label {
|
||||||
}
|
}
|
||||||
|
|
||||||
&::before {
|
&::before {
|
||||||
content: "OR";
|
content: 'OR';
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: -10px;
|
left: -10px;
|
||||||
top: 50%;
|
top: 50%;
|
||||||
|
@ -656,7 +669,7 @@ a.deploy-project-label {
|
||||||
}
|
}
|
||||||
|
|
||||||
&::after {
|
&::after {
|
||||||
content: "";
|
content: '';
|
||||||
position: absolute;
|
position: absolute;
|
||||||
background-color: $border-color;
|
background-color: $border-color;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
|
@ -921,10 +934,7 @@ pre.light-well {
|
||||||
border-right: solid 1px transparent;
|
border-right: solid 1px transparent;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.protected-tags-list,
|
|
||||||
.protected-branches-list {
|
|
||||||
.dropdown-menu-toggle {
|
.dropdown-menu-toggle {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: 300px;
|
max-width: 300px;
|
||||||
|
|
|
@ -13,13 +13,13 @@
|
||||||
.form-group
|
.form-group
|
||||||
.input-group
|
.input-group
|
||||||
- if current_user.can_select_namespace?
|
- if current_user.can_select_namespace?
|
||||||
.input-group-addon
|
.input-group-addon.has-tooltip{ title: root_url }
|
||||||
= root_url
|
= root_url
|
||||||
= select_tag :namespace_id, namespaces_options(namespace_id_from(params) || :current_user, display_path: true, extra_group: namespace_id_from(params)), class: 'select2 js-select-namespace', tabindex: 1
|
= select_tag :namespace_id, namespaces_options(namespace_id_from(params) || :current_user, display_path: true, extra_group: namespace_id_from(params)), class: 'select2 js-select-namespace', tabindex: 1
|
||||||
|
|
||||||
- else
|
- else
|
||||||
.input-group-addon.static-namespace
|
.input-group-addon.static-namespace.has-tooltip{ title: user_url(current_user.username) + '/' }
|
||||||
#{root_url}#{current_user.username}/
|
#{user_url(current_user.username)}/
|
||||||
= hidden_field_tag :namespace_id, value: current_user.namespace_id
|
= hidden_field_tag :namespace_id, value: current_user.namespace_id
|
||||||
.form-group.col-xs-12.col-sm-6.project-path
|
.form-group.col-xs-12.col-sm-6.project-path
|
||||||
= label_tag :path, 'Project name', class: 'label-light'
|
= label_tag :path, 'Project name', class: 'label-light'
|
||||||
|
|
|
@ -9,12 +9,12 @@
|
||||||
Project path
|
Project path
|
||||||
.input-group
|
.input-group
|
||||||
- if current_user.can_select_namespace?
|
- if current_user.can_select_namespace?
|
||||||
.input-group-addon
|
.input-group-addon.has-tooltip{ title: root_url }
|
||||||
= root_url
|
= root_url
|
||||||
= f.select :namespace_id, namespaces_options(namespace_id_from(params) || :current_user, display_path: true, extra_group: namespace_id_from(params)), {}, { class: 'select2 js-select-namespace qa-project-namespace-select', tabindex: 1}
|
= f.select :namespace_id, namespaces_options(namespace_id_from(params) || :current_user, display_path: true, extra_group: namespace_id_from(params)), {}, { class: 'select2 js-select-namespace qa-project-namespace-select', tabindex: 1}
|
||||||
|
|
||||||
- else
|
- else
|
||||||
.input-group-addon.static-namespace
|
.input-group-addon.static-namespace.has-tooltip{ title: user_url(current_user.username) + '/' }
|
||||||
#{user_url(current_user.username)}/
|
#{user_url(current_user.username)}/
|
||||||
= f.hidden_field :namespace_id, value: current_user.namespace_id
|
= f.hidden_field :namespace_id, value: current_user.namespace_id
|
||||||
.form-group.project-path.col-sm-6
|
.form-group.project-path.col-sm-6
|
||||||
|
|
|
@ -0,0 +1,5 @@
|
||||||
|
---
|
||||||
|
title: Long instance urls do not overflow anymore during project creation
|
||||||
|
merge_request: 17717
|
||||||
|
author:
|
||||||
|
type: fixed
|
Loading…
Reference in New Issue