diff --git a/src/main.tsx b/src/main.tsx
index 4e38f986..7a66cdd5 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -702,7 +702,7 @@ class InfoMsg extends React.Component<{}, {}> {
     }
 
     renderConnectButton(remote : RemoteType) : any {
-        if (remote.status == "connected") {
+        if (remote.status == "connected" || remote.status == "connecting") {
             return <div onClick={() => this.disconnectRemote(remote.remoteid)} className="text-button disconnect-button">[disconnect remote]</div>
         }
         else {
@@ -1430,7 +1430,7 @@ class MainSideBar extends React.Component<{}, {}> {
                     <ul className="menu-list remotes-menu-list">
                         <For each="remote" of={remotes}>
                             <li key={remote.remoteid} className="remote-menu-item"><a onClick={() => this.clickRemote(remote)}>
-                                <i className={cn("remote-status fa fa-circle", "status-" + remote.status)}/>
+                                <i className={cn("remote-status fa", "status-" + remote.status, (remote.status == "connecting" ? "fa-refresh" : "fa-circle"))}/>
                                 {this.remoteDisplayName(remote)}
                             </a></li>
                         </For>
diff --git a/src/sh2.less b/src/sh2.less
index e6fa2d61..8b641490 100644
--- a/src/sh2.less
+++ b/src/sh2.less
@@ -1101,6 +1101,14 @@ body .xterm .xterm-viewport {
     &.status-init, &.status-disconnected {
         color: #c4a000;
     }
+
+    &.status-connecting {
+        color: #c4a000;
+        font-size: 12px;
+        position: relative;
+        top: 0px;
+        margin-left: -3px;
+    }
     
     &.status-connected {
         color: #4e9a06;