Merge pull request #348 from afkm/stable

Hotfix: for "Pick Media" dialog for v1.3
HashBrownCMS · Nov 10, 2020 · 6dfaa0f · 6dfaa0f
2 parents f14656f + 10b63f2
commit 6dfaa0f
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 8 deletions.
diff --git a/package.json b/package.json
@@ -28,7 +28,7 @@
     "json-loader": "^0.5.4",
     "mongodb": "^3.1.10",
     "multer": "^1.4.1",
-    "sass": "^1.16.0",
+    "sass": "1.25.0",
     "semver": "^5.6.0",
     "webpack": "^4.28.1",
     "webpack-cli": "^3.3.0"

diff --git a/style/modal/mediaBrowser.scss b/style/modal/mediaBrowser.scss
@@ -6,7 +6,7 @@
     &__body {
         display: flex;
         padding: 0;
-        
+
         @include tablet {
             display: block;
         }
@@ -56,15 +56,16 @@
         height: 20rem;
         position: relative;
         border: 1px solid transparent;
+        display: flex;
 
         &:hover {
             border-color: var(--color-action-500);
         }
-        
+
         @include tablet {
             max-width: calc(100% / 2);
         }
-        
+
         @include phone {
             max-width: 100%;
         }
@@ -93,7 +94,7 @@
             color: var(--color-default-text);
             border-radius: var(--border-radius-small);
         }
-        
+
         &:hover &__name {
             background-color: var(--color-action-500);
             color: var(--color-action-text);

diff --git a/style/widget/media.scss b/style/widget/media.scss
@@ -2,15 +2,16 @@
     max-width: 100%;
     display: flex;
     flex-direction: column;
-
+    height: 100%;
+
     &.small {
         width: 10rem;
     }
 
     &.small &__preview {
         height: 10rem;
     }
-   
+
     &__placeholder {
         @include spinner;
     }
@@ -35,7 +36,7 @@
 
         &:not(.readonly) {
             cursor: pointer;
-            
+
             &:hover {
                 border-color: var(--color-action-500);
                 background-color: var(--color-action-500);
@@ -51,6 +52,9 @@
             font-size: 2rem;
             position: relative;
             z-index: 100;
+            object-fit: contain;
+            max-height: 100%;
+            max-width: 100%;
         }
     }