Restyle block warnings (#5383)

* Position warnings near top

* Restrict max height of blocks with warnings, fade

* Ignore swap files

* Rewrite translate as translateX

* Don't ignore swap files

editor/components/block-list/style.scss

@@ -44,6 +44,8 @@
 	&.has-warning .editor-block-list__block-edit {
 		position: relative;
 		min-height: 250px;
+		max-height: 500px;
+		overflow: hidden;
 
 		> :not( .editor-warning ) {
 			pointer-events: none;
@@ -59,6 +61,7 @@
 		bottom: 0;
 		left: 0;
 		background-color: rgba( $white, 0.6 );
+		background-image: linear-gradient( to bottom, transparent, #fff );
 	}
 
 	// simpler style for a block that has cursor focus (but hasn't been selected)

editor/components/warning/style.scss

@@ -1,9 +1,9 @@
 .editor-warning {
 	z-index: z-index( '.editor-warning' );
 	position: absolute;
-	top: 50%;
+	top: 15px;
 	left: 50%;
-	transform: translate( -50%, -50% );
+	transform: translateX( -50% );
 	display: flex;
 	flex-direction: column;
 	justify-content: space-around;