Fix sidebar header wrapping (#114)

- heading last, so heading wraps instead of expand icon
- shorter profile heading to prevent wrapping

index.html

@@ -201,7 +201,7 @@ <h4 class="modal-title">About</h4>
 
                 <div class="leaflet-sidebar-content">
                     <div class="leaflet-sidebar-pane" id="tab_layers_control">
-                        <h1 class="leaflet-sidebar-header">Layers<span class="leaflet-sidebar-close"><i class="fa fa-caret-right"></i></span></h1>
+                        <h1 class="leaflet-sidebar-header"><span class="leaflet-sidebar-close"><i class="fa fa-caret-right"></i></span>Layers</h1>
                         <div id="layers-control-wrapper"></div>
                         <div class="leaflet-control-layers-separator"></div>
                         <div>
@@ -210,7 +210,7 @@ <h1 class="leaflet-sidebar-header">Layers<span class="leaflet-sidebar-close"><i
                     </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><span class="leaflet-sidebar-expand"><i class="fa fa-expand"></i></span></h1>
+                        <h1 class="leaflet-sidebar-header"><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>Custom profile</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>
@@ -223,7 +223,7 @@ <h1 class="leaflet-sidebar-header">Custom routing profile<span class="leaflet-si
                     </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><span class="leaflet-sidebar-expand"><i class="fa fa-expand"></i></span></h1>
+                        <h1 class="leaflet-sidebar-header"><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>Data</h1>
                         <table id="datatable" class="mini cell-border hover stripe"></table>
                     </div>