Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
21 commits
Select commit Hold shift + click to select a range
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
53 changes: 30 additions & 23 deletions src/wp-admin/about.php
Comment thread
joedolson marked this conversation as resolved.
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
$title = _x( 'About', 'page title' );

list( $display_version ) = explode( '-', wp_get_wp_version() );
$display_major_version = '7.0';
$display_major_version = '7.1';

$release_notes_url = sprintf(
/* translators: %s: WordPress version number. */
Expand All @@ -34,6 +34,13 @@
sanitize_title( $display_major_version )
);

list( $display_version ) = explode( '-', get_bloginfo( 'version' ) );
$badge_alt_text = sprintf(
/* translators: %s: Version number. */
__( 'WordPress %s' ),
$display_version
);

require_once ABSPATH . 'wp-admin/admin-header.php';
?>
<div class="wrap about__container">
Expand Down Expand Up @@ -62,67 +69,67 @@

<div class="about__section">
<div class="column is-left-padding-zero is-right-padding-zero">
<h2><?php _e( 'Welcome to WordPress 7.0' ); ?></h2>
<p class="is-subheading"><?php _e( 'WordPress 7.0 introduces the foundation for AI across the platform, letting you connect your preferred provider and put it to work across your site. Edit more simply by dropping in layouts and swapping content without diving into blocks. The navigation overlay now taps into the full potential of blocks, and reviewing historical changes is easier with a visual comparison.' ); ?></p>
<h2><?php _e( 'Welcome to WordPress 7.1' ); ?></h2>
<p class="is-subheading"><?php _e( 'WordPress 7.1 makes styling and editing easier. Style how blocks look across screen sizes and how they respond to hover, focus, and active states, all without writing custom CSS. A streamlined media editor brings cropping, rotation, and metadata editing together in one workflow. Notes now support rich text and @mentions, and the admin bar travels with you into the Site Editor and block editor, so the tools you rely on stay with you wherever you&#8217;re working.' ); ?></p>
</div>
</div>

<div class="about__section has-2-columns">
<div class="column is-vertically-aligned-center is-left-padding-zero">
<h3><?php _e( 'Design your navigation overlay' ); ?></h3>
<h3><?php _e( 'Apply responsive styles' ); ?></h3>
<p>
<strong><?php _e( 'A dedicated canvas for your menu.' ); ?></strong><br />
<?php _e( 'Build the menu overlay you want visitors to see. Go beyond a simple list of links: add columns, increase the font size, and align everything to your liking. Start from a pre-built template, or design your own from scratch.' ); ?>
<strong><?php _e( 'Style content your way, on every screen.' ); ?></strong><br />
<?php _e( 'WordPress 7.1 takes a major step toward built-in responsive design. Set how a block looks at different screen sizes directly in the editor, for both Global Styles and individual blocks, all without writing custom CSS.' ); ?>
</p>
</div>
<div class="column is-vertically-aligned-center is-right-padding-zero">
<div class="about__image">
<img src="https://s.w.org/images/core/7.0/about-feature-01.webp" alt="" height="436" width="436" />
<img src="https://s.w.org/images/core/7.1/about-feature-01.webp?ver=20260810" alt="" height="900" width="900" />
</div>
</div>
</div>

<div class="about__section has-2-columns">
<div class="column is-vertically-aligned-center is-left-padding-zero">
<div class="about__image">
<img src="https://s.w.org/images/core/7.0/about-feature-02.webp" alt="" height="436" width="436" />
<img src="https://s.w.org/images/core/7.1/about-feature-02.webp?ver=20260810" alt="" height="436" width="436" />
</div>
</div>
<div class="column is-vertically-aligned-center is-right-padding-zero">
<h3><?php _e( 'AI foundations' ); ?></h3>
<h3><?php _e( 'Admin bar, now in every editor' ); ?></h3>
<p>
<strong><?php _e( 'A centralized hub for your connections.' ); ?></strong><br />
<?php _e( 'The Connectors screen introduces a single hub for managing a range of external service integrations, including AI providers. Opt in by connecting your preferred AI provider, then put it to work across your site. The optional AI plugin adds a growing set of tools directly into the editor: create titles and excerpts, generate and edit images, and suggest alt text. Any plugin that needs to connect to an outside service can tap into this standardized connection management system, making it easy for users and developers alike.' ); ?>
<strong><?php _e( 'Consistent navigation, from dashboard to editor.' ); ?></strong><br />
<?php _e( ' The admin bar now stays with you as you move into the Site Editor and block editor, so you always know where you are. The admin bar also gets a small visual refresh.' ); ?>
</p>
</div>
</div>

