Merge branch 'master' into bug/image-upload

diff --combined app/Http/Controllers/ImageController.php
index 17e690813791c4088ef4f77078e19ccc23b5be24,d71e383461bb025474f441b0ba691b55a4d00d47..9782a94c42dfcbbb39a8b23690d3f7c34cc57708
--- 1/app/Http/Controllers/ImageController.php
--- 2/app/Http/Controllers/ImageController.php
+++ b/app/Http/Controllers/ImageController.php
@@@ -120,7 -120,7 +120,7 @@@ class ImageController extends Controlle
      {
          $this->checkPermission('image-create-all');
          $this->validate($request, [
-             'file' => 'image'
 -            'file' => 'required|is_image'
++            'file' => 'required|image'
          ]);
  
          if (!$this->imageRepo->isValidType($type)) {

diff --combined resources/assets/sass/_components.scss
index 0b5d767fa16369b0e35e955cf0a1c370d01bb02d,f15528167939ac76b3684aa80aed50c1332a00fa..430b93757fbe5f60dc97b75f0de5e1bf512cc204
--- 1/resources/assets/sass/_components.scss
--- 2/resources/assets/sass/_components.scss
+++ b/resources/assets/sass/_components.scss
@@@ -10,8 -10,8 +10,8 @@@
    box-shadow: $bs-med;
    z-index: 999999;
    cursor: pointer;
-   max-width: 480px;
-   transition: transform ease-in-out 360ms;
+   max-width: 360px;
+   transition: transform ease-in-out 280ms;
    transform: translate3d(580px, 0, 0);
    display: grid;
    grid-template-columns: 64px 1fr;
@@@ -27,6 -27,7 +27,7 @@@
    }
    span {
      vertical-align: middle;
+     line-height: 1.3;
    }
    &.pos {
      background-color: $positive;
@@@ -43,6 -44,9 +44,9 @@@
    &.showing {
      transform: translate3d(0, 0, 0);
    }
+   &.showing:hover {
+     transform: translate3d(0, -2px, 0);
+   }
  }
  
  [chapter-toggle] {
@@@ -207,7 -211,6 +211,7 @@@ body.flexbox-support #entity-selector-w
    margin-left: 1px;
    padding: $-m $-l;
    overflow-y: auto;
 +  overflow-x: hidden;
    border-left: 1px solid #DDD;
    .dropzone-container {
      margin-top: $-m;
@@@ -312,7 -315,8 +316,7 @@@
  
  .dz-preview.dz-file-preview .dz-image {
    border-radius: 4px;
 -  background: #999;
 -  background: linear-gradient(to bottom, #eee, #ddd);
 +  background: #e9e9e9;
  }
  
  .dz-preview.dz-file-preview .dz-details {
@@@ -328,12 -332,11 +332,12 @@@
  }
  
  .dz-preview .dz-remove {
 -  font-size: 14px;
 +  font-size: 13px;
    text-align: center;
    display: block;
    cursor: pointer;
    border: none;
 +  margin-top: 3px;
  }
  
  .dz-preview .dz-remove:hover {
@@@ -382,7 -385,7 +386,7 @@@
    border: 1px solid transparent;
  }
  
 -.dz-preview .dz-details .dz-filename span, .dz-preview .dz-details .dz-size span {
 +.dz-preview .dz-details .dz-filename span {
    background-color: rgba(255, 255, 255, 0.4);
    padding: 0 0.4em;
    border-radius: 3px;
@@@ -418,13 -421,13 +422,13 @@@
  .dz-preview .dz-success-mark, .dz-preview .dz-error-mark {
    pointer-events: none;
    opacity: 0;
 -  z-index: 500;
 +  z-index: 1001;
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    margin-left: -27px;
 -  margin-top: -27px;
 +  margin-top: -35px;
  }
  
  .dz-preview .dz-success-mark svg, .dz-preview .dz-error-mark svg {
@@@ -479,13 -482,9 +483,13 @@@
    display: block;
  }
  
 -.dz-preview.dz-error:hover .dz-error-message {
 -  opacity: 1;
 -  pointer-events: auto;
 +.dz-preview.dz-error {
 +  .dz-image, .dz-details {
 +    &:hover ~ .dz-error-message {
 +      opacity: 1;
 +      pointer-events: auto;
 +    }
 +  }
  }
  
  .dz-preview .dz-error-message {
@@@ -497,7 -496,7 +501,7 @@@
    opacity: 0;
    transition: opacity 0.3s ease;
    border-radius: 4px;
 -  font-size: 11.5px;
 +  font-size: 12px;
    line-height: 1.2;
    top: 88px;
    left: -26px;
@@@ -598,4 -597,4 +602,4 @@@
    .text-muted {
      color: #999;
    }
 -}
 +}

diff --combined resources/assets/sass/_pages.scss
index cb1cae19fb108a7a81ef78eb31827058e5a555c3,3555111d8bc1a177bc35a90c60b3691e74a7da49..3749b53210d45f18ce7a92fe89c0ce7e6be2a78a
--- 1/resources/assets/sass/_pages.scss
--- 2/resources/assets/sass/_pages.scss
+++ b/resources/assets/sass/_pages.scss
@@@ -2,6 -2,7 +2,7 @@@
    display: flex;
    flex-direction: column;
    align-items: stretch;
+   overflow: hidden;
    .faded-small {
      height: auto;
    }
@@@ -209,9 -210,6 +210,9 @@@
      flex: 1;
      padding-top: 0;
    }
 +  div[toolbox-tab-content] .padded.files {
 +      overflow-x: hidden;
 +  }
    h4 {
      font-size: 24px;
      margin: $-m 0 0 0;