From f74f066a4472ad5ceac379eb3518307b51a18280 Mon Sep 17 00:00:00 2001
From: Asaad Mahmood <Unknowngi@live.com>
Date: Wed, 9 Sep 2015 19:42:03 +0500
Subject: MM-1866 - Adding download icon and adding download link for both file
 title and download icon

---
 web/react/components/file_attachment.jsx | 16 ++++++++++++++--
 web/sass-files/sass/partials/_files.scss | 12 ++++++++++--
 2 files changed, 24 insertions(+), 4 deletions(-)

(limited to 'web')

diff --git a/web/react/components/file_attachment.jsx b/web/react/components/file_attachment.jsx
index 78693df98..c9aa06a97 100644
--- a/web/react/components/file_attachment.jsx
+++ b/web/react/components/file_attachment.jsx
@@ -97,6 +97,7 @@ export default class FileAttachment extends React.Component {
         var filename = this.props.filename;
 
         var fileInfo = utils.splitFileLocation(filename);
+        var fileUrl = utils.getFileUrl(filename);
         var type = utils.getFileType(fileInfo.ext);
 
         var thumbnail;
@@ -150,14 +151,25 @@ export default class FileAttachment extends React.Component {
                     {thumbnail}
                 </a>
                 <div className='post-image__details'>
-                    <div
+                    <a
+                        href={fileUrl}
+                        download={filenameString}
                         data-toggle='tooltip'
                         title={filenameString}
                         className='post-image__name'
                     >
                         {trimmedFilename}
-                    </div>
+                    </a>
                     <div>
+                        <a
+                            href={fileUrl}
+                            download={filenameString}
+                            className='post-image__download'
+                        >
+                            <span
+                                className='fa fa-download'
+                            />
+                        </a>
                         <span className='post-image__type'>{fileInfo.ext.toUpperCase()}</span>
                         <span className='post-image__size'>{fileSizeString}</span>
                     </div>
diff --git a/web/sass-files/sass/partials/_files.scss b/web/sass-files/sass/partials/_files.scss
index 70f440989..405265f92 100644
--- a/web/sass-files/sass/partials/_files.scss
+++ b/web/sass-files/sass/partials/_files.scss
@@ -61,8 +61,8 @@
       cursor: pointer;
       z-index: 5;
       opacity: inherit;
-        text-shadow: 0 0px 3px #444;
-        text-shadow: 0 0px 3px rgba(0, 0, 0, 0.7);
+      text-shadow: 0 0px 3px #444;
+      text-shadow: 0 0px 3px rgba(0, 0, 0, 0.7);
     }
   }
 }
@@ -159,6 +159,14 @@
     padding: 7px;
     .post-image__name {
       margin-bottom: 3px;
+      display: block;
+      color: #333;
+    }
+    .post-image__download {
+      display: inline-block;
+      padding-right: 7px;
+      cursor: pointer;
+      color: #555;
     }
     .post-image__type {
       color: grey;
-- 
cgit v1.2.3-1-g7c22