feat(ui/modules/Linphone/Chat/FileMessage): provide a download icon

linphone-desktop/assets/images/download.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch -->
+    <title>dowanload_icon</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="dowanload_icon" fill-rule="nonzero" fill="#FFFFFF">
+            <g id="Group-3">
+                <path d="M15.7265214,15.5167598 L15.7265214,15.6242773 L15.9960779,15.6242773 C15.8481503,15.6242773 15.7265214,15.7446888 15.7265214,15.8921387 L15.7265214,15.5167598 Z M2.18181818,15.8926897 C2.18181818,15.7444792 2.060263,15.6242773 1.91226174,15.6242773 L2.18181818,15.6242773 L2.18181818,15.8926897 Z M15.7265214,15.6242773 L15.7265214,15.5167598 L15.7265214,14.5541084 L15.7265214,14.0045105 L17.9083396,14 L17.9083396,15.8921387 C17.9083396,16.937138 17.053626,17.7842773 15.9960779,17.7842773 L1.91226174,17.7842773 C0.856148745,17.7842773 0,16.9382765 0,15.8926897 L0,14.0655134 L2.1818036,14.0575318 C2.18181332,14.0601912 2.18181818,15.6242773 2.18181818,15.6242773 L15.7265214,15.6242773 Z M2.18181818,15.8926897 C2.18181818,15.7444792 2.060263,15.6242773 1.91226174,15.6242773 L2.18181818,15.6242773 L2.18181818,15.8926897 Z M15.7265214,15.6242773 L15.9960779,15.6242773 C15.8481503,15.6242773 15.7265214,15.7446888 15.7265214,15.8921387 L15.7265214,15.5167598 L15.7265214,15.6242773 Z M15.7265214,15.6242773 C15.7265214,15.1098067 15.7265214,15.0171167 15.7265214,14.5541084 L15.7265214,14.0045105 L17.9083396,14 L17.9083396,15.8921387 C17.9083396,16.937138 17.053626,17.7842773 15.9960779,17.7842773 L1.91226174,17.7842773 C0.856148745,17.7842773 0,16.9382765 0,15.8926897 L0,14.0655134 L2.1818036,14.0575318 C2.18181332,14.0601912 2.18181818,15.6242773 2.18181818,15.6242773 L15.7265214,15.6242773 Z" id="Rectangle-7"></path>
+                <path d="M14.0963817,6.31634233 C14.2994958,6.11496313 14.5727235,6.00240425 14.8600488,6.00240425 C15.147396,6.00240425 15.4206544,6.11500284 15.6152253,6.30813856 C15.8231121,6.5067044 15.9405998,6.78414017 15.9405998,7.07110551 C15.9405998,7.35348166 15.8252318,7.62628555 15.6237273,7.82570902 L10.2349902,13.1708209 C10.031858,13.3722897 9.75860373,13.4848978 9.47124292,13.4848978 C9.18386185,13.4848978 8.91060467,13.3722965 8.70754585,13.1709003 L3.31631498,7.82572027 C3.11337427,7.62451303 3,7.35412522 3,7.06988854 C3,6.78565186 3.11337427,6.51526405 3.31631498,6.31405681 C3.51947628,6.11263087 3.79268542,6 4.08004199,6 C4.36739856,6 4.6406077,6.11263087 4.843769,6.31405681 L9.47012303,10.9008935 L14.0963817,6.31634233 Z M9.33419277,12.280702 C9.36941467,12.2457685 9.42005949,12.2248978 9.47124292,12.2248978 C9.52237288,12.2248978 9.57299706,12.2457496 9.60819734,12.2806368 L9.47119713,12.1448068 L9.33419277,12.280702 Z" id="Fill-1-Copy-6"></path>
+                <path d="M10.5544756,12.0747767 L10.5454541,1.25895955 C10.5448737,0.563081 9.97458393,-0.00057419236 9.27167631,4.38975428e-07 C8.56876869,0.000575070311 7.99942001,0.565161924 8.00000044,1.26104047 L8.00902197,12.0768576 C8.0096024,12.7727361 8.57989216,13.3363913 9.28279978,13.3358167 C9.9857074,13.3352421 10.5550561,12.7706552 10.5544756,12.0747767 Z" id="Line-Copy"></path>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

linphone-desktop/resources.qrc

@@ -82,6 +82,7 @@
     <file>assets/images/delete_hovered.svg</file>
     <file>assets/images/delete_normal.svg</file>
     <file>assets/images/delete_pressed.svg</file>
+    <file>assets/images/download.svg</file>
     <file>assets/images/drop_down.svg</file>
     <file>assets/images/edit_hovered.svg</file>
     <file>assets/images/edit_normal.svg</file>

linphone-desktop/ui/modules/Linphone/Chat/FileMessage.qml

@@ -89,12 +89,12 @@ Row {
           id: extension
 
           Rectangle {
-            color: Colors.l50
+            color: ChatStyle.entry.message.file.extension.background.color
 
             Text {
               anchors.fill: parent
 
-              color: Colors.k
+              color: ChatStyle.entry.message.file.extension.text.color
               font.bold: true
               elide: Text.ElideRight
               text: Utils.getExtension($chatEntry.fileName).toUpperCase()
@@ -152,13 +152,13 @@ Row {
             visible: $chatEntry.status === ChatModel.MessageStatusInProgress
 
             background: Rectangle {
-              color: Colors.f
+              color: ChatStyle.entry.message.file.status.bar.background.color
               radius: ChatStyle.entry.message.file.status.bar.radius
             }
 
             contentItem: Item {
               Rectangle {
-                color: Colors.z
+                color: ChatStyle.entry.message.file.status.bar.contentItem.color
                 height: parent.height
                 width: progressBar.visualPosition * parent.width
               }
@@ -179,6 +179,19 @@ Row {
         }
       }
 
+      Icon {
+        anchors {
+          bottom: parent.bottom
+          bottomMargin: ChatStyle.entry.message.file.margins
+          right: parent.right
+          rightMargin: ChatStyle.entry.message.file.margins
+        }
+
+        icon: 'download'
+        iconSize: ChatStyle.entry.message.file.iconSize
+        visible: !$chatEntry.isOutgoing
+      }
+
       MouseArea {
         anchors.fill: parent
         cursorShape: containsMouse

linphone-desktop/ui/modules/Linphone/Styles/Chat/ChatStyle.qml

@@ -61,6 +61,7 @@ QtObject {
 
       property QtObject file: QtObject {
         property int height: 64
+        property int iconSize: 18
         property int margins: 8
         property int spacing: 8
         property int width: 250
@@ -71,6 +72,24 @@ QtObject {
           property QtObject bar: QtObject {
             property int height: 6
             property int radius: 3
+
+            property QtObject background: QtObject {
+              property color color: Colors.f
+            }
+
+            property QtObject contentItem: QtObject {
+              property color color: Colors.z
+            }
+          }
+        }
+
+        property QtObject extension: QtObject {
+          property QtObject background: QtObject {
+            property color color: Colors.l50
+          }
+
+          property QtObject text: QtObject {
+            property color color: Colors.k
           }
         }