From 12abd19936bc8a307b08ddaccdbff3a165224ca6 Mon Sep 17 00:00:00 2001
From: Simon Vieille <simon@deblan.fr>
Date: Sat, 9 May 2020 14:00:11 +0200
Subject: [PATCH] fix #16: add dark icons and handle main menu svg filters

---
 img/side-menu-opener-dark.svg             | 173 +++++++++++++++++++++
 img/side-menu-opener-hamburger-2-dark.svg | 102 ++++++++++++
 img/side-menu-opener-hamburger-2.svg      | 105 ++++++++++++-
 img/side-menu-opener-hamburger-dark.svg   |  92 +++++++++++
 img/side-menu-opener-hamburger.svg        |  94 ++++++++++-
 img/side-menu-opener.svg                  | 181 ++++++++++++++++++++--
 src/SideMenu.vue                          |   5 +-
 7 files changed, 727 insertions(+), 25 deletions(-)
 create mode 100644 img/side-menu-opener-dark.svg
 create mode 100644 img/side-menu-opener-hamburger-2-dark.svg
 create mode 100644 img/side-menu-opener-hamburger-dark.svg

diff --git a/img/side-menu-opener-dark.svg b/img/side-menu-opener-dark.svg
new file mode 100644
index 0000000..7b56e7a
--- /dev/null
+++ b/img/side-menu-opener-dark.svg
@@ -0,0 +1,173 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="40"
+   height="40"
+   viewBox="0 0 10.583 10.583"
+   version="1.1"
+   id="svg935"
+   sodipodi:docname="side-menu-opener-dark.svg"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)">
+  <metadata
+     id="metadata941">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs939" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1918"
+     inkscape:window-height="1008"
+     id="namedview937"
+     showgrid="false"
+     inkscape:zoom="8.34386"
+     inkscape:cx="83.025045"
+     inkscape:cy="14.304895"
+     inkscape:window-x="0"
+     inkscape:window-y="41"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg935" />
+  <g
+     transform="translate(.3 -286.074)"
+     fill="#fff"
+     color="#000"
+     fill-opacity=".855"
+     id="g933"
+     style="fill:#000000;fill-opacity:0.89855075">
+    <rect
+       ry="0"
+       rx="0"
+       y="288.474"
+       x="4.266"
+       height="1.451"
+       width="1.451"
+       style="marker:none;fill:#000000;fill-opacity:0.89855075"
+       overflow="visible"
+       paint-order="stroke markers fill"
+       id="rect909" />
+    <g
+       transform="translate(-.13)"
+       id="g915"
+       style="fill:#000000;fill-opacity:0.89855075">
+      <rect
+         style="marker:none;fill:#000000;fill-opacity:0.89855075"
+         width="1.451"
+         height="1.451"
+         x="6.445"
+         y="288.474"
+         rx="0"
+         ry="0"
+         overflow="visible"
+         paint-order="stroke markers fill"
+         id="rect911" />
+      <rect
+         style="marker:none;fill:#000000;fill-opacity:0.89855075"
+         width="1.451"
+         height="1.451"
+         x="2.345"
+         y="288.474"
+         rx="0"
+         ry="0"
+         overflow="visible"
+         paint-order="stroke markers fill"
+         id="rect913" />
+    </g>
+    <rect
+       ry="0"
+       rx="0"
+       y="290.631"
+       x="4.266"
+       height="1.451"
+       width="1.451"
+       style="marker:none;fill:#000000;fill-opacity:0.89855075"
+       overflow="visible"
+       paint-order="stroke markers fill"
+       id="rect917" />
+    <g
+       transform="translate(-.13 2.157)"
+       id="g923"
+       style="fill:#000000;fill-opacity:0.89855075">
+      <rect
+         style="marker:none;fill:#000000;fill-opacity:0.89855075"
+         width="1.451"
+         height="1.451"
+         x="6.445"
+         y="288.474"
+         rx="0"
+         ry="0"
+         overflow="visible"
+         paint-order="stroke markers fill"
+         id="rect919" />
+      <rect
+         style="marker:none;fill:#000000;fill-opacity:0.89855075"
+         width="1.451"
+         height="1.451"
+         x="2.345"
+         y="288.474"
+         rx="0"
+         ry="0"
+         overflow="visible"
+         paint-order="stroke markers fill"
+         id="rect921" />
+    </g>
+    <rect
+       ry="0"
+       rx="0"
+       y="292.808"
+       x="4.266"
+       height="1.451"
+       width="1.451"
+       style="marker:none;fill:#000000;fill-opacity:0.89855075"
+       overflow="visible"
+       paint-order="stroke markers fill"
+       id="rect925" />
+    <g
+       transform="translate(-.13 4.334)"
+       id="g931"
+       style="fill:#000000;fill-opacity:0.89855075">
+      <rect
+         style="marker:none;fill:#000000;fill-opacity:0.89855075"
+         width="1.451"
+         height="1.451"
+         x="6.445"
+         y="288.474"
+         rx="0"
+         ry="0"
+         overflow="visible"
+         paint-order="stroke markers fill"
+         id="rect927" />
+      <rect
+         style="marker:none;fill:#000000;fill-opacity:0.89855075"
+         width="1.451"
+         height="1.451"
+         x="2.345"
+         y="288.474"
+         rx="0"
+         ry="0"
+         overflow="visible"
+         paint-order="stroke markers fill"
+         id="rect929" />
+    </g>
+  </g>
+</svg>
diff --git a/img/side-menu-opener-hamburger-2-dark.svg b/img/side-menu-opener-hamburger-2-dark.svg
new file mode 100644
index 0000000..505ddee
--- /dev/null
+++ b/img/side-menu-opener-hamburger-2-dark.svg
@@ -0,0 +1,102 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="40"
+   height="40"
+   viewBox="0 0 10.583 10.583"
+   version="1.1"
+   id="svg1090"
+   sodipodi:docname="side-menu-opener-hamburger-2-dark.svg"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)">
+  <metadata
+     id="metadata1096">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs1094" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1918"
+     inkscape:window-height="1008"
+     id="namedview1092"
+     showgrid="false"
+     inkscape:zoom="8.34386"
+     inkscape:cx="84.523455"
+     inkscape:cy="12.270318"
+     inkscape:window-x="0"
+     inkscape:window-y="41"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg1090" />
+  <rect
+     overflow="visible"
+     style="marker:none;fill:#000000;fill-opacity:1"
+     width="4.806"
+     height="1.256"
+     x="2.888"
+     y="2.787"
+     rx="0"
+     ry=".472"
+     color="#000"
+     fill="#fff"
+     fill-opacity=".855"
+     paint-order="stroke markers fill"
+     id="rect1082" />
+  <rect
+     overflow="visible"
+     style="marker:none;fill:#000000;fill-opacity:1"
+     width="4.806"
+     height="1.256"
+     x="2.888"
+     y="4.655"
+     rx="0"
+     ry=".472"
+     color="#000"
+     fill="#fff"
+     fill-opacity=".855"
+     paint-order="stroke markers fill"
+     id="rect1084" />
+  <rect
+     overflow="visible"
+     style="marker:none;fill:#000000;fill-opacity:1"
+     width="4.806"
+     height="1.256"
+     x="2.888"
+     y="6.54"
+     rx="0"
+     ry=".472"
+     color="#000"
+     fill="#fff"
+     fill-opacity=".855"
+     paint-order="stroke markers fill"
+     id="rect1086" />
+  <path
+     style="marker:none;fill:#000000;fill-opacity:1"
+     d="M1.243.71A.469.469 0 0 0 .881.88a.469.469 0 0 0-.171.362V9.34c0 .146.067.275.171.362a.469.469 0 0 0 .362.171H9.34a.469.469 0 0 0 .362-.171.469.469 0 0 0 .171-.362V1.243a.469.469 0 0 0-.171-.362A.469.469 0 0 0 9.34.71zm.723 1.256h6.65v6.65h-6.65z"
+     color="#000"
+     overflow="visible"
+     fill="#fff"
+     fill-opacity=".855"
+     paint-order="stroke markers fill"
+     id="path1088" />
+</svg>
diff --git a/img/side-menu-opener-hamburger-2.svg b/img/side-menu-opener-hamburger-2.svg
index b67c303..b5eb64c 100644
--- a/img/side-menu-opener-hamburger-2.svg
+++ b/img/side-menu-opener-hamburger-2.svg
@@ -1,6 +1,101 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 10.583 10.583">
-  <rect overflow="visible" style="marker:none" width="4.806" height="1.256" x="2.888" y="2.787" rx="0" ry=".472" color="#000" fill="#fff" fill-opacity=".855" paint-order="stroke markers fill"/>
-  <rect overflow="visible" style="marker:none" width="4.806" height="1.256" x="2.888" y="4.655" rx="0" ry=".472" color="#000" fill="#fff" fill-opacity=".855" paint-order="stroke markers fill"/>
-  <rect overflow="visible" style="marker:none" width="4.806" height="1.256" x="2.888" y="6.54" rx="0" ry=".472" color="#000" fill="#fff" fill-opacity=".855" paint-order="stroke markers fill"/>
-  <path style="marker:none" d="M1.243.71A.469.469 0 0 0 .881.88a.469.469 0 0 0-.171.362V9.34c0 .146.067.275.171.362a.469.469 0 0 0 .362.171H9.34a.469.469 0 0 0 .362-.171.469.469 0 0 0 .171-.362V1.243a.469.469 0 0 0-.171-.362A.469.469 0 0 0 9.34.71zm.723 1.256h6.65v6.65h-6.65z" color="#000" overflow="visible" fill="#fff" fill-opacity=".855" paint-order="stroke markers fill"/>
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="40"
+   height="40"
+   viewBox="0 0 10.583 10.583"
+   version="1.1"
+   id="svg1443"
+   sodipodi:docname="side-menu-opener-hamburger-2.svg"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)">
+  <metadata
+     id="metadata1449">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs1447" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1918"
+     inkscape:window-height="1008"
+     id="namedview1445"
+     showgrid="false"
+     inkscape:zoom="5.9"
+     inkscape:cx="90.508475"
+     inkscape:cy="4.5762712"
+     inkscape:window-x="0"
+     inkscape:window-y="41"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg1443" />
+  <rect
+     overflow="visible"
+     style="marker:none;fill:#ffffff;fill-opacity:1"
+     width="4.806"
+     height="1.256"
+     x="2.888"
+     y="2.787"
+     rx="0"
+     ry=".472"
+     color="#000"
+     fill="#fff"
+     fill-opacity=".855"
+     paint-order="stroke markers fill"
+     id="rect1435" />
+  <rect
+     overflow="visible"
+     style="marker:none;fill:#ffffff;fill-opacity:1"
+     width="4.806"
+     height="1.256"
+     x="2.888"
+     y="4.655"
+     rx="0"
+     ry=".472"
+     color="#000"
+     fill="#fff"
+     fill-opacity=".855"
+     paint-order="stroke markers fill"
+     id="rect1437" />
+  <rect
+     overflow="visible"
+     style="marker:none;fill:#ffffff;fill-opacity:1"
+     width="4.806"
+     height="1.256"
+     x="2.888"
+     y="6.54"
+     rx="0"
+     ry=".472"
+     color="#000"
+     fill="#fff"
+     fill-opacity=".855"
+     paint-order="stroke markers fill"
+     id="rect1439" />
+  <path
+     style="marker:none;fill:#ffffff;fill-opacity:1"
+     d="M1.243.71A.469.469 0 0 0 .881.88a.469.469 0 0 0-.171.362V9.34c0 .146.067.275.171.362a.469.469 0 0 0 .362.171H9.34a.469.469 0 0 0 .362-.171.469.469 0 0 0 .171-.362V1.243a.469.469 0 0 0-.171-.362A.469.469 0 0 0 9.34.71zm.723 1.256h6.65v6.65h-6.65z"
+     color="#000"
+     overflow="visible"
+     fill="#fff"
+     fill-opacity=".855"
+     paint-order="stroke markers fill"
+     id="path1441" />
 </svg>
