WordPress.org

Make WordPress Core

Opened 8 months ago

Closed 7 months ago

#46901 closed task (blessed) (fixed)

5.2 About Page

Reported by: desrosj Owned by: karmatosed
Milestone: 5.2 Priority: normal
Severity: normal Version:
Component: Help/About Keywords: has-patch has-screenshots commit dev-reviewed
Focuses: Cc:
PR Number:

Description

It's time to design and write the About page for version 5.2!

Attachments (42)

46901.diff (14.3 KB) - added by pento 7 months ago.
desktop.png (1.4 MB) - added by pento 7 months ago.
tablet.png (1.3 MB) - added by pento 7 months ago.
large-phone.png (1.7 MB) - added by pento 7 months ago.
small-phone.png (743.9 KB) - added by pento 7 months ago.
46901.2.diff (14.6 KB) - added by pento 7 months ago.
duplicate-text.jpg (51.8 KB) - added by birgire 7 months ago.
46901.3.diff (14.6 KB) - added by pento 7 months ago.
desktop.2.png (1.4 MB) - added by pento 7 months ago.
46901.4.diff (14.6 KB) - added by pento 7 months ago.
about links.png (73.3 KB) - added by afercia 7 months ago.
Links that could be improved
46901-tabs.diff (1.1 KB) - added by afercia 7 months ago.
Restore previous tabs styles for the About & Co. pages
20190429233810.png (52.5 KB) - added by ixkaito 7 months ago.
The bottom border will disappear when you move the mouse over the active tab on a small screen.
46901-tabs.2.diff (1.3 KB) - added by ixkaito 7 months ago.
46901-tabs.3.diff (1.8 KB) - added by SergeyBiryukov 7 months ago.
46901.5.diff (3.5 KB) - added by desrosj 7 months ago.
46901-tabs.4.diff (1.6 KB) - added by afercia 7 months ago.
46901-links.diff (1.2 KB) - added by afercia 7 months ago.
about-images.zip (228.7 KB) - added by melchoyce 7 months ago.
2x images
about-images-svg.zip (534.2 KB) - added by melchoyce 7 months ago.
SVG versions of the images
46901.6.diff (1.7 KB) - added by jeremyfelt 7 months ago.
Make the display of Site Health admin links conditional on capability
46901.patch (4.0 KB) - added by melchoyce 7 months ago.
46901.remove-tags-from-translatable-strings.diff (715 bytes) - added by SergeyBiryukov 7 months ago.
46901-layout.diff (23.0 KB) - added by ryelle 7 months ago.
46901-remaining.diff (23.4 KB) - added by desrosj 7 months ago.
extra-space.png (407.3 KB) - added by desrosj 7 months ago.
46901-remaining.2.diff (23.3 KB) - added by SergeyBiryukov 7 months ago.
46901-remaining.3.diff (23.6 KB) - added by SergeyBiryukov 7 months ago.
about_maintain-wordpress-cropped.svg (1023.8 KB) - added by ryelle 7 months ago.
46901-remaining.4.diff (24.5 KB) - added by jeremyfelt 7 months ago.
minor things in the responsive view.jpg (192.7 KB) - added by afercia 7 months ago.
about page ie 11.png (158.4 KB) - added by afercia 7 months ago.
Internet Explorer 11
about_maintain-wordpress-cropped.png (178.7 KB) - added by SergeyBiryukov 7 months ago.
46901-ie11-img-fix.diff (453 bytes) - added by ianbelanger 7 months ago.
Fixes cutoff images in ie11 grid
46901-ie11-images-fixed.PNG (103.1 KB) - added by ianbelanger 7 months ago.
IE11 images after 46901-ie11-img-fix.diff
46901-ie11-img-fix-maintain-wordpress-v2-cdn.diff (1.2 KB) - added by SergeyBiryukov 7 months ago.
macos-firefox-desktop.png (556.3 KB) - added by desrosj 7 months ago.
macos-firefox-mobile.png (400.1 KB) - added by desrosj 7 months ago.
macos-safari-desktop.png (527.2 KB) - added by desrosj 7 months ago.
macos-safari-mobile.png (339.1 KB) - added by desrosj 7 months ago.
49601.diff (1.2 KB) - added by desrosj 7 months ago.
46901.7.diff (1.5 KB) - added by desrosj 7 months ago.

Change History (119)

#1 follow-up: @karmatosed
8 months ago

