Resolve "Resizable file list and commit panel"

1 files changed, 29 insertions, 5 deletions

diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss
index 51cc1729d9a..d01cbadebcc 100644
--- a/app/assets/stylesheets/pages/repo.scss
+++ b/app/assets/stylesheets/pages/repo.scss
@@ -36,10 +36,6 @@
   }
 }
 
-.with-performance-bar .ide-view {
-  height: calc(100vh - #{$header-height});
-}
-
 .ide-file-list {
   flex: 1;
 
@@ -242,12 +238,13 @@ table.table tr td.multi-file-table-name {
 
 .multi-file-commit-panel {
   display: flex;
+  position: relative;
   flex-direction: column;
   height: 100%;
   width: 290px;
   padding: 0;
   background-color: $gray-light;
-  border-left: 1px solid $white-dark;
+  padding-right: 3px;
 
   .projects-sidebar {
     display: flex;
@@ -496,3 +493,30 @@ table.table tr td.multi-file-table-name {
   margin-top: $header-height;
   margin-bottom: 0;
 }
+
+.with-performance-bar {
+  .ide-flash-container.flash-container {
+    margin-top: $header-height + $performance-bar-height;
+  }
+
+  .ide-view {
+    height: calc(100vh - #{$header-height + $performance-bar-height});
+  }
+}
+
+
+.dragHandle {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  width: 3px;
+  background-color: $white-dark;
+
+  &.dragright {
+    right: 0;
+  }
+
+  &.dragleft {
+    left: 0;
+  }
+}