diff --git a/img/side-menu-opener-hamburger-dark.svg b/img/side-menu-opener-hamburger-dark.svg
new file mode 100644
index 0000000..5d60f54
--- /dev/null
+++ b/img/side-menu-opener-hamburger-dark.svg
@@ -0,0 +1,92 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="40"
+   height="40"
+   viewBox="0 0 10.583 10.583"
+   version="1.1"
+   id="svg1168"
+   sodipodi:docname="side-menu-opener-hamburger-dark.svg"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)">
+  <metadata
+     id="metadata1174">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs1172" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1918"
+     inkscape:window-height="1008"
+     id="namedview1170"
+     showgrid="false"
+     inkscape:zoom="5.9"
+     inkscape:cx="112.71186"
+     inkscape:cy="0.16949153"
+     inkscape:window-x="0"
+     inkscape:window-y="41"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg1168" />
+  <g
+     color="#000"
+     fill="#fff"
+     fill-opacity=".855"
+     transform="translate(0 -286.417)"
+     id="g1166"
+     style="fill:#000000;fill-opacity:0.99637681">
+    <rect
+       ry=".545"
+       rx="0"
+       y="288.816"
+       x="2.516"
+       height="1.451"
+       width="5.551"
+       style="marker:none;fill:#000000;fill-opacity:0.99637681"
+       overflow="visible"
+       paint-order="stroke markers fill"
+       id="rect1160" />
+    <rect
+       ry=".545"
+       rx="0"
+       y="290.973"
+       x="2.516"
+       height="1.451"
+       width="5.551"
+       style="marker:none;fill:#000000;fill-opacity:0.99637681"
+       overflow="visible"
+       paint-order="stroke markers fill"
+       id="rect1162" />
+    <rect
+       ry=".545"
+       rx="0"
+       y="293.15"
+       x="2.516"
+       height="1.451"
+       width="5.551"
+       style="marker:none;fill:#000000;fill-opacity:0.99637681"
+       overflow="visible"
+       paint-order="stroke markers fill"
+       id="rect1164" />
+  </g>
+</svg>
diff --git a/img/side-menu-opener-hamburger.svg b/img/side-menu-opener-hamburger.svg
index 9477581..c1b1325 100644
--- a/img/side-menu-opener-hamburger.svg
+++ b/img/side-menu-opener-hamburger.svg
@@ -1,7 +1,91 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 10.583 10.583">
-  <g color="#000" fill="#fff" fill-opacity=".855" transform="translate(0 -286.417)">
-    <rect ry=".545" rx="0" y="288.816" x="2.516" height="1.451" width="5.551" style="marker:none" overflow="visible" paint-order="stroke markers fill"/>
-    <rect ry=".545" rx="0" y="290.973" x="2.516" height="1.451" width="5.551" style="marker:none" overflow="visible" paint-order="stroke markers fill"/>
-    <rect ry=".545" rx="0" y="293.15" x="2.516" height="1.451" width="5.551" style="marker:none" overflow="visible" paint-order="stroke markers fill"/>
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="40"
+   height="40"
+   viewBox="0 0 10.583 10.583"
+   version="1.1"
+   id="svg1382"
+   sodipodi:docname="side-menu-opener-hamburger.svg"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)">
+  <metadata
+     id="metadata1388">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs1386" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1918"
+     inkscape:window-height="1008"
+     id="namedview1384"
+     showgrid="false"
+     inkscape:zoom="5.9"
+     inkscape:cx="108.13559"
+     inkscape:cy="3.8983051"
+     inkscape:window-x="0"
+     inkscape:window-y="41"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg1382" />
+  <g
+     color="#000"
+     fill="#fff"
+     fill-opacity=".855"
+     transform="translate(0 -286.417)"
+     id="g1380"
+     style="fill:#ffffff;fill-opacity:1">
+    <rect
+       ry=".545"
+       rx="0"
+       y="288.816"
+       x="2.516"
+       height="1.451"
+       width="5.551"
+       style="marker:none;fill:#ffffff;fill-opacity:1"
+       overflow="visible"
+       paint-order="stroke markers fill"
+       id="rect1374" />
+    <rect
+       ry=".545"
+       rx="0"
+       y="290.973"
+       x="2.516"
+       height="1.451"
+       width="5.551"
+       style="marker:none;fill:#ffffff;fill-opacity:1"
+       overflow="visible"
+       paint-order="stroke markers fill"
+       id="rect1376" />
+    <rect
+       ry=".545"
+       rx="0"
+       y="293.15"
+       x="2.516"
+       height="1.451"
+       width="5.551"
+       style="marker:none;fill:#ffffff;fill-opacity:1"
+       overflow="visible"
+       paint-order="stroke markers fill"
+       id="rect1378" />
   </g>
 </svg>
