Merge branch 'brooksbecton-attachments-improvements' into devel

.meteor/packages

@@ -79,3 +79,4 @@ shell-server@0.2.3
 simple:rest-accounts-password
 useraccounts:core
 email@1.2.3
+horka:swipebox

.meteor/versions

@@ -58,6 +58,7 @@ es5-shim@4.6.15
 fastclick@1.0.13
 fortawesome:fontawesome@4.7.0
 geojson-utils@1.0.10
+horka:swipebox@1.0.2
 hot-code-push@1.0.4
 html-tools@1.0.11
 htmljs@1.0.11

CHANGELOG.md

@@ -2,9 +2,10 @@
 
 This release adds the following new features:
 
-* [Permit editing WIP limit](https://github.com/wekan/wekan/pull/1312).
+* [Permit editing WIP limit](https://github.com/wekan/wekan/pull/1312);
+* [Image attachment resize on smaller screens and swipebox](https://github.com/wekan/wekan/pull/1315).
 
-Thanks to GitHub users nztqa and ocdtrekkie for their contributions.
+Thanks to GitHub users brooksbecton, nztqa and ocdtrekkie for their contributions.
 
 # v0.51 2017-10-25 Wekan release
 

client/components/cards/attachments.jade

@@ -21,11 +21,11 @@ template(name="attachmentDeletePopup")
 template(name="attachmentsGalery")
   .attachments-galery
     each attachments
-      a.attachment-item.js-open-viewer(title="{{_ 'added'}} {{ moment uploadedAt }}")
+      a.attachment-item.swipebox(href="{{url}}" title="{{name}}")
         .attachment-thumbnail
           if isUploaded
             if isImage
-              img.attachment-thumbnail-img.js-preview-image(src="{{url}}")
+              img.attachment-thumbnail-img(src="{{url}}")
             else
               span.attachment-thumbnail-ext= extension
           else

client/components/cards/attachments.js

@@ -11,9 +11,6 @@ Template.attachmentsGalery.events({
   'click .js-download'(event) {
     event.stopPropagation();
   },
-  'click .js-open-viewer'() {
-    // XXX Not implemented!
-  },
   'click .js-add-cover'() {
     Cards.findOne(this.cardId).setCover(this._id);
   },

client/components/cards/attachments.styl

@@ -58,7 +58,28 @@
 
 .preview-clipboard-image
   width: 280px
+  max-width: 100%;
   height: 200px
   display: block
   border: 1px solid black
   box-shadow: 0 1px 2px rgba(0,0,0,.2)
+
+@media screen and (max-width: 800px)
+  .attachments-galery
+    flex-direction
+      row
+    .attachment-item
+      width: 50% - 2%
+
+      .attachment-thumbnail
+        height: 130px
+      .attachment-details
+        font-size: 1.1em
+
+@media screen and (max-width: 360px)
+  .attachments-galery
+    .attachment-item
+      width: 100%
+
+      .attachment-thumbnail
+        height: 200px