From fd5439f35752e0a8f4ac9727fa38a4faa8311b78 Mon Sep 17 00:00:00 2001
From: Corey Johnson & Nathan Sobo <cj+nathan@github.com>
Date: Thu, 15 Mar 2012 17:18:26 -0600
Subject: [PATCH] Simplify layout and prevent scrollbar flash when toggling
 file finder.

---
 spec/atom/root-view-spec.coffee |  4 ++--
 src/atom/editor.coffee          |  9 ++++-----
 src/atom/file-finder.coffee     |  1 +
 src/atom/root-view.coffee       |  7 +++----
 static/atom.css                 | 12 +++---------
 static/editor.css               |  9 +++++----
 static/file-finder.css          |  2 +-
 7 files changed, 19 insertions(+), 25 deletions(-)

diff --git a/spec/atom/root-view-spec.coffee b/spec/atom/root-view-spec.coffee
index e1534f604..a4e07ca02 100644
--- a/spec/atom/root-view-spec.coffee
+++ b/spec/atom/root-view-spec.coffee
@@ -34,9 +34,9 @@ describe "RootView", ->
 
   describe ".addPane(view)", ->
     it "adds the given view to the rootView (at the bottom by default)", ->
-      expect(rootView.vertical.children().length).toBe 1
+      expect(rootView.children().length).toBe 1
       rootView.addPane $('<div id="foo">')
-      expect(rootView.vertical.children().length).toBe 2
+      expect(rootView.children().length).toBe 2
 
   describe "the file finder", ->
     describe "when the toggle-file-finder event is triggered", ->
diff --git a/src/atom/editor.coffee b/src/atom/editor.coffee
index 56225d669..e2463f593 100644
--- a/src/atom/editor.coffee
+++ b/src/atom/editor.coffee
@@ -18,11 +18,10 @@ class Editor extends View
 
   @content: ->
     @div class: 'editor', tabindex: -1, =>
-      @div class: 'content', outlet: 'content', =>
-        @subview 'gutter', new Gutter
-        @div class: 'horizontal-scroller', outlet: 'horizontalScroller', =>
-          @div class: 'lines', outlet: 'lines', =>
-            @input class: 'hidden-input', outlet: 'hiddenInput'
+      @subview 'gutter', new Gutter
+      @div class: 'horizontal-scroller', outlet: 'horizontalScroller', =>
+        @div class: 'lines', outlet: 'lines', =>
+          @input class: 'hidden-input', outlet: 'hiddenInput'
 
   vScrollMargin: 2
   hScrollMargin: 10
diff --git a/src/atom/file-finder.coffee b/src/atom/file-finder.coffee
index 380fc5f8c..a1f93d9cd 100644
--- a/src/atom/file-finder.coffee
+++ b/src/atom/file-finder.coffee
@@ -24,6 +24,7 @@ class FileFinder extends View
     @on 'move-down', => @moveDown()
     @on 'file-finder:select-file', => @select()
 
+    @editor.addClass 'single-line'
     @editor.buffer.on 'change', => @populateUrlList()
     @editor.off 'move-up move-down'
 
diff --git a/src/atom/root-view.coffee b/src/atom/root-view.coffee
index d3f13b608..3ad246718 100644
--- a/src/atom/root-view.coffee
+++ b/src/atom/root-view.coffee
@@ -12,9 +12,8 @@ VimMode = require 'vim-mode'
 module.exports =
 class RootView extends View
   @content: ->
-    @div id: 'app-horizontal', outlet: 'horizontal', =>
-      @div id: 'app-vertical', outlet: 'vertical', =>
-        @subview 'editor', new Editor
+    @div id: 'root-view', =>
+      @subview 'editor', new Editor
 
   initialize: ({url}) ->
     @editor.keyEventHandler = window.keymap
@@ -40,7 +39,7 @@ class RootView extends View
       @editor.setBuffer(@project.open(url)) if fs.isFile(url)
 
   addPane: (view) ->
-    @vertical.append(view)
+    @append(view)
 
   toggleFileFinder: ->
     return unless @project
diff --git a/static/atom.css b/static/atom.css
index 802d4bcd2..ab16fe004 100644
--- a/static/atom.css
+++ b/static/atom.css
@@ -8,15 +8,9 @@ body {
   font-size: 12px;
 }
 
-#app-horizontal {
-  min-height: 100%;
-  display: -webkit-flexbox;
-  -webkit-flex-flow: row;
+#root-view {
+  height: 100%;
+  position: relative;
   background-image: url(static/images/linen.png);
 }
 
-#app-vertical {
-  min-height: 100%;
-  width: -webkit-flex(1);
-}
-
diff --git a/static/editor.css b/static/editor.css
index 8105a3aa9..7535448c0 100644
--- a/static/editor.css
+++ b/static/editor.css
@@ -1,4 +1,5 @@
 .editor {
+  display: -webkit-box;
   font: 18px Inconsolata, Monaco, Courier !important;
   position: relative;
   width: 100%;
@@ -6,14 +7,14 @@
   background: #333;
   color: white;
   cursor: default;
-  overflow-y: scroll;
+  overflow-y: auto;
   overflow-x: auto;
 
   -webkit-user-select: none;
 }
 
-.editor .content {
-  display: -webkit-flexbox;
+.editor.single-line {
+  overflow-y: hidden;
 }
 
 .editor .gutter {
@@ -29,7 +30,7 @@
 
 .editor .horizontal-scroller {
   overflow-x: auto;
-  width: -webkit-flex(1);
+  -webkit-box-flex: 1;
 }
 
 .editor.soft-wrap .horizontal-scroller {
diff --git a/static/file-finder.css b/static/file-finder.css
index fe9a58663..88322596d 100644
--- a/static/file-finder.css
+++ b/static/file-finder.css
@@ -1,4 +1,4 @@
-#app-vertical > .file-finder {
+.file-finder {
   position: absolute;
   width: 100%;
   bottom: 0;