Help/About: Update the About page for 5.8.

Use a larger image for theme.json on retina screens, and update the spacing of sections on the page.

Props javiarce.
See #52775.



git-svn-id: https://develop.svn.wordpress.org/trunk@51418 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Kelly Choyce-Dwan 2021-07-13 15:38:12 +00:00
parent 84a22c3f98
commit 16d538c0f8

View File

@ -47,7 +47,7 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
</div>
<div class="about__section has-2-columns is-wider-left">
<div class="column about__image is-vertically-aligned-center is-edge-to-edge">
<div class="column about__image is-vertically-aligned-center">
<img src="https://s.w.org/images/core/5.8/about-widgets-blocks.png" alt="" />
</div>
<div class="column">
@ -66,8 +66,6 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
</div>
</div>
<hr />
<div class="about__section has-2-columns is-wider-right">
<div class="column">
<h3>
@ -77,15 +75,13 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
<?php _e( 'The Query Loop Block makes it possible to display posts based on specified parameters; like a PHP loop without the code. Easily display posts from a specific category, to do things like create a portfolio or a page full of your favorite recipes. Think of it as a more complex and powerful Latest Posts Block! Plus, pattern suggestions make it easier than ever to create a list of posts with the design you want.' ); ?>
</p>
</div>
<div class="column about__image is-vertically-aligned-center is-edge-to-edge">
<div class="column about__image is-vertically-aligned-center">
<img src="https://s.w.org/images/core/5.8/about-query-loop.png" alt="" />
</div>
</div>
<hr />
<div class="about__section has-2-columns is-wider-left">
<div class="column about__image is-vertically-aligned-center is-edge-to-edge">
<div class="column about__image is-vertically-aligned-center">
<img src="https://s.w.org/images/core/5.8/about-template.png" alt="" />
</div>
<div class="column">
@ -109,7 +105,7 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
</div>
<div class="about__section has-2-columns is-wider-left">
<div class="column about__image is-vertically-aligned-center is-edge-to-edge">
<div class="column about__image is-vertically-aligned-center">
<img src="https://s.w.org/images/core/5.8/about-list-view.png" alt="" />
</div>
<div class="column">
@ -124,8 +120,6 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
</div>
</div>
<hr />
<div class="about__section has-2-columns is-wider-right">
<div class="column">
<h3>
@ -137,15 +131,13 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
?>
</p>
</div>
<div class="column about__image is-vertically-aligned-center is-edge-to-edge">
<div class="column about__image is-vertically-aligned-center">
<img src="https://s.w.org/images/core/5.8/about-pattern-suggestions.png" alt="" />
</div>
</div>
<hr />
<div class="about__section has-2-columns is-wider-left">
<div class="column about__image is-vertically-aligned-center is-edge-to-edge">
<div class="column about__image is-vertically-aligned-center">
<img src="https://s.w.org/images/core/5.8/about-duotone.png" alt="" />
</div>
<div class="column">
@ -163,11 +155,14 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
<hr class="is-large" />
<div class="about__section">
<h2 class="aligncenter">
<h2 class="aligncenter" style="margin-bottom:0;">
<?php _e( 'For Developers to Explore' ); ?>
</h2>
<div class="column about__image is-vertically-aligned-center is-edge-to-edge">
<img src="https://s.w.org/images/core/5.8/about-theme-json.png" alt="" />
<div class="column about__image is-vertically-aligned-center">
<picture>
<source srcset="https://s.w.org/images/core/5.8/about-theme-json.png, https://s.w.org/images/core/5.8/about-theme-json-2x.png 2x">
<img src="https://s.w.org/images/core/5.8/about-theme-json.png" alt="">
</picture>
</div>
</div>
@ -188,8 +183,6 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
</div>
</div>
<hr />
<div class="about__section has-3-columns">
<div class="column">
<h3>