Thanks for creating this ticket @desrosj. Let's get this about page work underway! I'd love to know what others think but my suggested plan for this would be:

  • Within few days: Find out what copy / sections we plan to call out. cc @chanthaboune looping you in here to co-ordinate that.
  • Wednesday's design meeting (tomorrow): show this ticket and ask for contributors to get involved, noting the shorter time frame now.
  • End of weekend: Have a skeleton version with some suggested images in style previously used.

I am happy to co-ordinate this and would love to have others involved if they are interested.

@desrosj do you know what the final deadline for this to be ready for would be?

#2 @karmatosed
8 months ago

  • Owner set to karmatosed
  • Status changed from new to assigned

This ticket was mentioned in Slack in #design by karmatosed. View the logs.


7 months ago

#4 in reply to: ↑ 1 @chanthaboune
7 months ago

  • Within few days: Find out what copy / sections we plan to call out. cc @chanthaboune looping you in here to co-ordinate that.

I'll get an outline pulled together that we can all work from.

#6 @karmatosed
7 months ago

There is currently an in progress design, thanks to @melchoyce for assisting there.

https://www.figma.com/file/LrjiQZDts99EakxvZ6YcuMIr/About-Page?node-id=3%3A47089

The images up aren't final but they will do as placeholders. It is our understanding images can be done up until RC 2. If that's not the case it would be great to know @pento

@pento
7 months ago

@pento
7 months ago

@pento
7 months ago

@pento
7 months ago

@pento
7 months ago

@pento
7 months ago

#7 follow-up: @pento
7 months ago

  • Keywords has-patch has-screenshots added; needs-patch needs-design removed

Thank you for wrangling the copy and design, everyone!

In 46901.2.diff:

  • Adds the text from this doc.
  • Implements the design from this Figma project.
  • Adds placeholder images exported from the current design.
  • Implements CSS rules in about.css for alignleft images, mirroring the rules for alignright.
  • Tidy up some older bits and pieces from about pages of releases past.

I've also attached screenshots of the about page as viewed on different size devices. (Minor note: I noticed I accidentally had the word "Updates" in "Accessibility Updates" selected when I took a couple of these screenshots. That highlighting isn't a visual bug.)

@melchoyce, @karmatosed, @chanthaboune: Could you please review it when you have a moment?

#8 @melchoyce
7 months ago

There are some minor layout/CSS updates I'll want to tweak, and of course we need to get you final images, but it looks good for RC1.

#9 in reply to: ↑ 7 ; follow-ups: @chanthaboune
7 months ago

Just two things and neither of them seem major, @pento.

  • The title for the new body hook in the Developer Happiness section is twice as long as any other title. I'll think about how to refine it between now and Monday.
  • The tabs look strange on the small screen, but if that's usual then I wouldn't consider it a blocker.

#10 in reply to: ↑ 9 @chanthaboune
7 months ago

  • The title for the new body hook in the Developer Happiness section is twice as long as any other title. I'll think about how to refine it between now and Monday.

Just kidding! @earnjam and I thought about it now. Let's change "New Body Hook for Themes and Plugins" to read "New Body Tag Hook".

Last edited 7 months ago by chanthaboune (previous) (diff)

#11 @earnjam
7 months ago

Was just about to call that out. @pento can you correct the Building JS blurb to read:

With the addition of webpack and Babel configurations in the @wordpress/scripts package, developers won't have to worry about setting up complex build tools to write modern JavaScript.

@pento
7 months ago

@pento
7 months ago

#12 @pento
7 months ago

Thank you for the reviews, everyone!

In 46901.3.diff:

  • Change the wp_body_open heading to "New Body Tag Hook".
  • Add the correct text for the "Building JavaScript" section.
  • Switch the Developer Happiness section to be two columns, instead of four.

I've attached a new screenshot.

#13 @birgire
7 months ago

I'm not sure about this part:

 <h4><a href="https://www.google.com/url?q=https://make.wordpress.org/core/2019/03/25/building-javascript/"><?php _e( 'Building JavaScript' ); ?></a></h4>

in 46901.3.diff

Would have expected:

 <h4><a href="https://make.wordpress.org/core/2019/03/25/building-javascript/"><?php _e( 'Building JavaScript' ); ?></a></h4>

I guess this is a leftover from Google Docs?

Last edited 7 months ago by birgire (previous) (diff)

#14 @pento
7 months ago

Good catch, thanks @birgire! You're correct, it's a Google Docs copy/pasta problem.

