Commit 9ea2e664 authored by Phil Hughes's avatar Phil Hughes

Merge branch '48055-web-ide-resize-handles' into 'master'

Resolve "Resize handles for Web IDE right sidebar are too thin"

Closes #48055

See merge request gitlab-org/gitlab-ce!20818
parents 4cebdbbe a8e599f8
......@@ -32,7 +32,7 @@
},
computed: {
className() {
return `drag${this.side}`;
return `drag-${this.side}`;
},
cursorStyle() {
if (this.enabled) {
......@@ -44,8 +44,15 @@
methods: {
resetSize(e) {
e.preventDefault();
this.$emit('resize-start', this.size);
this.size = this.startSize;
this.$emit('update:size', this.size);
// End resizing on next tick so that listeners can react to DOM changes
this.$nextTick(() => {
this.$emit('resize-end', this.size);
});
},
startDrag(e) {
if (this.enabled) {
......@@ -84,7 +91,7 @@
<div
:class="className"
:style="cursorStyle"
class="dragHandle"
class="drag-handle"
@mousedown="startDrag"
@dblclick="resetSize"
></div>
......
......@@ -833,18 +833,21 @@
}
}
.dragHandle {
.drag-handle {
position: absolute;
top: 0;
bottom: 0;
width: 1px;
background-color: $white-dark;
width: 4px;
&.dragright {
&:hover {
background-color: $white-normal;
}
&.drag-right {
right: 0;
}
&.dragleft {
&.drag-left {
left: 0;
}
}
......
---
title: Increase width of Web IDE sidebar resize handles
merge_request: 20818
author:
type: fixed
......@@ -29,7 +29,7 @@ describe('Panel Resizer component', () => {
});
expect(vm.$el.tagName).toEqual('DIV');
expect(vm.$el.getAttribute('class')).toBe('dragHandle dragleft');
expect(vm.$el.getAttribute('class')).toBe('drag-handle drag-left');
expect(vm.$el.getAttribute('style')).toBe('cursor: ew-resize;');
});
......@@ -40,7 +40,7 @@ describe('Panel Resizer component', () => {
});
expect(vm.$el.tagName).toEqual('DIV');
expect(vm.$el.getAttribute('class')).toBe('dragHandle dragright');
expect(vm.$el.getAttribute('class')).toBe('drag-handle drag-right');
});
it('drag the resizer', () => {
......
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