diff --git a/css/style.css b/css/style.css
index 265d0ee..c38aea5 100644
--- a/css/style.css
+++ b/css/style.css
@@ -361,6 +361,9 @@ table.dataTable.display tbody tr.even:hover {
     display: none;
 }
 
+.leaflet-sidebar-expand {
+    transform: rotate(45deg);
+}
 
 /*
  * CodeMirror
diff --git a/index.html b/index.html
index 687ee86..aacc613 100644
--- a/index.html
+++ b/index.html
@@ -192,7 +192,7 @@
                     </div>
 
                     <div class="leaflet-sidebar-pane" id="tab_profile">
-                        <h1 class="leaflet-sidebar-header">Custom routing profile<span class="leaflet-sidebar-close"><i class="fa fa-caret-right"></i></span></h1>
+                        <h1 class="leaflet-sidebar-header">Custom routing profile<span class="leaflet-sidebar-close"><i class="fa fa-caret-right"></i></span><span class="leaflet-sidebar-expand"><i class="fa fa-expand"></i></span></h1>
                         <form class="flexcolumn flexgrow">
                             <textarea class="form-control flexgrow" id="profile_upload" spellcheck="false" wrap="off" placeholder="Write your custom profile here."></textarea>
                             <div id="profile_message"></div>
@@ -205,12 +205,12 @@
                     </div>
 
                     <div class="leaflet-sidebar-pane" id="tab_data">
-                        <h1 class="leaflet-sidebar-header">Data<span class="leaflet-sidebar-close"><i class="fa fa-caret-right"></i></span></h1>
+                        <h1 class="leaflet-sidebar-header">Data<span class="leaflet-sidebar-close"><i class="fa fa-caret-right"></i></span><span class="leaflet-sidebar-expand"><i class="fa fa-expand"></i></span></h1>
                         <table id="datatable" class="mini cell-border hover stripe"></table>
                     </div>
 
                     <div class="leaflet-sidebar-pane" id="tab_itinerary">
-                        <h1 class="leaflet-sidebar-header">Itinerary<span class="leaflet-sidebar-close"><i class="fa fa-caret-right"></i></span></h1>
+                        <h1 class="leaflet-sidebar-header">Itinerary<span class="leaflet-sidebar-close"><i class="fa fa-caret-right"></i></span><span class="leaflet-sidebar-expand"><i class="fa fa-expand"></i></span></h1>
                         <div id="itinerary" class="flexcolumn flexgrow">
                         </div>
                     </div>
diff --git a/js/control/Profile.js b/js/control/Profile.js
index e4ff1f5..3887876 100644
--- a/js/control/Profile.js
+++ b/js/control/Profile.js
@@ -56,6 +56,10 @@ BR.Profile = L.Evented.extend({
         this.editor.refresh();
     },
 
+    onResize: function() {
+        this.editor.refresh();
+    },
+
     _upload: function(evt) {
         var button = evt.target || evt.srcElement,
             profile = this.editor.getValue();
diff --git a/js/plugin/Sidebar.js b/js/plugin/Sidebar.js
index 72bf64c..66fa954 100644
--- a/js/plugin/Sidebar.js
+++ b/js/plugin/Sidebar.js
@@ -24,6 +24,7 @@ BR.Sidebar = L.Control.Sidebar.extend({
 
         this.on('content', this._notifyOnContent, this);
         this.on('closing', this._notifyOnClose, this);
+        this.on('toggleExpand', this._notifyOnResize, this);
 
         this._rememberTabState();
 
@@ -83,6 +84,13 @@ BR.Sidebar = L.Control.Sidebar.extend({
         this.oldTab = null;
     },
     
+    _notifyOnResize: function (e) {
+        var tab = this.oldTab;
+        if (tab && tab.onResize) {
+            tab.onResize();
+        }
+    },
+
     _storeActiveTab: function (e) {
         localStorage.setItem(this.storageId, e.id || '');
     }