@pento
7 months ago

#15 @pento
7 months ago

46901.4.diff removes the google.com redirect link.

This ticket was mentioned in Slack in #core by pento. View the logs.


7 months ago

#17 @pento
7 months ago

In 45271:

Admin: Add the text for the WordPress 5.2 About page.

This changes includes placeholder images for now, they'll be replaced by the final images before final release.

Props chanthaboune, melchoyce, karmatosed, pento, marybaum, birgire, earnjam, andreamiddleton.
See #46901.

#18 follow-up: @afercia
7 months ago

I'd like to suggest to improve a bit some of the links in the about page (see screenshot attached below). The link destination and purpose should be clear also when reading the link text out of context.

For example:

  • The "Site Health" link doesn't inform me it points to the 5.1 release post. It just tells me it's about something generically related to "Site Health". Making the link include a more meaningful part of the sentence could help, e.g. <a ...>the Site Health features introduced in 5.1</a>
  • Same for "status" and "debug": when read out of context, they don't help so much. Better link text might be:
    • <a ...>Check your site status</a>
    • <a ...>learn how to debug issues</a>

@afercia
7 months ago

Links that could be improved

#19 in reply to: ↑ 9 @SergeyBiryukov
7 months ago

Replying to chanthaboune:

The tabs look strange on the small screen, but if that's usual then I wouldn't consider it a blocker.

Related: #47016

#20 @afercia
7 months ago

The tabs look strange on the small screen

Oh yes, I see now there's a difference compared to 5.1.1. This comes in part from the markup change in [44905] / #43398 and in part from the various changes to the line-height values in core to make them unit-less. The point is, when using line-height unit-less value and then the font-size changes in the responsive view, the line-height computed value won't be the expected one. It needs to be set again with a proper value based on the responsive font-size. /Cc @ianbelanger

Patch incoming.

Last edited 7 months ago by afercia (previous) (diff)

@afercia
7 months ago

Restore previous tabs styles for the About & Co. pages

#21 @afercia
7 months ago

46901-tabs.diff restores the spacing between tabs and the previous size. Actually, the bigger tabs weren't that bad, but I've restored the previous size anyways.

@ixkaito
7 months ago

The bottom border will disappear when you move the mouse over the active tab on a small screen.

#22 @ixkaito
7 months ago

46901-tabs.2.diff restores the spacing between tabs and the previous size, and fixes the issue of active tabs on hover, and I don't think we need h1, h2, h3 and nav before .nav-tab according to line 2167 on wp-admin/css/common.css.

Last edited 7 months ago by ixkaito (previous) (diff)

#23 @karmatosed
7 months ago

The Figma file now has the final images to include. It would be great to get them added as a patch. cc @chanthaboune. Props to @cathibosco1.

Last edited 7 months ago by karmatosed (previous) (diff)

#24 @afercia
7 months ago

Thanks @ixkaito good catch! Looks like the bottom border glitch is a pre-existing issue, as it happens also on WordPress 5.1 and previous versions: it's a good improvement and I guess it can be included :)

I've noticed one more thing: as a consequence of the changes to the line-height values to make them unit-less, see #45243, the tabs are now 1 px taller. The new value:

 	font-size: 14px;
- 	line-height: 24px;
+ 	line-height: 1.8;

produces a computed value of 25.2 pixels. Not sure what the math behind 1.8 is. The new value should be 1.71428571. /Cc @ianbelanger

#25 @ixkaito
7 months ago

@afercia Thanks for your follow-up. If 1.8 is correct, the line height of .about-wrap .nav-tab will be 1.4.

#26 @desrosj
7 months ago

Related: #47075.

#27 in reply to: ↑ 18 @chanthaboune
7 months ago

I'm fine with both of these changes, @afercia

Replying to afercia:

I'd like to suggest to improve a bit some of the links in the about page (see screenshot attached below). The link destination and purpose should be clear also when reading the link text out of context.

For example:

  • The "Site Health" link doesn't inform me it points to the 5.1 release post. It just tells me it's about something generically related to "Site Health". Making the link include a more meaningful part of the sentence could help, e.g. <a ...>the Site Health features introduced in 5.1</a>
  • Same for "status" and "debug": when read out of context, they don't help so much. Better link text might be:
    • <a ...>Check your site status</a>
    • <a ...>learn how to debug issues</a>

#28 @SergeyBiryukov
7 months ago

