From 3c306bc54bb81aea6fa18d3f7204c083a053a0ea Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=A0imon=20Brandner?= <simon.bra.ag@gmail.com>
Date: Sat, 19 Dec 2020 12:54:55 +0100
Subject: [PATCH] Added icons
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
---
 res/img/download-white.svg                  | 95 +++++++++++++++++++++
 res/img/feather-customised/trash.custom.svg | 87 +++++++++++++++++--
 res/img/minus-white.svg                     | 64 ++++++++++++++
 res/img/plus-white.svg                      | 73 ++++++++++++++++
 res/img/trash-red.svg                       | 89 +++++++++++++++++++
 src/components/views/elements/ImageView.js  |  8 +-
 6 files changed, 406 insertions(+), 10 deletions(-)
 create mode 100644 res/img/download-white.svg
 create mode 100644 res/img/minus-white.svg
 create mode 100644 res/img/plus-white.svg
 create mode 100644 res/img/trash-red.svg

diff --git a/res/img/download-white.svg b/res/img/download-white.svg
new file mode 100644
index 0000000000..5c800b350e
--- /dev/null
+++ b/res/img/download-white.svg
@@ -0,0 +1,95 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"
+   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="18"
+   height="18"
+   viewBox="-1 -1 18 18"
+   version="1.1"
+   id="svg14"
+   sodipodi:docname="download-white.svg"
+   inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
+  <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>Fill 75</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="1914"
+     inkscape:window-height="1048"
+     id="namedview16"
+     showgrid="false"
+     inkscape:zoom="32.283595"
+     inkscape:cx="4.829485"
+     inkscape:cy="6.7819403"
+     inkscape:window-x="1920"
+     inkscape:window-y="146"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg14" />
+  <!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
+  <title
+     id="title2">Fill 75</title>
+  <desc
+     id="desc4">Created with Sketch.</desc>
+  <defs
+     id="defs6" />
+  <g
+     id="02-Chat"
+     stroke="none"
+     stroke-width="1"
+     fill="none"
+     fill-rule="evenodd"
+     sketch:type="MSPage"
+     transform="matrix(1.2103961,0,0,1.3332813,1.9999996,1.566422e-4)"
+     style="stroke:none;stroke-opacity:1;stroke-width:0.99972159;stroke-miterlimit:4;stroke-dasharray:none;fill:#ffffff;fill-opacity:1">
+    <g
+       id="02_x-Chat-MAX"
+       sketch:type="MSArtboardGroup"
+       transform="translate(-280,-546)"
+       fill="#76cfa6"
+       style="stroke:none;stroke-opacity:1;stroke-width:0.99972159;stroke-miterlimit:4;stroke-dasharray:none;fill:#ffffff;fill-opacity:1">
+      <g
+         id="Group"
+         sketch:type="MSLayerGroup"
+         transform="translate(243,58)"
+         style="stroke:none;stroke-opacity:1;stroke-width:0.99972159;stroke-miterlimit:4;stroke-dasharray:none;fill:#ffffff;fill-opacity:1">
+        <g
+           id="Group-Copy-13-+-Matrix-HQ-Copy-17-+-Bitmap"
+           transform="translate(1,181)"
+           sketch:type="MSShapeGroup"
+           style="stroke:none;stroke-opacity:1;stroke-width:0.99972159;stroke-miterlimit:4;stroke-dasharray:none;fill:#ffffff;fill-opacity:1">
+          <g
+             id="Group-Copy-13"
+             style="stroke:none;stroke-opacity:1;stroke-width:0.99972159;stroke-miterlimit:4;stroke-dasharray:none;fill:#ffffff;fill-opacity:1">
+            <path
+               d="m 45.340043,312.52677 c 0.146962,0 0.293924,-0.0559 0.406442,-0.16839 0.223505,-0.22427 0.223505,-0.58708 0,-0.81135 l -4.380545,-4.37902 c -0.223506,-0.22427 -0.587084,-0.2235 -0.811354,-7.6e-4 l -4.385904,4.37289 c -0.22427,0.22427 -0.225036,0.58785 -0.0015,0.81212 0.223504,0.22503 0.587083,0.22503 0.811353,0.002 l 3.413045,-3.4031 0.0015,9.47524 c 0,0.31689 0.25795,0.57407 0.574071,0.57407 0.317653,0 0.574072,-0.25718 0.574072,-0.57407 l -0.0015,-9.46069 3.394674,3.39314 c 0.111752,0.11252 0.258714,0.16839 0.405677,0.16839 z"
+               id="Fill-75"
+               transform="rotate(180,40.957057,313)"
+               style="stroke:none;stroke-opacity:1;stroke-width:0.99972159;stroke-miterlimit:4;stroke-dasharray:none;fill:#ffffff;fill-opacity:1" />
+          </g>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/res/img/feather-customised/trash.custom.svg b/res/img/feather-customised/trash.custom.svg
index dc1985ddb2..589bb0a4e5 100644
--- a/res/img/feather-customised/trash.custom.svg
+++ b/res/img/feather-customised/trash.custom.svg
@@ -1,7 +1,82 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M2.25 5.5H5.16667H21.75" stroke="#2E2F32" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M16.5 5.5L15 1H9L7.5 5.5" stroke="#2E2F32" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M5.25 9.25V20.75C5.25 21.8546 6.14543 22.75 7.25 22.75H16.75C17.8546 22.75 18.75 21.8546 18.75 20.75V9.25" stroke="#2E2F32" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M9.75 9.25V18.25" stroke="#2E2F32" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M14.25 9.25V18.25" stroke="#2E2F32" stroke-linecap="round" stroke-linejoin="round"/>
+<?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="24"
+   height="24"
+   viewBox="0 0 24 24"
+   fill="none"
+   version="1.1"
+   id="svg12"
+   sodipodi:docname="trash.custom.svg"
+   inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
+  <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></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs16" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="934"
+     inkscape:window-height="1016"
+     id="namedview14"
+     showgrid="false"
+     inkscape:zoom="11.249472"
+     inkscape:cx="11.649601"
+     inkscape:cy="23.142771"
+     inkscape:window-x="2884"
+     inkscape:window-y="162"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg12" />
+  <path
+     d="M2.25 5.5H5.16667H21.75"
+     stroke="#2E2F32"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path2" />
+  <path
+     d="M16.5 5.5L15 1H9L7.5 5.5"
+     stroke="#2E2F32"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path4" />
+  <path
+     d="M5.25 9.25V20.75C5.25 21.8546 6.14543 22.75 7.25 22.75H16.75C17.8546 22.75 18.75 21.8546 18.75 20.75V9.25"
+     stroke="#2E2F32"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path6" />
+  <path
+     d="M9.75 9.25V18.25"
+     stroke="#2E2F32"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path8" />
+  <path
+     d="M14.25 9.25V18.25"
+     stroke="#2E2F32"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path10" />
 </svg>