<div class="about__section has-2-columns">
<div class="column is-vertically-aligned-center is-left-padding-zero">
<h3><?php _e( 'Visual revisions' ); ?></h3>
<h3><?php _e( 'A new way to crop' ); ?></h3>
<p>
<strong><?php _e( 'Scrub through every version of your page.' ); ?></strong><br />
<?php _e( 'Review your post&#8217;s revision history with a timeline slider and see exactly what changed in the document with visual markers, block by block. Find the version you want and restore it in one click.' ); ?>
<strong><?php _e( 'One dedicated workflow for editing your images.' ); ?></strong><br />
<?php _e( 'A new media editor modal replaces the old inline cropping tool, bringing freeform and aspect-ratio cropping, flip, precise rotation, and metadata editing together in a single streamlined workflow. The familiar Crop button still gets you there, now opening a dedicated space to crop, rotate, and adjust images before publishing.' ); ?>
</p>
</div>
<div class="column is-vertically-aligned-center is-right-padding-zero">
<div class="about__image">
<img src="https://s.w.org/images/core/7.0/about-feature-03.webp" alt="" height="436" width="436" />
<img src="https://s.w.org/images/core/7.1/about-feature-03.webp?ver=20260810" alt="" height="436" width="436" />
</div>
</div>
</div>

<div class="about__section has-2-columns">
<div class="column is-vertically-aligned-center is-left-padding-zero">
<div class="about__image">
<img src="https://s.w.org/images/core/7.0/about-feature-04.webp" alt="" height="436" width="436" />
<img src="https://s.w.org/images/core/7.1/about-feature-04.webp?ver=20260810" alt="" height="436" width="436" />
</div>
</div>
<div class="column is-vertically-aligned-center is-right-padding-zero">
<h3><?php _e( 'A simpler way to build with patterns' ); ?></h3>
<h3><?php _e( 'Inline notes with mentions and rich text' ); ?></h3>
<p>
<strong><?php _e( 'Patterns as single blocks.' ); ?></strong><br />
<?php _e( 'Drop a pattern onto your page and it behaves like one block, so you don’t have to hunt through nested blocks for the element you want to change. Swap the text and images, adjust styles from the inspector, and keep moving. For any advanced edits, a single click to "edit pattern" gives you access to all available tools.' ); ?>
<strong><?php _e( 'More ways to leave feedback.' ); ?></strong><br />
<?php _e( 'Notes now support rich text and @mentions. Add bold, italic, code, and links so feedback reads clearly. Type &#8220;@&#8221; to pull up a list of collaborators and tag the right person directly. Leave a note on a specific text selection instead of an entire block. Start more than one conversation on the same block. Collapse long notes to keep the margin tidy.' ); ?>
</p>
</div>
</div>
Expand All @@ -137,8 +144,8 @@
<path fill="#1e1e1e" fill-rule="evenodd" d="M4.91 27.75C4.91 17.395 13.455 9 24 9s19.091 8.395 19.091 18.75c0 3.909-1.22 7.542-3.305 10.548l-.488.702H8.702l-.488-.702A18.438 18.438 0 0 1 4.91 27.75ZM24 12.214c-8.736 0-15.818 6.956-15.818 15.536 0 2.943.832 5.692 2.277 8.036h27.082a15.25 15.25 0 0 0 2.277-8.036c0-8.58-7.082-15.536-15.818-15.536Z" clip-rule="evenodd"/>
</svg>
</div>
<h3><?php _e( 'Performance' ); ?></h3>
<p><?php _e( 'WordPress 7.0 improves the accuracy of image loading prioritization, preventing hidden images in navigation overlays or interactive blocks from degrading the loading of critical resources. On-demand block stylesheet loading in classic themes is more reliable, and the ability is added for scripts to depend on script modules to reduce render-blocking.' ); ?></p>
<h3><?php _e( 'Improved media handling' ); ?></h3>
<p><?php _e( 'Image compression, resizing, and thumbnail generation now happen in the browser, via a WebAssembly build of libvips, so large uploads won&#8217;t hit PHP memory limits or time out on shared hosts. This also frees up server CPU and memory, while producing smaller files for visitors. Media handling includes built-in support for AVIF, HEIC and HDR gain maps.' ); ?></p>
</div>
<div class="column is-right-padding-zero">
<div class="about__image">
Expand All @@ -147,7 +154,7 @@
</svg>
</div>
<h3><?php _e( 'Accessibility' ); ?></h3>
<p><?php _e( 'WordPress continues to polish accessibility across WordPress Core and Gutenberg, advancing the goals to meet accessibility standards. WordPress 7.0 includes fixes across the platform, improving media management, usability for voice control, and improvements to color contrast with the new admin color scheme. The editor ships with new blocks and improvements to editor navigation and interaction.' ); ?></p>
<p><?php _e( 'WordPress 7.1 continues to polish accessibility across WordPress Core and Gutenberg, advancing the goals to meet accessibility standards. In this release, high impact changes include the new accessible tooltips API, improved predictability for screen readers, and improved labeling in many places in the admin. The editor ships with new Tab and Playlist blocks and extensive improvements to editor navigation and interaction.' ); ?></p>
</div>
</div>

