From 14ca7509321df0b1c66dad7c6fb396bb3d675f20 Mon Sep 17 00:00:00 2001 From: Jon Rohan Date: Tue, 25 Dec 2012 11:18:13 -0800 Subject: [PATCH 1/4] Changing around the status bar html --- src/packages/status-bar/src/status-bar.coffee | 18 +++--- static/status-bar.css | 62 +++++++++++-------- 2 files changed, 45 insertions(+), 35 deletions(-) diff --git a/src/packages/status-bar/src/status-bar.coffee b/src/packages/status-bar/src/status-bar.coffee index 744304287..ade0e798d 100644 --- a/src/packages/status-bar/src/status-bar.coffee +++ b/src/packages/status-bar/src/status-bar.coffee @@ -19,15 +19,15 @@ class StatusBar extends View @content: -> @div class: 'status-bar', => - @div class: 'file-info', => + @span class: 'git-branch', outlet: 'branchArea', => + @span class: 'octicons branch-icon' + @span class: 'branch-label', outlet: 'branchLabel' + @span class: 'git-status', outlet: 'gitStatusIcon' + @span class: 'cursor-position', outlet: 'cursorPosition' + @span class: 'file-info', => @span class: 'current-path', outlet: 'currentPath' @span class: 'buffer-modified', outlet: 'bufferModified' - @div class: 'cursor-position', => - @span outlet: 'gitStatusIcon' - @span outlet: 'branchArea', => - @span class: 'octicons branch-icon' - @span class: 'branch-label', outlet: 'branchLabel' - @span outlet: 'cursorPosition' + initialize: (@rootView, @editor) -> @updatePathText() @@ -76,7 +76,7 @@ class StatusBar extends View @gitStatusIcon.empty() return unless path - @gitStatusIcon.removeClass().addClass('octicons') + @gitStatusIcon.removeClass().addClass('git-status octicons') if @buffer.getGit()?.isPathModified(path) @gitStatusIcon.addClass('modified-status-icon') else if @buffer.getGit()?.isPathNew(path) @@ -90,4 +90,4 @@ class StatusBar extends View updateCursorPositionText: -> { row, column } = @editor.getCursorBufferPosition() - @cursorPosition.text("#{row + 1},#{column + 1}") + @cursorPosition.text("Line #{row + 1}, Column #{column + 1}") diff --git a/static/status-bar.css b/static/status-bar.css index 9554c0455..38011d579 100644 --- a/static/status-bar.css +++ b/static/status-bar.css @@ -1,37 +1,29 @@ .status-bar { - background: black; - color: white; - padding: 5px; + background-image: -webkit-linear-gradient(#303030, #252525); + border-top: 1px solid #454545; + padding: 4px 10px 3px; + font-size: 11px; + line-height: 14px; + color: #969696; position: relative; } -.status-bar .file-info { - float: left; - display: inline-block; -} - .status-bar .cursor-position { - position: absolute; - right: 5px; - top: 5px; + padding-right: 20px; } -.status-bar .modified-status-icon { - color: #6C6912; - padding-right: 5px; +.status-bar .git-branch { + float: right; } -.status-bar .modified-status-icon:before { - content: "\f26d"; +.status-bar .branch-label { + padding-left: 5px; + vertical-align: baseline; } -.status-bar .new-status-icon { - color: #269F81; - padding-right: 5px; -} - -.status-bar .new-status-icon:before { - content: "\f26b"; +.status-bar .git-status.octicons { + display: none; + padding-left: 10px; } .status-bar .octicons { @@ -39,13 +31,31 @@ font-size: 14px; width: 14px; height: 14px; + line-height: 14px; + -webkit-font-smoothing: antialiased; + display: inline-block; + vertical-align: middle; } .status-bar .branch-icon:before { content: "\f020"; } -.status-bar .branch-label { - padding-left: 5px; - padding-right: 10px; +.status-bar .git-status.octicons.modified-status-icon { + color: #6C6912; + display: inline-block; } + +.status-bar .modified-status-icon:before { + content: "\f26d"; +} + +.status-bar .git-status.octicons.new-status-icon { + color: #269F81; + display: inline-block; +} + +.status-bar .new-status-icon:before { + content: "\f26b"; +} + From b737977c613c635b5479fe76dba4f95b6929be8e Mon Sep 17 00:00:00 2001 From: Jon Rohan Date: Wed, 26 Dec 2012 12:52:01 -0800 Subject: [PATCH 2/4] fixin spec tests --- src/packages/status-bar/spec/status-bar-spec.coffee | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/packages/status-bar/spec/status-bar-spec.coffee b/src/packages/status-bar/spec/status-bar-spec.coffee index 3f9f47d11..4cb099e25 100644 --- a/src/packages/status-bar/spec/status-bar-spec.coffee +++ b/src/packages/status-bar/spec/status-bar-spec.coffee @@ -30,7 +30,7 @@ describe "StatusBar", -> it "displays the editor's buffer path, cursor buffer position, and buffer modified indicator", -> expect(statusBar.currentPath.text()).toBe 'sample.js' expect(statusBar.bufferModified.text()).toBe '' - expect(statusBar.cursorPosition.text()).toBe '1,1' + expect(statusBar.cursorPosition.text()).toBe 'Line 1, Column 1' describe "when associated with an unsaved buffer", -> it "displays 'untitled' instead of the buffer's path, but still displays the buffer position", -> @@ -41,7 +41,7 @@ describe "StatusBar", -> StatusBar.activate(rootView) statusBar = rootView.find('.status-bar').view() expect(statusBar.currentPath.text()).toBe 'untitled' - expect(statusBar.cursorPosition.text()).toBe '1,1' + expect(statusBar.cursorPosition.text()).toBe 'Line 1, Column 1' describe "when the associated editor's path changes", -> it "updates the path in the status bar", -> @@ -105,7 +105,7 @@ describe "StatusBar", -> describe "when the associated editor's cursor position changes", -> it "updates the cursor position in the status bar", -> editor.setCursorScreenPosition([1, 2]) - expect(statusBar.cursorPosition.text()).toBe '2,3' + expect(statusBar.cursorPosition.text()).toBe 'Line 2, Column 3' describe "git branch label", -> beforeEach -> From ca39b9dccb864b45b9dc0d0a245477066a704ce7 Mon Sep 17 00:00:00 2001 From: Jon Rohan Date: Wed, 26 Dec 2012 13:06:27 -0800 Subject: [PATCH 3/4] re-organizing the cursor position text --- src/packages/status-bar/spec/status-bar-spec.coffee | 6 +++--- src/packages/status-bar/src/status-bar.coffee | 4 ++-- static/status-bar.css | 2 +- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/packages/status-bar/spec/status-bar-spec.coffee b/src/packages/status-bar/spec/status-bar-spec.coffee index 4cb099e25..3f9f47d11 100644 --- a/src/packages/status-bar/spec/status-bar-spec.coffee +++ b/src/packages/status-bar/spec/status-bar-spec.coffee @@ -30,7 +30,7 @@ describe "StatusBar", -> it "displays the editor's buffer path, cursor buffer position, and buffer modified indicator", -> expect(statusBar.currentPath.text()).toBe 'sample.js' expect(statusBar.bufferModified.text()).toBe '' - expect(statusBar.cursorPosition.text()).toBe 'Line 1, Column 1' + expect(statusBar.cursorPosition.text()).toBe '1,1' describe "when associated with an unsaved buffer", -> it "displays 'untitled' instead of the buffer's path, but still displays the buffer position", -> @@ -41,7 +41,7 @@ describe "StatusBar", -> StatusBar.activate(rootView) statusBar = rootView.find('.status-bar').view() expect(statusBar.currentPath.text()).toBe 'untitled' - expect(statusBar.cursorPosition.text()).toBe 'Line 1, Column 1' + expect(statusBar.cursorPosition.text()).toBe '1,1' describe "when the associated editor's path changes", -> it "updates the path in the status bar", -> @@ -105,7 +105,7 @@ describe "StatusBar", -> describe "when the associated editor's cursor position changes", -> it "updates the cursor position in the status bar", -> editor.setCursorScreenPosition([1, 2]) - expect(statusBar.cursorPosition.text()).toBe 'Line 2, Column 3' + expect(statusBar.cursorPosition.text()).toBe '2,3' describe "git branch label", -> beforeEach -> diff --git a/src/packages/status-bar/src/status-bar.coffee b/src/packages/status-bar/src/status-bar.coffee index ade0e798d..83a3e4833 100644 --- a/src/packages/status-bar/src/status-bar.coffee +++ b/src/packages/status-bar/src/status-bar.coffee @@ -23,10 +23,10 @@ class StatusBar extends View @span class: 'octicons branch-icon' @span class: 'branch-label', outlet: 'branchLabel' @span class: 'git-status', outlet: 'gitStatusIcon' - @span class: 'cursor-position', outlet: 'cursorPosition' @span class: 'file-info', => @span class: 'current-path', outlet: 'currentPath' @span class: 'buffer-modified', outlet: 'bufferModified' + @span class: 'cursor-position', outlet: 'cursorPosition' initialize: (@rootView, @editor) -> @@ -90,4 +90,4 @@ class StatusBar extends View updateCursorPositionText: -> { row, column } = @editor.getCursorBufferPosition() - @cursorPosition.text("Line #{row + 1}, Column #{column + 1}") + @cursorPosition.text("#{row + 1},#{column + 1}") diff --git a/static/status-bar.css b/static/status-bar.css index 38011d579..97437e161 100644 --- a/static/status-bar.css +++ b/static/status-bar.css @@ -9,7 +9,7 @@ } .status-bar .cursor-position { - padding-right: 20px; + padding-left: 10px; } .status-bar .git-branch { From 7cdf12deadfe783a972b98620c00cd4912330537 Mon Sep 17 00:00:00 2001 From: Jon Rohan Date: Wed, 26 Dec 2012 13:10:48 -0800 Subject: [PATCH 4/4] updating status bar colors --- static/status-bar.css | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/static/status-bar.css b/static/status-bar.css index 97437e161..b3e6c1069 100644 --- a/static/status-bar.css +++ b/static/status-bar.css @@ -24,6 +24,7 @@ .status-bar .git-status.octicons { display: none; padding-left: 10px; + margin-top:-2px; } .status-bar .octicons { @@ -42,7 +43,7 @@ } .status-bar .git-status.octicons.modified-status-icon { - color: #6C6912; + color: #f78a46; display: inline-block; } @@ -51,7 +52,7 @@ } .status-bar .git-status.octicons.new-status-icon { - color: #269F81; + color: #5293d8; display: inline-block; }