diff --git a/img/side-menu-opener.svg b/img/side-menu-opener.svg
index 3169ea1..32abf78 100644
--- a/img/side-menu-opener.svg
+++ b/img/side-menu-opener.svg
@@ -1,19 +1,172 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 10.583 10.583">
-  <g transform="translate(.3 -286.074)" fill="#fff" color="#000" fill-opacity=".855">
-    <rect ry="0" rx="0" y="288.474" x="4.266" height="1.451" width="1.451" style="marker:none" overflow="visible" paint-order="stroke markers fill"/>
-    <g transform="translate(-.13)">
-      <rect style="marker:none" width="1.451" height="1.451" x="6.445" y="288.474" rx="0" ry="0" overflow="visible" paint-order="stroke markers fill"/>
-      <rect style="marker:none" width="1.451" height="1.451" x="2.345" y="288.474" rx="0" ry="0" overflow="visible" paint-order="stroke markers fill"/>
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="40"
+   height="40"
+   viewBox="0 0 10.583 10.583"
+   version="1.1"
+   id="svg1321"
+   sodipodi:docname="side-menu-opener.svg"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)">
+  <metadata
+     id="metadata1327">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs1325" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1918"
+     inkscape:window-height="1008"
+     id="namedview1323"
+     showgrid="false"
+     inkscape:zoom="5.9"
+     inkscape:cx="78.983051"
+     inkscape:cy="5.5932203"
+     inkscape:window-x="0"
+     inkscape:window-y="41"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg1321" />
+  <g
+     transform="translate(.3 -286.074)"
+     fill="#fff"
+     color="#000"
+     fill-opacity=".855"
+     id="g1319"
+     style="fill:#ffffff;fill-opacity:0.94565219">
+    <rect
+       ry="0"
+       rx="0"
+       y="288.474"
+       x="4.266"
+       height="1.451"
+       width="1.451"
+       style="marker:none;fill:#ffffff;fill-opacity:0.94565219"
+       overflow="visible"
+       paint-order="stroke markers fill"
+       id="rect1295" />
+    <g
+       transform="translate(-.13)"
+       id="g1301"
+       style="fill:#ffffff;fill-opacity:0.94565219">
+      <rect
+         style="marker:none;fill:#ffffff;fill-opacity:0.94565219"
+         width="1.451"
+         height="1.451"
+         x="6.445"
+         y="288.474"
+         rx="0"
+         ry="0"
+         overflow="visible"
+         paint-order="stroke markers fill"
+         id="rect1297" />
+      <rect
+         style="marker:none;fill:#ffffff;fill-opacity:0.94565219"
+         width="1.451"
+         height="1.451"
+         x="2.345"
+         y="288.474"
+         rx="0"
+         ry="0"
+         overflow="visible"
+         paint-order="stroke markers fill"
+         id="rect1299" />
     </g>