46901-tabs.3.diff fixes a few more discrepancies caused by [44905] and [45243], restoring the previous appearance and fixing both #47075 and the bottom border glitch.

@afercia: Can I get a dev-reviewed? :)

This ticket was mentioned in Slack in #core by desrosj. View the logs.


7 months ago

@desrosj
7 months ago

#30 @desrosj
7 months ago

46901.5.diff adds the CDN versions of the images to @SergeyBiryukov's 46901-tabs.3.diff patch. Props @tellyworth for getting those committed and pushed to the CDN.

#31 follow-up: @afercia
7 months ago

@SergeyBiryukov 46901-tabs.3.diff fixes the tabs in the "About" pages but also changes the tabs in Appearance > Menus, on the multisite pages, or the ones used by plugins. Also, I'm not sure there's the need for some of the changes there, unless I'm missing something:

  • not sure there's the need to add .about-wrap nav to .about-wrap h2 {} in about.css, as those CSS properties either don't apply to the tabs links or are overridden by other rules
  • line-height: 1.33333333;: while this fixes the tabs in the About page, it makes the other tabs smaller. This line-height needs to be the equivalent to 24px with any font-size
  • not sure there's the need for .wrap nav.nav-tab-wrapper as there's already .nav-tab-wrapper
  • not sure there's the need for higher specificity for .wrap nav .nav-tab
  • we should re-add the fix for the bottom border: the rule should override the white border for hover / focus / focus:active.

I've tried to address these points in 46901-tabs.4.diff. I guess at this point of the release cycle we should try to be very conservative and change only what needs to be changed. Some testing would be nice :) When testing, please check also the tabs in Appearance > Menus and tabs added by plugins, for example Yoast SEO, comparing with the tabs in WordPress 5.1.

@afercia
7 months ago

#32 @afercia
7 months ago

@chanthaboune thanks, 46901-links.diff changes the links.

This ticket was mentioned in Slack in #core by jorbin. View the logs.


7 months ago

#34 @jorbin
7 months ago

In 45274:

Admin: Add some additional clarity to some about page links

It's important for links to have enough information in them in order to be clearly actionable. Destination and purpose should be clear. For example, debug isn't nearly as useful as learn how to debug issues.

This was signed off on by chanthaboune and jorbin.

Props afercia.
See: #46901.

@melchoyce
7 months ago

2x images

@melchoyce
7 months ago

SVG versions of the images

@jeremyfelt
7 months ago

Make the display of Site Health admin links conditional on capability

@melchoyce
7 months ago

#35 @melchoyce
7 months ago

46901.patch make some minor layout adjustments and updates the images to use SVGs. There are a few more changes I'd like to make, but this is good enough for RC2.

@kjellr should receive props for this patch.

#36 follow-up: @jeremyfelt
7 months ago

The "Check your site status" and "learn how to debug issues" links on the about page are only available to users with specific capabilities. 46901.6.diff adds a capability check for that sentence.

#37 @kjellr
7 months ago

Just a minor heads up in case someone ends up having some time for this: Ideally, the Health Check and Error Protection feature-sections would be using our two-col class, and the text inside them would be aligned vertically using the flexbox styles for columns that are in the stylesheet.

If someone were to take that on, it's worth noting that for now, the columns in those sections are not inheriting our columns styles at all. This is because the columns style rule uses [class$="-col"] (it looks for a class attribute that ends in -col). That means the order of the classnames in the HTML attribute matters if we want that style to be picked up. The Health Check and Error Protection sections have four total classnames, and their current one-col class is sandwiched in between the others. If we want to have the columns style rules kick in, we'd first need to rearrange the class declarations so that the -col is at the end. 👍

Last edited 7 months ago by kjellr (previous) (diff)

#38 @man4toman
7 months ago

We have this paragraph in about page:

This administrator-focused update will let you safely fix or manage fatal errors without requiring developer time. It features better handling of the so-called “white screen of death,” and a way to enter recovery mode, which pauses error-causing plugins or themes.

I'm not sure about this, but is it correct?
...the so-called “white screen of death,” and...

Or it must be:
...the so-called “white screen of death”, and...

#39 follow-up: @ramiy
7 months ago

Please try to avoid using HTML tags in translation strings, it's hard to translate strings to LTR languages (like Hebrew) with English tags.

We can replace:

5.2 introduces a <code>%1$s</code> hook, which lets themes support injecting code right at the beginning of the <code>%2$s</code> element.

