Skip to content

Commit

Permalink
Help/About: Update About section images.
Browse files Browse the repository at this point in the history 
Switch to the CDN URLs for the images on the About page. Update the images used on Freedoms & Privacy to match the 6.1 design style.

Props richtabor, audrasjb, kebbet.
See #56357.



git-svn-id: https://develop.svn.wordpress.org/trunk@54690 602fd350-edb4-49c9-b593-d223f7449a82
  • Loading branch information
@ryelle
ryelle authored and = committed Nov 4, 2022
1 parent e0a2cce commit 0dba8a2
Show file tree
Hide file tree
Showing 9 changed files with 33 additions and 135 deletions.
18 changes: 9 additions & 9 deletions src/wp-admin/about.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@
<div class="about__section has-2-columns">
<div class="column">
<div class="about__image" style="background-color:#353535;">
<img src="https://make.wordpress.org/core/files/2022/10/about-61-style-variations.webp" alt="" />
<img src="https://s.w.org/images/core/6.1/about-61-style-variations.webp" alt="" />
</div>
</div>
<div class="column is-vertically-aligned-center">
Expand Down Expand Up @@ -96,15 +96,15 @@
</div>
<div class="column">
<div class="about__image has-subtle-background-color">
<img src="https://make.wordpress.org/core/files/2022/10/about-61-templates.webp" alt="" />
<img src="https://s.w.org/images/core/6.1/about-61-templates.webp" alt="" />
</div>
</div>
</div>

<div class="about__section has-2-columns">
<div class="column">
<div class="about__image has-subtle-background-color">
<img src="https://make.wordpress.org/core/files/2022/10/about-61-design-tools.webp" alt="" />
<img src="https://s.w.org/images/core/6.1/about-61-design-tools.webp" alt="" />
</div>
</div>
<div class="column is-vertically-aligned-center">
Expand Down Expand Up @@ -136,22 +136,22 @@
</div>
<div class="column">
<div class="about__image has-subtle-background-color">
<img src="https://make.wordpress.org/core/files/2022/10/about-61-navigation.webp" alt="" />
<img src="https://s.w.org/images/core/6.1/about-61-navigation.webp" alt="" />
</div>
</div>
</div>

<div class="about__section has-2-columns">
<div class="column">
<div class="about__image has-accent-background-color">
<img src="https://make.wordpress.org/core/files/2022/10/about-61-document-settings.webp" alt="" />
<img src="https://s.w.org/images/core/6.1/about-61-document-settings.webp" alt="" />
</div>
<h3><?php _e( 'Improved layout and visualization of document settings' ); ?></h3>
<p><?php _e( 'A cleaner, better-organized display helps you easily view and manage important post and page settings, especially the template picker and scheduler.' ); ?></p>
</div>
<div class="column">
<div class="about__image has-accent-background-color">
<img src="https://make.wordpress.org/core/files/2022/10/about-61-lock.webp" alt="" />
<img src="https://s.w.org/images/core/6.1/about-61-lock.webp" alt="" />
</div>
<h3><?php _e( 'One-click lock settings for all inner blocks' ); ?></h3>
<p><?php _e( 'When locking blocks, a new toggle lets you apply your lock settings to all the blocks in a containing block like the group, cover, and column blocks.' ); ?></p>
Expand All @@ -161,21 +161,21 @@
<div class="about__section has-3-columns">
<div class="column">
<div class="column about__image is-edge-to-edge has-accent-background-color">
<img src="https://make.wordpress.org/core/files/2022/10/about-61-sub-feature-1.webp" alt="" />
<img src="https://s.w.org/images/core/6.1/about-61-sub-feature-1.webp" alt="" />
</div>
<h3 class="is-smaller-heading"><?php _e( 'Improved block placeholders' ); ?></h3>
<p><?php _e( 'Various blocks have improved placeholders that reflect customization options to help you design your site and its content. For example, the Image block placeholder displays custom borders and duotone filters even before selecting an image.' ); ?></p>
</div>
<div class="column">
<div class="column about__image is-edge-to-edge has-accent-background-color">
<img src="https://make.wordpress.org/core/files/2022/10/about-61-sub-feature-2.webp" alt="" />
<img src="https://s.w.org/images/core/6.1/about-61-sub-feature-2.webp" alt="" />
</div>
<h3 class="is-smaller-heading"><?php _e( 'Compose richer lists and quotes with inner blocks' ); ?></h3>
<p><?php _e( 'The List and Quote blocks now support inner blocks, allowing for more flexible and rich compositions like adding headings inside your Quote blocks.' ); ?></p>
</div>
<div class="column">
<div class="column about__image is-edge-to-edge has-accent-background-color">
<img src="https://make.wordpress.org/core/files/2022/10/about-61-sub-feature-3.webp" alt="" />
<img src="https://s.w.org/images/core/6.1/about-61-sub-feature-3.webp" alt="" />
</div>
<h3 class="is-smaller-heading"><?php _e( 'More responsive text with fluid typography' ); ?></h3>
<p>
Expand Down
15 changes: 14 additions & 1 deletion src/wp-admin/css/about.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
1.3 Header
2.0 Credits Page
3.0 Freedoms Page
4.0 Privacy Page
x.2.0 Legacy About Styles: Global
x.2.1 Typography
x.2.2 Structure
Expand Down Expand Up @@ -945,7 +946,19 @@

