Merge PR #593 into devel

CHANGELOG.md

@@ -18,6 +18,7 @@ and fixes the following bugs:
 * Fix the generation and alignment of the initials avatars;
 * Only display the buttons in the board header, if the data is avialable
   and the user is able to use it;
+* Fix the scaling of cover images;
 
 Thanks to GitHub users alayek, AlexanderS, choclin, floatinghotpot, ForNeVeR,
 seschwar, and TheElf for their contributions.

client/components/cards/attachments.jade

@@ -49,4 +49,5 @@ template(name="attachmentsGalery")
                 | {{_ 'delete'}}
 
     if currentUser.isBoardMember
-      a.attachment-item.add-attachment.js-add-attachment {{_ 'add-attachment' }}
+      li.attachment-item.add-attachment
+        a.js-add-attachment {{_ 'add-attachment' }}

client/components/cards/attachments.styl

@@ -20,6 +20,10 @@
       display: flex
       align-items: center
 
+      a
+        display: block
+        margin: auto
+
     .attachment-thumbnail
       height: 80px
       display: flex
@@ -28,8 +32,8 @@
       position: relative
 
       .attachment-thumbnail-img
-        height: 100%
-        width: 100%
+        max-height: 100%
+        max-width: 100%
 
       .attachment-thumbnail-ext
         text-transform: uppercase
@@ -39,7 +43,7 @@
       font-size: 0.75em
       margin: 3px
 
-      .attachment-details-actions
+      .attachment-details-actions a
         display: block
 
 .attachment-image-preview

client/components/cards/minicard.jade

@@ -1,8 +1,7 @@
 template(name="minicard")
   .minicard
     if cover
-      .minicard-cover
-        img(src="{{pathFor cover.url}}")
+      .minicard-cover(style="background-image: url('{{pathFor cover.url}}');")
     if labels
       .minicard-labels
         each labels

client/components/cards/minicard.styl

@@ -62,16 +62,11 @@
   .minicard-cover
     background-position: center
     background-repeat: no-repeat
-    background-size: cover
+    background-size: contain
     height: 145px
     user-select: none
     margin: -6px -8px 6px -8px
     border-radius: top 2px
-    position: relative
-
-    img
-      height: 100%
-      width: 100%
 
   .minicard-labels
     float: right