Merge pull request #420 from felipeelia/fix/mobile-styles

Author: thrijith

assets/css/stylesheet.css

@@ -288,6 +288,19 @@ header h1 {
 	margin-bottom: 20px;
 }
 
+@media (max-width: 970px) {
+	header h1 {
+		margin-left: 0;
+	}
+}
+
+@media (max-width: 690px) {
+	/* Avoid collision with the language selector */
+	header h1 {
+		padding-top: 40px;
+	}
+}
+
 header h1 img {
 	vertical-align: middle;
 }
@@ -438,6 +451,13 @@ body.display-global-parameters #main_content {
 	-webkit-font-smoothing: antialiased;
 }
 
+@media (max-width: 970px) {
+	#main_content {
+		padding: 0; /* parent .container will provide needed spacement */
+		margin: 0;
+	}
+}
+
 #main_content h1 {
 	font-size: 30px;
 }
@@ -707,14 +727,8 @@ hr:after,
 	}
 }
 
-@media (max-width: 970px) {
-	header h1 {
-		margin-left: 0;
-	}
-}
-
 @media (max-width: 690px) {
-	.main-nav li a {
+	.main-nav li:not(:nth-child(5)) a {
 		padding-left: 0;
 	}
 

index.md

@@ -5,12 +5,31 @@ WP-CLI
 
 Ongoing maintenance is made possible by:
 
-<a href="https://automattic.com/" style="height:100px;width:49%;display:inline-block;position:relative;"><img src="https://make.wordpress.org/cli/files/2017/04/automattic-1.png" style="max-height:100%;max-width:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;" alt="" width="320" height="70" class="aligncenter size-full wp-image-347" /></a>
-<a href="https://www.bluehost.com/" style="height:100px;width:49%;display:inline-block;position:relative;"><img class="aligncenter size-full wp-image-335" style="max-height:100%;max-width:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;" src="https://make.wordpress.org/cli/files/2017/04/bluehost.png" alt="" width="320" height="52" /></a>
-<a href="https://pantheon.io/" style="height:100px;width:49%;display:inline-block;position:relative;"><img class="aligncenter size-full wp-image-333" style="max-height:100%;max-width:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;" src="https://make.wordpress.org/cli/files/2019/06/pantheon.png" alt="" width="320" height="100" /></a>
-<a href="https://www.siteground.com/" style="height:100px;width:49%;display:inline-block;position:relative;"><img class="aligncenter size-full wp-image-332" style="max-height:100%;max-width:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;" src="https://make.wordpress.org/cli/files/2019/06/SG_logo.png" alt="" width="320" height="66" /></a>
-<a href="https://wpengine.com/" style="height:100px;width:49%;display:inline-block;position:relative;"><img class="aligncenter size-full wp-image-333" style="max-height:100%;max-width:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;" src="https://make.wordpress.org/cli/files/2017/04/wpengine.png" alt="" width="320" height="60" /></a>
-<a href="https://www.cloudways.com/" style="height:100px;width:49%;display:inline-block;position:relative;"><img class="aligncenter size-full wp-image-3229" style="max-height:100%;max-width:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;" src="https://make.wordpress.org/cli/files/2021/02/Cloudways-Logo-e1612285267691.png" alt="" width="320" height="62" /></a>
+<div style="
+		display: flex; 
+		flex-wrap: wrap; 
+		align-items: center; 
+		justify-content: space-between; 
+		text-align: center;">
+	<a href="https://automattic.com/" style="width:49%; margin-bottom: 10px">
+		<img src="https://make.wordpress.org/cli/files/2017/04/automattic-1.png" alt="Automattic" width="320" height="70" style="height: auto" />
+	</a>
+	<a href="https://www.bluehost.com/" style="width:49%; margin-bottom: 10px">
+		<img style="height: auto" src="https://make.wordpress.org/cli/files/2017/04/bluehost.png" alt="Bluehost" width="320" height="52" />
+	</a>
+	<a href="https://pantheon.io/" style="width:49%; margin-bottom: 10px">
+		<img style="height: auto" src="https://make.wordpress.org/cli/files/2019/06/pantheon.png" alt="Pantheon" width="320" height="100" />
+	</a>
+	<a href="https://www.siteground.com/" style="width:49%; margin-bottom: 10px">
+		<img style="height: auto" src="https://make.wordpress.org/cli/files/2019/06/SG_logo.png" alt="SiteGround" width="320" height="66" />
+	</a>
+	<a href="https://wpengine.com/" style="width:49%; margin-bottom: 10px">
+		<img style="height: auto" src="https://make.wordpress.org/cli/files/2017/04/wpengine.png" alt="WP Engine" width="320" height="60" />
+	</a>
+	<a href="https://www.cloudways.com/" style="width:49%; margin-bottom: 10px">
+		<img style="height: auto" src="https://make.wordpress.org/cli/files/2021/02/Cloudways-Logo-e1612285267691.png" alt="Cloudways" width="320" height="62" />
+	</a>
+</div>
 
 The current stable release is [version 2.5.0](https://make.wordpress.org/cli/2021/05/19/wp-cli-v2-5-0-release-notes/). For announcements, follow [@wpcli on Twitter](https://twitter.com/wpcli) or [sign up for email updates](https://make.wordpress.org/cli/subscribe/). [Check out the roadmap](https://make.wordpress.org/cli/handbook/roadmap/) for an overview of what's planned for upcoming releases.