-    <rect ry="0" rx="0" y="290.631" x="4.266" height="1.451" width="1.451" style="marker:none" overflow="visible" paint-order="stroke markers fill"/>
-    <g transform="translate(-.13 2.157)">
-      <rect style="marker:none" width="1.451" height="1.451" x="6.445" y="288.474" rx="0" ry="0" overflow="visible" paint-order="stroke markers fill"/>
-      <rect style="marker:none" width="1.451" height="1.451" x="2.345" y="288.474" rx="0" ry="0" overflow="visible" paint-order="stroke markers fill"/>
+    <rect
+       ry="0"
+       rx="0"
+       y="290.631"
+       x="4.266"
+       height="1.451"
+       width="1.451"
+       style="marker:none;fill:#ffffff;fill-opacity:0.94565219"
+       overflow="visible"
+       paint-order="stroke markers fill"
+       id="rect1303" />
+    <g
+       transform="translate(-.13 2.157)"
+       id="g1309"
+       style="fill:#ffffff;fill-opacity:0.94565219">
+      <rect
+         style="marker:none;fill:#ffffff;fill-opacity:0.94565219"
+         width="1.451"
+         height="1.451"
+         x="6.445"
+         y="288.474"
+         rx="0"
+         ry="0"
+         overflow="visible"
+         paint-order="stroke markers fill"
+         id="rect1305" />
+      <rect
+         style="marker:none;fill:#ffffff;fill-opacity:0.94565219"
+         width="1.451"
+         height="1.451"
+         x="2.345"
+         y="288.474"
+         rx="0"
+         ry="0"
+         overflow="visible"
+         paint-order="stroke markers fill"
+         id="rect1307" />
     </g>
