kotovalexarian-likes-gitlab/gitlab-org--gitlab-foss
1
0
Fork 0
Code Releases Activity

Merge branch 'backport-border-inline-edit' into 'master'

Browse source 
Backport - Add border for epic edit button

See merge request gitlab-org/gitlab-ce!15637
This commit is contained in:
Fatih Acet 2017-11-29 09:43:25 +00:00
commit e74ef3acea
6 changed files with 20 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/assets/javascripts/issue_show/components/title.vue
View file

@ -79,7 +79,7 @@
v-tooltip v-tooltip
v-if="showInlineEditButton && canUpdate" v-if="showInlineEditButton && canUpdate"
type="button" type="button"
class="btn-blank btn-edit note-action-button" class="btn btn-default btn-edit btn-svg"
v-html="pencilIcon" v-html="pencilIcon"
title="Edit title and description" title="Edit title and description"
data-placement="bottom" data-placement="bottom"

2
app/assets/stylesheets/framework/animations.scss
View file

@ -125,7 +125,7 @@
@include transition(border-color); @include transition(border-color);
} }
.note-action-button .link-highlight, .note-action-button,
.toolbar-btn, .toolbar-btn,
.dropdown-toggle-caret { .dropdown-toggle-caret {
@include transition(color); @include transition(color);

11
app/assets/stylesheets/framework/buttons.scss
View file

@ -131,6 +131,13 @@
} }
} }
@mixin btn-svg {
height: $gl-padding;
width: $gl-padding;
top: 0;
vertical-align: text-top;
}
.btn { .btn {
@include btn-default; @include btn-default;
@include btn-white; @include btn-white;
@ -429,3 +436,7 @@
text-decoration: none; text-decoration: none;
} }
} }
.btn-svg svg {
@include btn-svg;
}

5
app/assets/stylesheets/pages/issuable.scss
View file

@ -70,14 +70,13 @@
.title { .title {
padding: 0; padding: 0;
margin-bottom: 16px; margin-bottom: $gl-padding;
border-bottom: 0; border-bottom: 0;
} }
.btn-edit { .btn-edit {
margin-left: auto; margin-left: auto;
// Set height to match title height height: $gl-padding * 2;
height: 2em;
} }
// Border around images in issue and MR descriptions. // Border around images in issue and MR descriptions.

5
app/assets/stylesheets/pages/notes.scss
View file

@ -543,10 +543,7 @@ ul.notes {
} }
svg { svg {
height: 16px; @include btn-svg;
width: 16px;
top: 0;
vertical-align: text-top;
} }
.award-control-icon-positive, .award-control-icon-positive,

8
spec/javascripts/issue_show/components/title_spec.js
View file

@ -80,19 +80,19 @@ describe('Title component', () => {
}); });
it('should not show by default', () => { it('should not show by default', () => {
expect(vm.$el.querySelector('.note-action-button')).toBeNull(); expect(vm.$el.querySelector('.btn-edit')).toBeNull();
}); });
it('should not show if canUpdate is false', () => { it('should not show if canUpdate is false', () => {
vm.showInlineEditButton = true; vm.showInlineEditButton = true;
vm.canUpdate = false; vm.canUpdate = false;
expect(vm.$el.querySelector('.note-action-button')).toBeNull(); expect(vm.$el.querySelector('.btn-edit')).toBeNull();
}); });
it('should show if showInlineEditButton and canUpdate', () => { it('should show if showInlineEditButton and canUpdate', () => {
vm.showInlineEditButton = true; vm.showInlineEditButton = true;
vm.canUpdate = true; vm.canUpdate = true;
expect(vm.$el.querySelector('.note-action-button')).toBeDefined(); expect(vm.$el.querySelector('.btn-edit')).toBeDefined();
}); });
it('should trigger open.form event when clicked', () => { it('should trigger open.form event when clicked', () => {
@ -100,7 +100,7 @@ describe('Title component', () => {
vm.canUpdate = true; vm.canUpdate = true;
Vue.nextTick(() => { Vue.nextTick(() => {
vm.$el.querySelector('.note-action-button').click(); vm.$el.querySelector('.btn-edit').click();
expect(eventHub.$emit).toHaveBeenCalledWith('open.form'); expect(eventHub.$emit).toHaveBeenCalledWith('open.form');
}); });
}); });