Expand Down Expand Up @@ -177,7 +184,7 @@

<div class="about__section has-3-columns">
<div class="column about__image is-vertically-aligned-top is-left-padding-zero">
<img src="<?php echo esc_url( admin_url( 'images/about-release-badge.svg?ver=7.0' ) ); ?>" alt="" height="280" width="280" />
<img src="https://s.w.org/images/core/7.1/about-release-badge.svg?ver=7.1" alt="<?php echo esc_attr( $badge_alt_text ); ?>" height="280" width="280" />
</div>
<div class="column is-vertically-aligned-center is-right-padding-zero" style="grid-column-end:span 2">
<h3>
Expand Down
11 changes: 0 additions & 11 deletions src/wp-admin/contribute.php
Original file line number Diff line number Diff line change
Expand Up @@ -12,22 +12,11 @@
// Used in the HTML title tag.
$title = __( 'Get Involved' );

list( $display_version ) = explode( '-', get_bloginfo( 'version' ) );
$header_alt_text = sprintf(
/* translators: %s: Version number. */
__( 'WordPress %s' ),
$display_version
);

require_once ABSPATH . 'wp-admin/admin-header.php';
?>
<div class="wrap about__container">

<div class="about__header">
<div class="about__header-image">
<img src="<?php echo esc_url( admin_url( 'images/about-release-logo.svg?ver=7.0' ) ); ?>" alt="<?php echo esc_attr( $header_alt_text ); ?>" />
</div>

<div class="about__header-title">
<h1>
<?php _e( 'Get Involved' ); ?>
Expand Down
11 changes: 0 additions & 11 deletions src/wp-admin/credits.php
Original file line number Diff line number Diff line change
Expand Up @@ -13,24 +13,13 @@
// Used in the HTML title tag.
$title = __( 'Credits' );

list( $display_version ) = explode( '-', get_bloginfo( 'version' ) );
$header_alt_text = sprintf(
/* translators: %s: Version number. */
__( 'WordPress %s' ),
$display_version
);

require_once ABSPATH . 'wp-admin/admin-header.php';

$credits = wp_credits();
?>
<div class="wrap about__container">

<div class="about__header">
<div class="about__header-image">
<img src="<?php echo esc_url( admin_url( 'images/about-release-logo.svg?ver=7.0' ) ); ?>" alt="<?php echo esc_attr( $header_alt_text ); ?>" />
</div>

<div class="about__header-title">
<h1>
<?php _e( 'Contributors' ); ?>
Expand Down
46 changes: 28 additions & 18 deletions src/wp-admin/css/about.css
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,8 @@