-    <rect ry="0" rx="0" y="292.808" x="4.266" height="1.451" width="1.451" style="marker:none" overflow="visible" paint-order="stroke markers fill"/>
-    <g transform="translate(-.13 4.334)">
-      <rect style="marker:none" width="1.451" height="1.451" x="6.445" y="288.474" rx="0" ry="0" overflow="visible" paint-order="stroke markers fill"/>
-      <rect style="marker:none" width="1.451" height="1.451" x="2.345" y="288.474" rx="0" ry="0" overflow="visible" paint-order="stroke markers fill"/>
+    <rect
+       ry="0"
+       rx="0"
+       y="292.808"
+       x="4.266"
+       height="1.451"
+       width="1.451"
+       style="marker:none;fill:#ffffff;fill-opacity:0.94565219"
+       overflow="visible"
+       paint-order="stroke markers fill"
+       id="rect1311" />
+    <g
+       transform="translate(-.13 4.334)"
+       id="g1317"
+       style="fill:#ffffff;fill-opacity:0.94565219">
+      <rect
+         style="marker:none;fill:#ffffff;fill-opacity:0.94565219"
+         width="1.451"
+         height="1.451"
+         x="6.445"
+         y="288.474"
+         rx="0"
+         ry="0"
+         overflow="visible"
+         paint-order="stroke markers fill"
+         id="rect1313" />
+      <rect
+         style="marker:none;fill:#ffffff;fill-opacity:0.94565219"
+         width="1.451"
+         height="1.451"
+         x="2.345"
+         y="288.474"
+         rx="0"
+         ry="0"
+         overflow="visible"
+         paint-order="stroke markers fill"
+         id="rect1315" />
     </g>
   </g>
 </svg>
diff --git a/src/SideMenu.vue b/src/SideMenu.vue
index 7593222..280d334 100644
--- a/src/SideMenu.vue
+++ b/src/SideMenu.vue
@@ -55,7 +55,10 @@ export default {
                 if (href !== '#') {
                     let svg = element.querySelector('svg').outerHTML
 
-                    svg = svg.replace(/(height|width)="20"/, '')
+                    svg = svg
+						.replace(/(height|width)="20"/, '')
+						.replace('id="invertMenuMain', 'id="invertSideMenu')
+						.replace('url(#invertMenuMain', 'url(#invertSideMenu')
 
                     this.apps.push({
                         href: href,