About: Update Freedoms page to include illustrations

[melchoyce]

@cathibosco has made some great illustrations of the Four Freedoms on ​https://wordpress.org/about/. Let's bring that over to the admin Freedoms page.

(h/t @boemedia for the suggestion!)

[karmatosed]

Oh my these are lovely! Thanks for adding the work here everyone.

[tobifjellner]

Perhaps "Bill of Rights" could simply be reduced to "Your Rights"?

[melchoyce]

Update "Bill of Rights" to "Freedoms"

[gziolo]

I see background-image: url('https://s.w.org/wp-content/themes/pub/wporg-main/images/freedoms-2x.png'); - this is the only place where we use external URL for an image in CSS files, should we add a local copy?

[gziolo]

I also noticed when talking with @afercia that the size of the image ​https://s.w.org/wp-content/themes/pub/wporg-main/images/freedoms-2x.png is big - 472kb. There is also ​https://s.w.org/wp-content/themes/pub/wporg-main/images/freedoms.png which is 112kb. I would say, let's take the smaller one and double check if we can use SVG instead to make it smaller.

[gziolo]

Updated version with a local image

[gziolo]

The last patch contains a local copy of ​https://s.w.org/wp-content/themes/pub/wporg-main/images/freedoms.png which is 112kb. It includes a few whitespace fixes for CSS file.

[matveb]

I believe optimizing the images and loading from the CDN will be done in tandem with the About Page images prior to final release.

[mcsf]

Replying to gziolo:

The last patch contains a local copy of ​https://s.w.org/wp-content/themes/pub/wporg-main/images/freedoms.png which is 112kb. It includes a few whitespace fixes for CSS file.

Tested by applying patch and pulling that image with:

cd /wp-admin/images
curl -O https://s.w.org/wp-content/themes/pub/wporg-main/images/freedoms.png

The page looks good on an HiDPI device (Apple MacBook Pro, recent) and in different viewports.

[gziolo]

I believe optimizing the images and loading from the CDN will be done in tandem with the About Page images prior to final release.

I will commit the previous patch (https://core.trac.wordpress.org/attachment/ticket/45386/45386.2.diff) with CDN version of the image to make sure optimizations are applied everywhere at once.

[mcsf]

Replying to gziolo:

I believe optimizing the images and loading from the CDN will be done in tandem with the About Page images prior to final release.

I will commit the previous patch (https://core.trac.wordpress.org/attachment/ticket/45386/45386.2.diff) with CDN version of the image to make sure optimizations are applied everywhere at once.

Sounds good, go for it.

[gziolo]

In 43938:

About: Update Freedoms page to include illustrations.

@cathibosco has made some great illustrations of the Four Freedoms on ​https://wordpress.org/about/. Let's bring that over to the admin Freedoms page.

Props @melchoyce, @cathibosco, @boemedia, @karmatosed, @tobifjellner, @helen, @matveb, @mcsf.
Fixes #45386.

[karmatosed]

@cathibosco gave me the source files so adding them here if we need those for optimisation: ​https://www.dropbox.com/s/uugj4so5pqdtskh/Four%20frredoms.zip?dl=0 (apologies for Dropbox but they are large)

[SergeyBiryukov]

Merged to trunk in [44264].