From 607659317f64fc64446911b254f4045a5cd6143a Mon Sep 17 00:00:00 2001
From: Norbert Renner <norbert.renner@gmx.de>
Date: Tue, 24 Jul 2018 17:14:49 +0200
Subject: [PATCH] Replace Leaflet layers icon with a simple b/w that fits in
 better (#114)

---
 css/style.css |  7 +++++++
 index.html    | 13 ++++++++++++-
 2 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/css/style.css b/css/style.css
index 94172e4..9538acf 100644
--- a/css/style.css
+++ b/css/style.css
@@ -368,6 +368,13 @@ table.dataTable.display tbody tr.even:hover {
     display: none;
 }
 
+/* layers svg icon not properly centered */
+.leaflet-sidebar-tabs > ul > li > a[href="#tab_layers_control"] {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
 /*
  * CodeMirror
  */
diff --git a/index.html b/index.html
index 6339694..f270afc 100644
--- a/index.html
+++ b/index.html
@@ -185,7 +185,18 @@
     <div id="content" class="flexcolumn flexgrow">
         <div id="sidebarTabs" class="leaflet-sidebar-tabs collapsed">
             <ul role="tablist">
-                <li><a href="#tab_layers_control" role="tab" title="Layers"><img src="dist/images/layers.png" width="20px"></a></li>
+                <li><a href="#tab_layers_control" role="tab" title="Layers">
+                        <!--
+                        https://github.com/feathericons/feather/blob/0dc2bf5c9d01759e47485d9498aefc02cac1d845/icons/layers.svg
+                        MIT License: https://github.com/feathericons/feather/blob/master/LICENSE
+                        modifications: line gap -0.5, stroke-width +0.2
+                        -->
+                        <svg class="fa" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round">
+                            <polygon style="fill: currentColor" points="12 2 2 7 12 12 22 7 12 2"></polygon>
+                            <polyline points="2 11.5 12 16.5 22 11.5"></polyline>
+                            <polyline points="2 16 12 21 22 16"></polyline>
+                        </svg>
+                    </a></li>
                 <li hidden><a href="#tab_itinerary" role="tab" title="Itinerary"><i class="fa fa-map-signs"></i></a></li>
                 <li><a href="#tab_profile" role="tab" title="Custom profile"><i class="fa fa-wrench"></i></a></li>
                 <li><a href="#tab_data" role="tab" title="Data"><i class="fa fa-table"></i></a></li>