Make WordPress Core

Changeset 48783

08/11/2020 04:51:22 PM (10 months ago)

Help/About: Final adjustments to the 5.5 About page.

  • Final CDN asset URLs.
  • Some minor color adjustments.

Props ryelle, marybaum, davidbaumwald, audrasjb, estelaris, afercia, cbringmann, andreamiddleton, desrosj, SergeyBiryukov, ocean90, nrqsnchz, spacedmonkey, whyisjake, man4toman.
Fixes #50416.

2 edited


  • trunk/src/wp-admin/about.php

    r48770 r48783  
    115115            <div class="column about__image is-vertically-aligned-center">
    116116                <figure aria-labelledby="about-block-pattern" class="about__image">
    117                     <video controls poster="https://s.w.org/images/core/5.5/temp-block-patterns-poster.png">
    118                         <source src="https://s.w.org/images/core/5.5/temp-block-patterns.mp4" type="video/mp4" />
    119                         <source src="https://s.w.org/images/core/5.5/temp-block-patterns.webm" type="video/webm" />
     117                    <video controls poster="https://s.w.org/images/core/5.5/block-patterns-poster.png">
     118                        <source src="https://s.w.org/images/core/5.5/block-patterns.mp4" type="video/mp4" />
     119                        <source src="https://s.w.org/images/core/5.5/block-patterns.webm" type="video/webm" />
    120120                    </video>
    121121                    <figcaption id="about-block-pattern" class="screen-reader-text"><?php _e( 'Video: In the editor, the block inserter shows two tabs, Blocks and Patterns. The Patterns tab is selected. There are different block layouts in this tab. After scrolling through options including buttons and columns, a pattern called "Large header with a heading" is chosen. This adds a cover block, which is customized with a photo and the name of the WordPress 5.5 jazz musician.' ); ?></figcaption>
    123123                <hr />
    124124                <figure aria-labelledby="about-image-editor" class="about__image">
    125                     <video controls poster="https://make.wordpress.org/core/files/2020/07/image-editor-poster.png">
    126                         <source src="https://make.wordpress.org/core/files/2020/07/image-editor.mp4" type="video/mp4" />
     125                    <video controls poster="https://s.w.org/images/core/5.5/inline-image-editing-poster.png">
     126                        <source src="https://s.w.org/images/core/5.5/inline-image-editing.mp4" type="video/mp4" />
     127                        <source src="https://s.w.org/images/core/5.5/inline-image-editing-1.webm" type="video/webm" />
    127128                    </video>
    128                     <figcaption id="about-image-editor" class="screen-reader-text"><?php _e( 'Video: In the new image editor, an image icon gets dragged and dropped into the space, which turns blue to accept the upload. The image expands to fill the editor. Dragging a handle on the right side of the image widens it to scale and resizes the editor to fit. Next the cursor moves to a text area below the image and clicks to bring up standard block text-editing tools and write a caption for the image. Clicking in the image dismisses the text tools, and the cursor now moves to a toolbar at the top of the image space. A click on the Crop icon reveals a dropdown set of common aspect ratios; lingering briefly on one choice demos the crop. Applying it requires a confirmation click in the toolbar.' ); ?></figcaption>
     129                    <figcaption id="about-image-editor" class="screen-reader-text"><?php _e( 'Video: An image is added with an image block. In the block toolbar, an icon called "Crop" is selected, which changes the toolbar to show image resizing tools. First, zoom is used to zoom into the center of the image. Next, aspect ratio is clicked. This shows a dropdown of common aspect ratios. Square is chosen, and the image is moved within the new square outline. The crop is completed by clicking "Apply."' ); ?></figcaption>
    129130                </figure>
    130131            </div>
  • trunk/src/wp-admin/css/about.css

    r48736 r48783  
    3131    --accent-3: #b04329;
    3232    /* Navigation colors. */
    33     --nav-background: var( --subtle-background );
    34     --nav-border: var( --accent-1 );
     33    --nav-background: var(--subtle-background);
     34    --nav-border: var(--accent-1);
    3535    --nav-color: var(--accent-3);
    3636    --nav-current: var(--accent-3);
    100100.about__section {
    101     background: #f3f4f5;
     101    background: #fff;
    102102    background: var(--background);
    103103    clear: both;
Note: See TracChangeset for help on using the changeset viewer.