.about__container {
/* Section backgrounds */
--background: #ebe8e5;
--subtle-background: #ebe8e5;
--background: #3858e9;
--subtle-background: #f4f4f4;

/* Main text color */
--text: #1e1e1e;
Expand Down Expand Up @@ -278,10 +278,15 @@
.about__section.has-2-columns.is-wider-right,
.about__section.has-2-columns.is-wider-left,
.about__section.has-3-columns {
display: block;
grid-template-columns: 1fr;
margin-bottom: calc(var(--gap) / 2);
}

.about__section.has-2-columns:not(.is-wider-right,.is-wider-left) div:has(img) {
order: 1;
}
.about__section.has-2-columns:not(.is-wider-right,.is-wider-left) div:not(:has(img)) {
order: 0;
}
.about__section .column:not(.is-edge-to-edge) {
padding-top: var(--gap);
padding-bottom: var(--gap);
Expand Down Expand Up @@ -329,7 +334,7 @@

@media screen and (max-width: 600px) {
.about__section.has-2-columns {
display: block;
grid-template-columns: 1fr;
margin-bottom: var(--gap);
}

Expand Down Expand Up @@ -531,7 +536,7 @@
margin: calc(var(--gap) / 2) var(--gap);
height: 0;
border: none;
border-top: 4px solid var(--accent-3);
border-top: 6px solid var(--accent-3);
}

.about__container hr.is-small {
Expand Down Expand Up @@ -581,6 +586,10 @@
.about__container h3.is-larger-heading {
font-size: 2em;
}

.about__container h1 {
text-shadow: 0 0 2px var(--background);
}
}

/* 1.3 - Header */
Expand All @@ -596,48 +605,49 @@
padding-right: 26rem; /* Space for the background image. */
min-height: clamp(10rem, 25vw, 18.75rem);
border-radius: var(--border-radius);
background-image: url( "../images/about-header-default.webp?ver=20260514" );
background-image: url( "https://s.w.org/images/core/7.1/about-header-default.webp?ver=20260804" );
background-repeat: no-repeat;
background-position: right center;
background-size: cover;
background-color: var(--background);
color: var(--text-light);
margin-bottom: .25rem;
}

.credits-php .about__header {
background-image: url( "../images/about-header-credits.webp?ver=20260514" );
background-image: url( "https://s.w.org/images/core/7.1/about-header-credits.webp?ver=20260804" );
}

.freedoms-php .about__header {
background-image: url( "../images/about-header-freedoms.webp?ver=20260514" );
background-image: url( "https://s.w.org/images/core/7.1/about-header-freedoms.webp?ver=20260804" );
}

.privacy-php .about__header {
background-image: url( "../images/about-header-privacy.webp?ver=20260514" );
background-image: url( "https://s.w.org/images/core/7.1/about-header-privacy.webp?ver=20260804" );
}

.contribute-php .about__header {
background-image: url( "../images/about-header-get-involved.webp?ver=20260514" );
background-image: url( "https://s.w.org/images/core/7.1/about-header-get-involved.webp?ver=20260804" );
}

[dir="rtl"] .about__header {
background-image: url( "../images/about-header-default-rtl.webp?ver=20260514" );
background-image: url( "https://s.w.org/images/core/7.1/about-header-default-rtl.webp?ver=20260804" );
}

[dir="rtl"] .credits-php .about__header {
background-image: url( "../images/about-header-credits-rtl.webp?ver=20260514" );
background-image: url( "https://s.w.org/images/core/7.1/about-header-credits-rtl.webp?ver=20260804" );
}

[dir="rtl"] .freedoms-php .about__header {
background-image: url( "../images/about-header-freedoms-rtl.webp?ver=20260514" );
background-image: url( "https://s.w.org/images/core/7.1/about-header-freedoms-rtl.webp?ver=20260804" );
}

[dir="rtl"] .privacy-php .about__header {
background-image: url( "../images/about-header-privacy-rtl.webp?ver=20260514" );
background-image: url( "https://s.w.org/images/core/7.1/about-header-privacy-rtl.webp?ver=20260804" );
}

[dir="rtl"] .contribute-php .about__header {
background-image: url( "../images/about-header-get-involved-rtl.webp?ver=20260514" );
background-image: url( "https://s.w.org/images/core/7.1/about-header-get-involved-rtl.webp?ver=20260804" );
}

.about__header-image {
Expand All @@ -657,7 +667,7 @@
font-size: clamp(2rem, 20vw - 9rem, 4rem);
line-height: 1;
font-weight: 600;
color: var(--text);
color: var(--text-light);
}

.about-php .about__header-title h1,
Expand All @@ -676,7 +686,7 @@
padding: 0;
font-size: 1.6rem;
line-height: 1.15;
color: var(--text);
color: var(--text-light);
}

.about__header-navigation {
Expand Down
11 changes: 0 additions & 11 deletions src/wp-admin/freedoms.php
Original file line number Diff line number Diff line change
Expand Up @@ -18,22 +18,11 @@
// Used in the HTML title tag.
$title = __( 'Freedoms' );

list( $display_version ) = explode( '-', get_bloginfo( 'version' ) );
$header_alt_text = sprintf(
/* translators: %s: Version number. */
__( 'WordPress %s' ),
$display_version
);

require_once ABSPATH . 'wp-admin/admin-header.php';
?>
<div class="wrap about__container">

<div class="about__header">
<div class="about__header-image">
<img src="<?php echo esc_url( admin_url( 'images/about-release-logo.svg?ver=7.0' ) ); ?>" alt="<?php echo esc_attr( $header_alt_text ); ?>" />
</div>

<div class="about__header-title">
<h1>
<?php _e( 'The Four Freedoms' ); ?>
Expand Down
Binary file added src/wp-admin/images/about-feature-01.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/wp-admin/images/about-feature-02.webp
Comment thread
joedolson marked this conversation as resolved.

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This image doesn't render on the front for some reason.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm able to see this both locally and in Playground, so I'm going to assume there's some kind of cache issue here for you. 🤷

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

perfect

Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/wp-admin/images/about-feature-03.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/wp-admin/images/about-feature-04.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-credits-rtl.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-credits.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-default-rtl.webp

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do we need to flip this image as well?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Technically, the abstract 7.1 wouldn't make sense flipped, and @marko-srb adjusted the image so it would work either way. I don't have a strong opinion, and would prefer that somebody natively in an RTL language make that call...

Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-default.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-freedoms-rtl.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-freedoms.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-get-involved-rtl.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-get-involved.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-privacy-rtl.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-privacy.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Loading