diff --git a/res/img/minus-white.svg b/res/img/minus-white.svg
new file mode 100644
index 0000000000..2921f34980
--- /dev/null
+++ b/res/img/minus-white.svg
@@ -0,0 +1,64 @@
+<?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="18"
+   height="18"
+   viewBox="-1 -1 18 18"
+   version="1.1"
+   id="svg14"
+   sodipodi:docname="minus-white.svg"
+   inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
+  <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>Fill 75</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="1914"
+     inkscape:window-height="1048"
+     id="namedview16"
+     showgrid="false"
+     inkscape:zoom="32.283595"
+     inkscape:cx="4.829485"
+     inkscape:cy="6.7819403"
+     inkscape:window-x="1920"
+     inkscape:window-y="146"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg14" />
+  <!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
+  <title
+     id="title2">Fill 75</title>
+  <desc
+     id="desc4">Created with Sketch.</desc>
+  <defs
+     id="defs6" />
+  <rect
+     style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1.22474;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+     id="rect1545"
+     width="16"
+     height="1.5"
+     x="0"
+     y="7.25"
+     ry="0.75" />
+</svg>
diff --git a/res/img/plus-white.svg b/res/img/plus-white.svg
new file mode 100644
index 0000000000..7759ace50a
--- /dev/null
+++ b/res/img/plus-white.svg
@@ -0,0 +1,73 @@
+<?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="18"
+   height="18"
+   viewBox="-1 -1 18 18"
+   version="1.1"
+   id="svg14"
+   sodipodi:docname="plus-white.svg"
+   inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
+  <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>Fill 75</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="1914"
+     inkscape:window-height="1048"
+     id="namedview16"
+     showgrid="false"
+     inkscape:zoom="32.283595"
+     inkscape:cx="4.829485"
+     inkscape:cy="6.7819403"
+     inkscape:window-x="1920"
+     inkscape:window-y="146"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg14" />
+  <!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
+  <title
+     id="title2">Fill 75</title>
+  <desc
+     id="desc4">Created with Sketch.</desc>
+  <defs
+     id="defs6" />
+  <rect
+     style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1.22474;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+     id="rect1545"
+     width="16"
+     height="1.5"
+     x="0"
+     y="7.25"
+     ry="0.75" />
+  <rect
+     style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1.22474;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+     id="rect1545-3"
+     width="16"
+     height="1.5"
+     x="-16"
+     y="7.25"
+     ry="0.75"
+     transform="rotate(-90)" />
+</svg>
diff --git a/res/img/trash-red.svg b/res/img/trash-red.svg
new file mode 100644
index 0000000000..0b1d201d2e
--- /dev/null
+++ b/res/img/trash-red.svg
@@ -0,0 +1,89 @@
+<?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="24"
+   height="24"
+   viewBox="0 0 24 24"
+   fill="none"
+   version="1.1"
+   id="svg12"
+   sodipodi:docname="trash-red.svg"
+   inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
+  <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></dc:title>
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs16" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1914"
+     inkscape:window-height="1048"
+     id="namedview14"
+     showgrid="false"
+     inkscape:zoom="27.610949"
+     inkscape:cx="12.318518"
+     inkscape:cy="13.781064"
+     inkscape:window-x="1920"
+     inkscape:window-y="146"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg12"
+     inkscape:document-rotation="0" />
+  <path
+     d="M2.25 5.5H5.16667H21.75"
+     stroke="#2E2F32"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path2"
+     style="stroke:#d90000;stroke-opacity:1;stroke-width:1.5;stroke-miterlimit:4;stroke-dasharray:none" />
+  <path
+     d="M16.5 5.5L15 1H9L7.5 5.5"
+     stroke="#2E2F32"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path4"
+     style="stroke:#d90000;stroke-opacity:1;stroke-width:1.5;stroke-miterlimit:4;stroke-dasharray:none" />
+  <path
+     d="M5.25 9.25V20.75C5.25 21.8546 6.14543 22.75 7.25 22.75H16.75C17.8546 22.75 18.75 21.8546 18.75 20.75V9.25"
+     stroke="#2E2F32"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path6"
+     style="stroke:#d90000;stroke-opacity:1;stroke-width:1.5;stroke-miterlimit:4;stroke-dasharray:none" />
+  <path
+     d="M9.75 9.25V18.25"
+     stroke="#2E2F32"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path8"
+     style="stroke:#d90000;stroke-opacity:1;stroke-width:1.5;stroke-miterlimit:4;stroke-dasharray:none" />
+  <path
+     d="M14.25 9.25V18.25"
+     stroke="#2E2F32"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path10"
+     style="stroke:#d90000;stroke-opacity:1;stroke-width:1.5;stroke-miterlimit:4;stroke-dasharray:none" />
+</svg>
diff --git a/src/components/views/elements/ImageView.js b/src/components/views/elements/ImageView.js
index 0c235d87be..719a17d3cb 100644
--- a/src/components/views/elements/ImageView.js
+++ b/src/components/views/elements/ImageView.js
@@ -203,7 +203,7 @@ export default class ImageView extends React.Component {
         if (mayRedact) {
             redactButton = (
                 <AccessibleButton className="mx_ImageView_button" title={_t("Remove")} onClick={ this.onRedactClick }>
-                    <img src={require("../../../../res/img/cancel-white.svg")} alt={ _t('Remove') } width="18" height="18" />
+                    <img src={require("../../../../res/img/trash-red.svg")} alt={ _t('Remove') } width="18" height="18" />
                 </AccessibleButton>
             );
         }
@@ -232,10 +232,10 @@ export default class ImageView extends React.Component {
                         </div>
                         <div className="mx_ImageView_toolbar">
                             <AccessibleButton className="mx_ImageView_button" title={_t("Zoom in")} onClick={ this.zoomIn }>
-                                <img src={require("../../../../res/img/plus.svg")} alt={ _t('Zoom in') } width="18" height="18" />
+                                <img src={require("../../../../res/img/plus-white.svg")} alt={ _t('Zoom in') } width="18" height="18" />
                             </AccessibleButton>
                             <AccessibleButton className="mx_ImageView_button" title={_t("Zoom out")} onClick={ this.zoomOut }>
-                                <img src={require("../../../../res/img/rotate-ccw.svg")} alt={ _t('Zoom out') } width="18" height="18" />
+                                <img src={require("../../../../res/img/minus-white.svg")} alt={ _t('Zoom out') } width="18" height="18" />
                             </AccessibleButton>
                             <AccessibleButton className="mx_ImageView_button" title={_t("Rotate Left")} onClick={ this.rotateCounterClockwise }>
                                 <img src={require("../../../../res/img/rotate-ccw.svg")} alt={ _t('Rotate counter-clockwise') } width="18" height="18" />
@@ -244,7 +244,7 @@ export default class ImageView extends React.Component {
                                 <img src={require("../../../../res/img/rotate-cw.svg")} alt={ _t('Rotate clockwise') } width="18" height="18" />
                             </AccessibleButton>
                             <a className="mx_ImageView_button" href={ this.props.src } download={ this.props.name } title={_t("Download")} target="_blank" rel="noopener">
-                                <img src={require("../../../../res/img/download.svg")} width="18" height="18" alt={ _t('Download') } />
+                                <img src={require("../../../../res/img/download-white.svg")} width="18" height="18" alt={ _t('Download') } />
                             </a>
                             { redactButton }
                             <AccessibleButton className="mx_ImageView_button" title={_t("Close")} onClick={ this.props.onFinished }>