Use dropdown-arrow for all toggle arrows

res/css/structures/_RoomSubList.scss

@@ -99,13 +99,13 @@ limitations under the License.
 
 .mx_RoomSubList_chevron {
     pointer-events: none;
-    background-image: url('$(res)/img/topleft-chevron.svg');
-    background-repeat: no-repeat;
+    mask: url('$(res)/img/feather-icons/dropdown-arrow.svg');
+    mask-repeat: no-repeat;
     transition: transform 0.2s ease-in;
     width: 10px;
-    height: 10px;
-    background-position: center;
+    height: 6px;
     margin-left: 2px;
+    background-color: $roomsublist-label-fg-color;
 }
 
 .mx_RoomSubList_chevronDown {

res/css/structures/_TopLeftMenuButton.scss

@@ -41,4 +41,9 @@ limitations under the License.
 
 .mx_TopLeftMenuButton_chevron {
     margin: 0 7px;
+    mask: url('$(res)/img/feather-icons/dropdown-arrow.svg');
+    mask-repeat: no-repeat;
+    width: 10px;
+    height: 6px;
+    background-color: $roomsublist-label-fg-color;
 }

res/img/topleft-chevron.svg

@@ -1,86 +0,0 @@
-<?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="9.946106"
-   height="5.5662179"
-   viewBox="0 0 9.946106 5.5662179"
-   version="1.1"
-   id="svg14"
-   sodipodi:docname="topleft-chevron.svg"
-   inkscape:version="0.92.3 (2405546, 2018-03-11)">
-  <metadata
-     id="metadata18">
-    <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>dropdown</dc:title>
-      </cc:Work>
-    </rdf:RDF>
-  </metadata>
-  <sodipodi:namedview
-     pagecolor="#ffffff"
-     bordercolor="#666666"
-     borderopacity="1"
-     objecttolerance="10"
-     gridtolerance="10"
-     guidetolerance="10"
-     inkscape:pageopacity="0"
-     inkscape:pageshadow="2"
-     inkscape:window-width="1277"
-     inkscape:window-height="653"
-     id="namedview16"
-     showgrid="false"
-     fit-margin-top="0.5"
-     fit-margin-left="0.5"
-     fit-margin-right="0.5"
-     fit-margin-bottom="0.5"
-     inkscape:zoom="35.2"
-     inkscape:cx="4.6570922"
-     inkscape:cy="2.9102278"
-     inkscape:window-x="459"
-     inkscape:window-y="90"
-     inkscape:window-maximized="0"
-     inkscape:current-layer="svg14" />
-  <!-- Generator: Sketch 50.2 (55047) - http://www.bohemiancoding.com/sketch -->
-  <title
-     id="title2">dropdown</title>
-  <desc
-     id="desc4">Created with Sketch.</desc>
-  <defs
-     id="defs6" />
-  <g
-     id="Page-1"
-     style="fill:none;fill-rule:evenodd;stroke:none;stroke-width:1;stroke-linecap:round"
-     transform="translate(-0.3429078,-0.34400861)">
-    <g
-       id="matrix-my-stuff-no-lines-message-context-menu-smaller-icons"
-       transform="translate(-203,-25)"
-       style="stroke:#61708b;stroke-width:1.6">
-      <g
-         id="Group-3"
-         transform="translate(128,15)">
-        <g
-           id="dropdown"
-           transform="translate(76,11)">
-          <path
-             d="M 0.5,0.5 4.3586853,3.7542227"
-             id="Line-5"
-             inkscape:connector-curvature="0" />
-          <path
-             d="M 8.1319327,0.56042139 4.3586853,3.7542227"
-             id="Line-5-Copy"
-             inkscape:connector-curvature="0" />
-        </g>
-      </g>
-    </g>
-  </g>
-</svg>

src/components/structures/TopLeftMenuButton.js

@@ -97,7 +97,7 @@ export default class TopLeftMenuButton extends React.Component {
                     resizeMethod="crop"
                 />
                 { nameElement }
-                <img className="mx_TopLeftMenuButton_chevron" src={require("../../../res/img/topleft-chevron.svg")} width="11" height="6" />
+                <span className="mx_TopLeftMenuButton_chevron"></span>
             </AccessibleButton>
         );
     }