     document.documentElement.addEventListener 'mouseup', stopDrag, false
 
   render: =>
-    <div className="sidebar-inner" ref="sidebar">
+    sidebarStyles =
+      width: "#{@cachedSidebarWidth}px" if @cachedSidebarWidth
+
+    bottomStyles =
+      width: "#{@cachedSidebarWidth - 1}px" if @cachedSidebarWidth
+
+    <div className="sidebar-inner" style={sidebarStyles} ref="sidebar">
       <a className="quick-connect-link" onClick={@onQuickConnect}><span className="octicon octicon-zap"></span> Quick connect</a>
 
       <span className="divider"></span>

        </li>
      </ul>

      <div className="bottom-links" ref="bottom">
        <span className="octicon octicon-gear" onClick={Application.shell.bind(null, 'openExternal', process.env.ZENIT_HOME)}></span>
        <span className="octicon octicon-file-directory"></span>
        <span className="octicon octicon-plus"></span>


    startDrag = (e) ->
      adj = e.clientX - clientX
      result = initWidth + adj

      sidebar.style.width = "#{result}px"
      bottom.style.width = "#{result - 1}px"

      # Save sidebar width
      localStorage.setItem('zenit:sidebar-width', result)
      
    stopDrag = (e) ->
      document.documentElement.removeEventListener 'mousemove', startDrag, false