With:

5.2 introduces a %1$s hook, which lets themes support injecting code right at the beginning of the %2$s element.

This ticket was mentioned in Slack in #core by desrosj. View the logs.


7 months ago

#41 in reply to: ↑ 31 @SergeyBiryukov
7 months ago

Replying to afercia:

46901-tabs.3.diff fixes the tabs in the "About" pages but also changes the tabs in Appearance > Menus, on the multisite pages, or the ones used by plugins.

Thanks, I forgot about the other tabs :) 46901-tabs.4.diff looks good.

This ticket was mentioned in Slack in #core by chanthaboune. View the logs.


7 months ago

#43 in reply to: ↑ 39 @SergeyBiryukov
7 months ago

Replying to ramiy:

Please try to avoid using HTML tags in translation strings, it's hard to translate strings to LTR languages (like Hebrew) with English tags.

Good catch! Indeed, that's a regression from our own i18n best practices.

46901.remove-tags-from-translatable-strings.diff addresses that, needs a second committer's review.

@ryelle
7 months ago

#44 @ryelle
7 months ago

46901-layout.diff switches the about page to using CSS grid, but it’s using properties/fallbacks for IE11. The point of this rewrite was to make the about page’s structural CSS a little more obvious, and remove the styles for elements that are no longer on this page (videos, mejs elements, etc – these can be added back if we end up using them again). Hopefully this will be easier for others to jump into in the future :)

There are now 4 classes for 1-4 column grids (no more “class ends with col”!). They all default to 760px wide. Each has-x-columns can only have one row, for compat with IE11. These break at 782px into 2 columns at most, and at 600px into 1 column.

  • has-1-columns
  • has-2-columns
  • has-3-columns
  • has-4-columns

You can also add .is-wider-right or .is-wider-left to the has-2-columns container, to make it one-third/two-thirds. This stays two column until 480px.

There are also “width” classes. The default for headline-feature is 680, and can be increased to 760 with is-wide. is-fullwidth can be used to make it 100% (the container stops at 1200, so it will not be larger than that).

Alignment classes: we have vertical and horizontal alignment classes. aligncenter will center text, alignleft & alignright float elements. is-vertically-aligned-top, is-vertically-aligned-center, and is-vertically-aligned-bottom assume a flex or grid context, but they’ll align to the top/center/bottom of the container.

@melchoyce You'll want to check the spacing/alignment of things on the about page and the other pages in the section (credits, freedoms).

#45 @melchoyce
7 months ago

You'll want to check the spacing/alignment of things on the about page and the other pages in the section (credits, freedoms).

Everything looks perfect 👍

This ticket was mentioned in Slack in #core by afercia. View the logs.


7 months ago

#47 @desrosj
7 months ago

In 45276:

Help/About: Fix tab display issues.

This change restores About page tab heights and fixes bugs with the tab bottom border caused by [44905] and [45243].

Reviewed by SergeyBiryukov and desrosj.

Props ixkaito, ianbelanger, afercia, SergeyBiryukov.
See #46901.
Fixes #47075.

@desrosj
7 months ago

#48 @desrosj
7 months ago

46901-remaining.diff combines the remaining changes on the ticket (46901-layout.diff & 46901.remove-tags-from-translatable-strings.diff) and updates the image URLs to point to the CDN versions (props @tellyworth).

@ryelle This looks great! Thanks for working on this.

I am seeing one issue, though. When using the CDN versions of the images, the top image is small and there is a large space between the bottom of the image and the next section on the page. After this is fixed, this is good to go, IMO.

#49 @SergeyBiryukov
7 months ago

46901-remaining.2.diff uses the s.w.org domain for images and avoids unintentional string change caused by removing curly quotes from “white screen of death,” in the previous patch.

Replying to man4toman:

I'm not sure about this, but is it correct?
...the so-called “white screen of death,” and...

Or it must be:
...the so-called “white screen of death”, and...

It's correct in American English. That said, it's inconsistent with a couple of other strings in core:

  • If you select "Remember Me", your login will persist for two weeks.
  • Once you hit “Confirm Deletion”, the user will be permanently removed.

I'm ambivalent on whether the comma placement should be changed here.

#50 follow-up: @afercia
7 months ago

It's correct in American English.

Not sure, as that rule applies only to direct quotes (as in when quoting someone) or citations, not to normal sentences :) example:

“There was a storm last night,” Paul said.