.about__section .column .freedom-image {
margin-bottom: var(--gap);
max-height: 140px;
max-height: 180px;
}


/*------------------------------------------------------------------------------
4.0 - Privacy Page
------------------------------------------------------------------------------*/

.about__section .column .privacy-image {
display: block;
margin-left: auto;
margin-right: auto;
max-width: 25rem;
}


Expand Down
8 changes: 4 additions & 4 deletions src/wp-admin/freedoms.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,22 +57,22 @@

<div class="about__section has-2-columns">
<div class="column aligncenter">
<img class="freedom-image" src="<?php echo esc_url( admin_url( 'images/freedom-1.svg' ) ); ?>" alt="" />
<img class="freedom-image" src="<?php echo esc_url( admin_url( 'images/freedom-1.svg?ver=6.1' ) ); ?>" alt="" />
<h2 class="is-smaller-heading"><?php _e( 'The 1st Freedom' ); ?></h2>
<p><?php _e( 'To run the program for any purpose.' ); ?></p>
</div>
<div class="column aligncenter">
<img class="freedom-image" src="<?php echo esc_url( admin_url( 'images/freedom-2.svg' ) ); ?>" alt="" />
<img class="freedom-image" src="<?php echo esc_url( admin_url( 'images/freedom-2.svg?ver=6.1' ) ); ?>" alt="" />
<h2 class="is-smaller-heading"><?php _e( 'The 2nd Freedom' ); ?></h2>
<p><?php _e( 'To study how the program works and change it to make it do what you wish.' ); ?></p>
</div>
<div class="column aligncenter">
<img class="freedom-image" src="<?php echo esc_url( admin_url( 'images/freedom-3.svg' ) ); ?>" alt="" />
<img class="freedom-image" src="<?php echo esc_url( admin_url( 'images/freedom-3.svg?ver=6.1' ) ); ?>" alt="" />
<h2 class="is-smaller-heading"><?php _e( 'The 3rd Freedom' ); ?></h2>
<p><?php _e( 'To redistribute.' ); ?></p>
</div>
<div class="column aligncenter">
<img class="freedom-image" src="<?php echo esc_url( admin_url( 'images/freedom-4.svg' ) ); ?>" alt="" />
<img class="freedom-image" src="<?php echo esc_url( admin_url( 'images/freedom-4.svg?ver=6.1' ) ); ?>" alt="" />
<h2 class="is-smaller-heading"><?php _e( 'The 4th Freedom' ); ?></h2>
<p><?php _e( 'To distribute copies of your modified versions to others.' ); ?></p>
</div>
Expand Down
13 changes: 1 addition & 12 deletions src/wp-admin/images/freedom-1.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
14 changes: 1 addition & 13 deletions src/wp-admin/images/freedom-2.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit 0dba8a2

Please sign in to comment.