Merge pull request #2181 from aertmann/media-browser-condensed

BUGFIX: Fix condensed layout in Media Browser

Author: aertmann

Neos.Media.Browser/Resources/Private/Styles/Media/_Media.scss

@@ -1,4 +1,6 @@
 @mixin neos-media-aside-condensed {
+	flex-direction: column;
+
 	.neos-media-aside {
 		margin-top: $wideMargin;
 		@include clearfix;
@@ -266,6 +268,9 @@
 	}
 
 	.neos-media-content {
+		display: flex;
+		flex-direction: row;
+
 		&:not(.neos-media-aside-condensed) {
 			@include clearfix;
 
@@ -663,15 +668,6 @@
 		}
 	}
 
-  .neos-media-content {
-    display: flex;
-    flex-direction: row;
-
-    @media screen and (max-width: 767px) {
-      flex-direction: column;
-    }
-  }
-
   .neos-image-inputs,
   .neos-image-example {
     flex: 1;

Neos.Media.Browser/Resources/Public/Styles/MediaBrowser.css

@@ -125,6 +125,10 @@
     margin: 0;
   }
 }
+.neos.media-browser .neos-media-content {
+  display: flex;
+  flex-direction: row;
+}
 .neos.media-browser .neos-media-content:not(.neos-media-aside-condensed) {
   *zoom: 1;
 }
@@ -182,6 +186,9 @@
 .neos.media-browser .neos-media-content .neos-search button[type="submit"] i {
   vertical-align: baseline;
 }
+.neos.media-browser .neos-media-content.neos-media-aside-condensed {
+  flex-direction: column;
+}
 .neos.media-browser .neos-media-content.neos-media-aside-condensed .neos-media-aside {
   margin-top: 32px;
   *zoom: 1;
@@ -297,6 +304,9 @@
   max-width: 320px;
 }
 @media (max-width: 767px) {
+  .neos.media-browser .neos-media-content {
+    flex-direction: column;
+  }
   .neos.media-browser .neos-media-content .neos-media-aside {
     margin-top: 32px;
     *zoom: 1;
@@ -479,8 +489,7 @@
   display: inline-block;
   font-style: normal;
   font-variant: normal;
-  font-family: FontAwesome;
-  font-weight: 900;
+  font-weight: normal;
   line-height: 1;
   vertical-align: -.125em;
   content: \f063;
@@ -758,15 +767,6 @@
   cursor: pointer;
   outline: 4px solid #00b5ff;
 }
-.neos.media-browser .neos-media-content {
-  display: flex;
-  flex-direction: row;
-}
-@media screen and (max-width: 767px) {
-  .neos.media-browser .neos-media-content {
-    flex-direction: column;
-  }
-}
 .neos.media-browser .neos-image-inputs,
 .neos.media-browser .neos-image-example {
   flex: 1;