Instead, the following is not a direct quote, nor a citation:

the so-called “white screen of death,” and

#51 in reply to: ↑ 50 @SergeyBiryukov
7 months ago

Replying to afercia:

It's correct in American English.

Not sure, as that rule applies only to direct quotes (as in when quoting someone) or citations, not to normal sentences :)

Thanks! In that case, 46901-remaining.3.diff fixes the comma placement and removes an extra space while we're at it.

#52 @man4toman
7 months ago

Thanks @afercia, that is exactly what I wanted to say.

#53 @ryelle
7 months ago

I am seeing one issue, though. When using the CDN versions of the images, the top image is small and there is a large space between the bottom of the image and the next section on the page. After this is fixed, this is good to go, IMO.

@desrosj Looks like the image on the CDN isn't cropped correctly. The others seem fine, but this one has extra space around it. I've just uploaded a new SVG, it should be fine once it's swapped out.

#54 follow-ups: @desrosj
7 months ago

Thank you, @ryelle!

In the interest of getting RC2 out, I have uploaded the latest PNG from above for that image to the Make Core blog to include instead (this is the current approach implemented for RC1). We can update the image after RC2 when someone with the needed access to push to the CDN is available.

#55 in reply to: ↑ 36 @jeremyfelt
7 months ago

Replying to jeremyfelt:

The "Check your site status" and "learn how to debug issues" links on the about page are only available to users with specific capabilities. 46901.6.diff adds a capability check for that sentence.

46901-remaining.4.diff adds the cap checks from this patch in with the other remaining work.

#56 @jeremyfelt
7 months ago

All of the changes from 46901-remaining.4.diff (that I didn't add) look good for commit!

#57 @afercia
7 months ago

Noticed two very small things in the responsive view. Not blockers, they're really minor :) If there's time after RC2, would be nice to try to improve them though. See the attached screenshot:

  • On the left: because of their placement, these two images get displayed vertically stacked which is a bit weird to see. Really minor, I guess we can live with that
  • On the right: the vertical spacing between sections is a bit inconsistent, maybe could be improved a bit but I guess we can live with that as well

Everything else looks good to me. Note related to accessibility: @audrasjb we forgot to use aria-current on the new <nav> active items :) I guess that should be improved in 5.2.1, though it's just about the addition of an attribute and wouldn't impact anything even if we're in RC2.

#58 @desrosj
7 months ago

Thanks, @afercia! Those are great to point out, but I think we can tackle those prior to release, as they are likely very minor CSS adjustments.

#59 @desrosj
7 months ago

In 45278:

Help/About: Polish the About page for 5.2.

  • The About page now uses a CSS grid to layout its design, making the page’s structure more obvious and hopefully easier for contributors in the future.
  • Removes some code that is no longer used (such as videos, mejs elements, etc.).
  • Update images.
  • Unnecessary HTML is removed from a string on the page. This was a regression.
  • Only users with the correct capability should be instructed to check their site status.
  • Fixes the placement of commas.

Reviewed by melchoyce, afercia, jeremyfelt, and desrosj.

Props ryelle, melchoyce, cathibosco1, man4toman, SergeyBiryukov, afercia, ramiy, kjellr, tellyworth, earnjam, andreamiddleton, marybaum.
See #46901.

#60 @afercia
7 months ago

Noting that in Internet Explorer 11 the grid layout works decently. Just a couple images look a bit "cut-off" by their containers. I'd tend to think things in IE 11 don't necessarily need to look "pretty" :) But if there's time to fix it after RC2, that would be nice. See attached screenshot.

@afercia
7 months ago

Internet Explorer 11

#61 in reply to: ↑ 54 @Otto42
7 months ago

Replying to desrosj:

Thank you, @ryelle!

In the interest of getting RC2 out, I have uploaded the latest PNG from above for that image to the Make Core blog to include instead (this is the current approach implemented for RC1). We can update the image after RC2 when someone with the needed access to push to the CDN is available.

For the future, can we not use the CDN URLs of the images until the actual release?

See, s.w.org is essentially a mirror of the main wordpress.org site. It's a reverse caching proxy, basically. So, once we reference a file on there, thus making it show up on the CDN, then we can't actually "fix" it. All we can do is to use a different filename, like adding ?1 to the URL or something like that.

So for RCs and betas and other things, it's fine for us to use the wordpress.org URLs instead of the s.w.org URLs, especially when the files are not finalized and subject to change like has been in this ticket.

