diff --git a/src/app/app.less b/src/app/app.less
index c2049e49..58e8eb6c 100644
--- a/src/app/app.less
+++ b/src/app/app.less
@@ -126,7 +126,7 @@ svg.icon {
 
 #title-bar {
     -webkit-app-region: drag;
-    height: 30px;
+    height: 10px;
     width: 100%;
     position: absolute;
     top: 0;
diff --git a/src/app/sidebar/MainSideBar.tsx b/src/app/sidebar/MainSideBar.tsx
index 2f665073..ca624ef0 100644
--- a/src/app/sidebar/MainSideBar.tsx
+++ b/src/app/sidebar/MainSideBar.tsx
@@ -197,6 +197,7 @@ class MainSideBar extends React.Component<{}, {}> {
         let mainView = GlobalModel.activeMainView.get();
         return (
             <div className={cn("main-sidebar", { collapsed: isCollapsed }, { "is-dev": GlobalModel.isDev })}>
+                <div className="title-bar-drag"/>
                 <div className="arrow-container hoverEffect" onClick={this.toggleCollapsed}>
                     <LeftChevronIcon className="icon" />
                 </div>
@@ -206,7 +207,7 @@ class MainSideBar extends React.Component<{}, {}> {
                             <AppsIcon className="icon" />
                             Apps
                             <span className="hotkey">&#x2318;A</span>
-                        </div>*/}
+                            </div>*/}
                         <div className="item hoverEffect" onClick={this.handleHistoryClick}>
                             <HistoryIcon className="icon" />
                             History
diff --git a/src/app/sidebar/sidebar.less b/src/app/sidebar/sidebar.less
index 87db7721..1570d546 100644
--- a/src/app/sidebar/sidebar.less
+++ b/src/app/sidebar/sidebar.less
@@ -8,6 +8,15 @@
     flex-direction: column;
     position: relative;
 
+    .title-bar-drag {
+        -webkit-app-region: drag;
+        height: 20px;
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+    }
+
     &.collapsed {
         width: 6em;
         min-width: 6em;