I can update the files, anybody with admin over here can do it, but I can't clear the CDN once it's been used. All you can do is to add ?1, ?2 and so on to their URLs.

If we're sure these files are final, let me know, and I'm happy to push them onto wordpress.org and tell you what URLs to use.

cc @tellyworth

#62 in reply to: ↑ 54 @SergeyBiryukov
7 months ago

Replying to desrosj:

In the interest of getting RC2 out, I have uploaded the latest PNG from above for that image to the Make Core blog to include instead (this is the current approach implemented for RC1). We can update the image after RC2 when someone with the needed access to push to the CDN is available.

This appears to be the same file that's already available on the CDN: https://s.w.org/images/core/5.2/about_maintain-wordpress.png.

I'm attaching the new one: about_maintain-wordpress-cropped.png, made from about_maintain-wordpress-cropped.svg.

@ianbelanger
7 months ago

Fixes cutoff images in ie11 grid

#63 @ianbelanger
7 months ago

46901-ie11-img-fix.diff should fix the issue of the svg's being cutoff in ie11.

I tested the solution on a Windows 10 machine, in Chrome, FireFox, IE11 and Edge. Due to the changes contained in the patch, it should probably be tested in other OS's and browsers.

@ianbelanger
7 months ago

IE11 images after 46901-ie11-img-fix.diff

#64 @SergeyBiryukov
7 months ago

46901-ie11-img-fix-maintain-wordpress-v2-cdn.diff includes 46901-ie11-img-fix.diff and uses a CDN URL for the last remaining image, now properly cropped.

Last edited 7 months ago by SergeyBiryukov (previous) (diff)

@desrosj
7 months ago

#65 @desrosj
7 months ago

  • Keywords needs-dev-review added

This looks good to go. I did some MacOS browser testing. Everything looks good (attached Firefox and Safari screenshots).

49601.diff changes the image format from PNG to SVG, which is the format we should use on the page. This file was uploaded last night to the CDN.

Will ping in Slack for another set of committer eyes before getting this in.

Edit Oops, wrong ticket number in my patch. But patch contains correct changes.

Last edited 7 months ago by desrosj (previous) (diff)

This ticket was mentioned in Slack in #core by desrosj. View the logs.


7 months ago

#67 @audrasjb
7 months ago

The latest patch works fine on my side, if it can help.

#68 @afercia
7 months ago

Yep, latest patch 49601.diff looks good to me as well.

#69 @desrosj
7 months ago

  • Keywords dev-reviewed commit added; needs-dev-review removed

#70 @desrosj
7 months ago

In 45287:

Help/About: Final 5.2 about page updates.

Use final image URLs and fix a bug in IE11 where images were being cut off.

Props afercia, SergeyBiryukov, ianbelanger, desrosj, audrasjb.
See #46901.

#71 @desrosj
7 months ago

  • Resolution set to fixed
  • Status changed from assigned to closed

In 45288:

Help/About: Final 5.2 about page updates.

Use final image URLs and fix a bug in IE11 where images were being cut off.

Reviewed by afercia, desrosj.
Merges [45287] to the 5.2 branch.

Props afercia, SergeyBiryukov, ianbelanger, desrosj, audrasjb.
Fixes #46901.

This ticket was mentioned in Slack in #core by ocean90. View the logs.


7 months ago

#73 @desrosj
7 months ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

@desrosj
7 months ago

#74 @desrosj
7 months ago

  • Keywords needs-dev-review added; dev-reviewed commit removed

46901.7.diff updates the tagline on the Credits and Freedoms pages.

One thing to note, the version was hard coded on the about page and did not use the placeholder. To prevent a string change, it should be hard coded on Freedoms and Credits. This can be fixed after release.

#75 @ocean90
7 months ago

  • Keywords commit dev-reviewed added; needs-dev-review removed

46901.7.diff: We could drop the printf() call but let's do that after the release. 🚢 it.

#76 @desrosj
7 months ago

In 45292:

Help/About: Update the 5.2 tagline on Freedoms and Credits.

Props ocean90.
See #46901.

#77 @desrosj
7 months ago

  • Resolution set to fixed
  • Status changed from reopened to closed

In 45293:

Help/About: Move 5.2 tagline to Freedoms and Credits.

Reviewed by ocean90, SergeyBiryukov.
Props ocean90.
Fixes #46901.

Note: See TracTickets for help on using tickets.