<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[43913] branches/5.0/src/wp-admin: About Page: Initial About Page design and strings for 5.0.</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { white-space: pre-line; overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta" style="font-size: 105%">
<dt style="float: left; width: 6em; font-weight: bold">Revision</dt> <dd><a style="font-weight: bold" href="https://core.trac.wordpress.org/changeset/43913">43913</a><script type="application/ld+json">{"@context":"http://schema.org","@type":"EmailMessage","description":"Review this Commit","action":{"@type":"ViewAction","url":"https://core.trac.wordpress.org/changeset/43913","name":"Review Commit"}}</script></dd>
<dt style="float: left; width: 6em; font-weight: bold">Author</dt> <dd>melchoyce</dd>
<dt style="float: left; width: 6em; font-weight: bold">Date</dt> <dd>2018-11-21 02:38:17 +0000 (Wed, 21 Nov 2018)</dd>
</dl>
<pre style='padding-left: 1em; margin: 2em 0; border-left: 2px solid #ccc; line-height: 1.25; font-size: 105%; font-family: sans-serif'>About Page: Initial About Page design and strings for 5.0.
Props @pixelverbieger, @ocean90, @karmatosed, @pento, @boemedia, @lonelyvegan, @sami.keijonen, @TimothyBlynJacobs, @xkon, @afercia, @laurelfulford, @joostdevalk, @ipstenu, @matveb, @joen, @tinkerbelly, @chanthaboune, @kjellr, @alexislloyd, @melchoyce.
See <a href="https://core.trac.wordpress.org/ticket/45178">#45178</a>.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#branches50srcwpadminaboutphp">branches/5.0/src/wp-admin/about.php</a></li>
<li><a href="#branches50srcwpadmincssaboutcss">branches/5.0/src/wp-admin/css/about.css</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="branches50srcwpadminaboutphp"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: branches/5.0/src/wp-admin/about.php</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- branches/5.0/src/wp-admin/about.php 2018-11-21 01:47:49 UTC (rev 43912)
+++ branches/5.0/src/wp-admin/about.php 2018-11-21 02:38:17 UTC (rev 43913)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -16,12 +16,17 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> list( $display_version ) = explode( '-', get_bloginfo( 'version' ) );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+wp_enqueue_style( 'wp-block-library' );
+
</ins><span class="cx" style="display: block; padding: 0 10px"> include( ABSPATH . 'wp-admin/admin-header.php' );
</span><span class="cx" style="display: block; padding: 0 10px"> ?>
</span><span class="cx" style="display: block; padding: 0 10px"> <div class="wrap about-wrap full-width-layout">
</span><span class="cx" style="display: block; padding: 0 10px"> <h1><?php printf( __( 'Welcome to WordPress %s' ), $display_version ); ?></h1>
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <p class="about-text"><?php printf( __( 'Thank you for updating to the latest version! WordPress %s will smooth your design workflow and keep you safe from coding errors.' ), $display_version ); ?></p>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <p class="about-text"><?php printf( __( 'Thank you for updating to the latest version! WordPress %s introduces a robust new content creation experience.' ), $display_version ); ?></p>
+ <p class="about-text">
+ <a href="#classic-editor"><?php _e( 'Learn how to keep using the old editor.' ); ?></a>
+ </p>
</ins><span class="cx" style="display: block; padding: 0 10px"> <div class="wp-badge"><?php printf( __( 'Version %s' ), $display_version ); ?></div>
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> <h2 class="nav-tab-wrapper wp-clearfix">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -31,349 +36,276 @@
</span><span class="cx" style="display: block; padding: 0 10px"> <a href="freedoms.php?privacy-notice" class="nav-tab"><?php _e( 'Privacy' ); ?></a>
</span><span class="cx" style="display: block; padding: 0 10px"> </h2>
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <div class="changelog point-releases">
- <h3><?php _e( 'Maintenance and Security Releases' ); ?></h3>
- <p>
- <?php
- printf(
- /* translators: 1: WordPress version number, 2: plural number of bugs. */
- _n(
- '<strong>Version %1$s</strong> addressed %2$s bug.',
- '<strong>Version %1$s</strong> addressed %2$s bugs.',
- 46
- ),
- '4.9.8',
- number_format_i18n( 46 )
- );
- ?>
- <?php
- /* translators: %s: Codex URL */
- printf( __( 'For more information, see <a href="%s">the release notes</a>.' ), 'https://codex.wordpress.org/Version_4.9.8' );
- ?>
- </p>
- <p>
- <?php
- printf(
- /* translators: 1: WordPress version number, 2: plural number of bugs. */
- _n(
- '<strong>Version %1$s</strong> addressed some security issues and fixed %2$s bug.',
- '<strong>Version %1$s</strong> addressed some security issues and fixed %2$s bugs.',
- 17
- ),
- '4.9.7',
- number_format_i18n( 17 )
- );
- ?>
- <?php
- /* translators: %s: Codex URL */
- printf( __( 'For more information, see <a href="%s">the release notes</a>.' ), 'https://codex.wordpress.org/Version_4.9.7' );
- ?>
- </p>
- <p>
- <?php
- printf(
- /* translators: 1: WordPress version number, 2: plural number of bugs. */
- _n(
- '<strong>Version %1$s</strong> addressed %2$s bug.',
- '<strong>Version %1$s</strong> addressed %2$s bugs.',
- 18
- ),
- '4.9.6',
- number_format_i18n( 18 )
- );
- ?>
- <?php
- /* translators: %s: Codex URL */
- printf( __( 'For more information, see <a href="%s">the release notes</a>.' ), 'https://codex.wordpress.org/Version_4.9.6' );
- ?>
- </p>
- <p>
- <?php
- printf(
- /* translators: 1: WordPress version number, 2: plural number of bugs. */
- _n(
- '<strong>Version %1$s</strong> addressed some security issues and fixed %2$s bug.',
- '<strong>Version %1$s</strong> addressed some security issues and fixed %2$s bugs.',
- 28
- ),
- '4.9.5',
- number_format_i18n( 28 )
- );
- ?>
- <?php
- /* translators: %s: Codex URL */
- printf( __( 'For more information, see <a href="%s">the release notes</a>.' ), 'https://codex.wordpress.org/Version_4.9.5' );
- ?>
- </p>
- <p>
- <?php
- printf(
- /* translators: 1: WordPress version number, 2: plural number of bugs. */
- _n(
- '<strong>Version %1$s</strong> addressed %2$s bug.',
- '<strong>Version %1$s</strong> addressed %2$s bugs.',
- 1
- ),
- '4.9.4',
- number_format_i18n( 1 )
- );
- ?>
- <?php
- /* translators: %s: Codex URL */
- printf( __( 'For more information, see <a href="%s">the release notes</a>.' ), 'https://codex.wordpress.org/Version_4.9.4' );
- ?>
- </p>
- <p>
- <?php
- printf(
- /* translators: 1: WordPress version number, 2: plural number of bugs. */
- _n(
- '<strong>Version %1$s</strong> addressed %2$s bug.',
- '<strong>Version %1$s</strong> addressed %2$s bugs.',
- 34
- ),
- '4.9.3',
- number_format_i18n( 34 )
- );
- ?>
- <?php
- /* translators: %s: Codex URL */
- printf( __( 'For more information, see <a href="%s">the release notes</a>.' ), 'https://codex.wordpress.org/Version_4.9.3' );
- ?>
- </p>
- <p>
- <?php
- printf(
- /* translators: 1: WordPress version number, 2: plural number of bugs. */
- _n(
- '<strong>Version %1$s</strong> addressed some security issues and fixed %2$s bug.',
- '<strong>Version %1$s</strong> addressed some security issues and fixed %2$s bugs.',
- 22
- ),
- '4.9.2',
- number_format_i18n( 22 )
- );
- ?>
- <?php
- /* translators: %s: Codex URL */
- printf( __( 'For more information, see <a href="%s">the release notes</a>.' ), 'https://codex.wordpress.org/Version_4.9.2' );
- ?>
- </p>
- <p>
- <?php
- printf(
- /* translators: 1: WordPress version number, 2: plural number of bugs. */
- _n(
- '<strong>Version %1$s</strong> addressed some security issues and fixed %2$s bug.',
- '<strong>Version %1$s</strong> addressed some security issues and fixed %2$s bugs.',
- 11
- ),
- '4.9.1',
- number_format_i18n( 11 )
- );
- ?>
- <?php
- /* translators: %s: Codex URL */
- printf( __( 'For more information, see <a href="%s">the release notes</a>.' ), 'https://codex.wordpress.org/Version_4.9.1' );
- ?>
- </p>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <div class="feature-section one-col">
+ <div class="col">
+ <h2><?php _e( 'Say Hello to the New Editor' ); ?></h2>
+ </div>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <div class="full-width">
+ <img src="https://wordpress.org/gutenberg/files/2018/11/gutenberg-sketch.png" alt="">
+ </div>
+
</ins><span class="cx" style="display: block; padding: 0 10px"> <div class="feature-section one-col">
</span><span class="cx" style="display: block; padding: 0 10px"> <div class="col">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <h2>
- <?php
- printf(
- /* translators: %s: party popper emoji */
- __( 'Major Customizer Improvements, Code Error Checking, and More! %s' ),
- '🎉'
- );
- ?>
- </h2>
- <p><?php _e( 'Welcome to an improved Customizer workflow with design drafts, locking, scheduling, and preview links. What’s more, code syntax highlighting and error checking will make for a clean and smooth site building experience. Finally, if all that wasn’t pretty great, we’ve got a great new Gallery widget and improvements to theme browsing and switching.' ); ?></p>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <p><?php _e( 'You’ve successfully upgraded to WordPress 5.0! We’ve made some big changes to the editor. Our new block-based editor is the first step toward an exciting new future with a streamlined editing experience across your site. You’ll have more flexibility with how content is displayed, whether you are building your first site, revamping your blog, or write code for a living.' ); ?></p>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <div class="inline-svg full-width">
- <picture>
- <source media="(max-width: 500px)" srcset="<?php echo 'https://s.w.org/images/core/4.9/banner-mobile.svg'; ?>">
- <img src="https://s.w.org/images/core/4.9/banner.svg" alt="">
- </picture>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <div class="feature-section four-col">
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Plugin-1-1.gif" alt=""/>
+ <figcaption><?php _e( 'Do more with fewer plugins.' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Layout-3.gif" alt=""/>
+ <figcaption><?php _e( 'Create modern, multimedia-heavy layouts.' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Devices-1-1.gif" alt=""/>
+ <figcaption><?php _e( 'Work across all screen sizes and devices.' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Visual-1.gif" alt=""/>
+ <figcaption><?php _e( 'Trust that your editor looks like your website.' ); ?></figcaption>
+ </figure>
+ </div>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <div class="floating-header-section">
- <div class="section-header">
- <h2><?php _e( 'Customizer Workflow Improved' ); ?></h2>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <div class="feature-section one-col">
+ <div class="col">
+ <h2><?php _e( 'Building with Blocks' ); ?></h2>
+ <p><?php _e( 'The new block-based editor won’t change the way any of your content looks to your visitors. What it will do is let you insert any type of multimedia in a snap and rearrange to your heart’s content. Each piece of content will be in its own block; a distinct wrapper for easy maneuvering. If you’re more of an HTML and CSS sort of person, then the blocks won’t stand in your way. WordPress is here to simplify the process, not the outcome.' ); ?></p>
+ <video controls autoplay loop>
+ <source src="https://wordpress.org/gutenberg/files/2018/11/add-block.mp4" type="video/mp4">
+ <source src="https://wordpress.org/gutenberg/files/2018/11/add-block.webm" type="video/webm">
+ <p><?php printf( __('Your browser doesn’t support HTML5 video. Here is a %1$slink to the video%2$s instead.'), '<a href="https://wordpress.org/gutenberg/files/2018/11/add-block.mp4">', '</a>'); ?></p>
+ </video>
+ <p><?php _e( 'We have tons of blocks available by default, and more get added by the community every day. Here are a few of the blocks to help you get started:' ); ?></p>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ </div>
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <div class="section-content">
- <div class="section-item">
- <div class="inline-svg">
- <img src="https://s.w.org/images/core/4.9/draft-and-schedule.svg" alt="">
- </div>
- <h3><?php _e( 'Draft and Schedule Site Design Customizations' ); ?></h3>
- <p><?php _e( 'Yes, you read that right. Just like you can draft and revise posts and schedule them to go live on the date and time you choose, you can now tinker with your site’s design and schedule those design changes to go live as you please.' ); ?></p>
- </div>
- <div class="section-item">
- <div class="inline-svg">
- <img src="https://s.w.org/images/core/4.9/design-preview-links.svg" alt="">
- </div>
- <h3><?php _e( 'Collaborate with Design Preview Links' ); ?></h3>
- <p><?php _e( 'Need to get some feedback on proposed site design changes? WordPress 4.9 gives you a preview link you can send to your team and customers so that you can collect and integrate feedback before you schedule the changes to go live. Can we say collaboration++?' ); ?></p>
- </div>
- <div class="section-item">
- <div class="inline-svg">
- <img src="https://s.w.org/images/core/4.9/locking.svg" alt="">
- </div>
- <h3><?php _e( 'Design Locking To Guard Your Changes' ); ?></h3>
- <p><?php _e( 'Ever encounter a scenario where two designers walk into a project and designer A overrides designer B’s beautiful changes? WordPress 4.9’s design lock feature (similar to post locking) secures your draft design so that no one can make changes to it or erase all your hard work.' );?></p>
- </div>
- <div class="section-item">
- <div class="inline-svg">
- <img src="https://s.w.org/images/core/4.9/prompt.svg" alt="">
- </div>
- <h3><?php _e( 'A Prompt to Protect Your Work' ); ?></h3>
- <p><?php _e( 'Were you lured away from your desk before you saved your new draft design? Fear not, when you return, WordPress 4.9 will politely ask whether or not you’d like to save your unsaved changes.' ); ?></p>
- </div>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <div class="feature-section eight-col">
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon.png" alt=""/>
+ <figcaption><?php _e( 'Paragraph' ); ?></figcaption>
+ </figure>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-Heading.png" alt=""/>
+ <figcaption><?php _e( 'Heading' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-Subheading.png" alt=""/>
+ <figcaption><?php _e( 'Preformatted' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-Quote.png" alt=""/>
+ <figcaption><?php _e( 'Quote' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-Image.png" alt=""/>
+ <figcaption><?php _e( 'Image' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-Gallery.png" alt=""/>
+ <figcaption><?php _e( 'Gallery' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-Cover-Image.png" alt=""/>
+ <figcaption><?php _e( 'Cover Image' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-Video.png" alt=""/>
+ <figcaption><?php _e( 'Video' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-Audio.png" alt=""/>
+ <figcaption><?php _e( 'Audio' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-Column.png" alt=""/>
+ <figcaption><?php _e( 'Columns' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-File.png" alt=""/>
+ <figcaption><?php _e( 'File' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-Code.png" alt=""/>
+ <figcaption><?php _e( 'Code' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-List.png" alt=""/>
+ <figcaption><?php _e( 'List' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-Button.png" alt=""/>
+ <figcaption><?php _e( 'Button' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-Embeds.png" alt=""/>
+ <figcaption><?php _e( 'Embeds' ); ?></figcaption>
+ </figure>
+ </div>
+ <div class="col">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/07/Block-Icon-More.png" alt=""/>
+ <figcaption><?php _e( 'More' ); ?></figcaption>
+ </figure>
+ </div>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <div class="floating-header-section">
- <div class="section-header">
- <h2><?php _e( 'Coding Enhancements' ); ?></h2>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <div class="feature-section one-col">
+ <div class="col">
+ <h2><?php _e( 'Freedom to Build, Freedom to Write' ); ?></h2>
+ <p><?php _e( 'This new editing experience provides a more consistent treatment of design as well as content. If you’re building client sites, you can create reusable blocks. This lets your clients add new content anytime, while still maintaining a consistent look and feel.' ); ?></p>
+ <video controls autoplay loop>
+ <source src="https://wordpress.org/gutenberg/files/2018/11/build.mp4" type="video/mp4">
+ <source src="https://wordpress.org/gutenberg/files/2018/11/build.webm" type="video/webm">
+ <p><?php printf( __('Your browser doesn’t support HTML5 video. Here is a %1$slink to the video%2$s instead.'), '<a href="https://wordpress.org/gutenberg/files/2018/11/build.mp4">', '</a>'); ?></p>
+ </video>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-
- <div class="section-content">
- <div class="section-item">
- <div class="inline-svg">
- <img src="https://s.w.org/images/core/4.9/syntax-highlighting.svg" alt="">
- </div>
- <h3><?php _e( 'Syntax Highlighting and Error Checking? Yes, Please!' ); ?></h3>
- <p><?php _e( 'You’ve got a display problem but can’t quite figure out exactly what went wrong in the CSS you lovingly wrote. With syntax highlighting and error checking for CSS editing and the Custom HTML widget introduced in WordPress 4.8.1, you’ll pinpoint coding errors quickly. Practically guaranteed to help you scan code more easily and suss out and fix code errors quickly.' ); ?></p>
- </div>
- <div class="section-item">
- <div class="inline-svg">
- <img src="https://s.w.org/images/core/4.9/sandbox.svg" alt="">
- </div>
- <h3><?php _e( 'Sandbox for Safety' ); ?></h3>
- <p><?php _e( 'The dreaded white screen. You’ll avoid it when working on themes and plugin code because WordPress 4.9 will warn you about saving an error. You’ll sleep better at night.' ); ?></p>
- </div>
- <div class="section-item">
- <div class="inline-svg">
- <img src="https://s.w.org/images/core/4.9/warning.svg" alt="">
- </div>
- <h3><?php _e( 'Warning: Potential Danger Ahead!' ); ?></h3>
- <p><?php _e( 'When you edit themes and plugins directly, WordPress 4.9 will politely warn you that this is a dangerous practice. It will recommend that you backup your files before saving, so they don’t get overwritten by the next update. Take the safe route: your future self will thank you. Your team and customers will thank you.' );?></p>
- </div>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ </div>
+
+ <div class="feature-section one-col cta">
+ <div class="col">
+ <a class="button button-primary button-hero" href="<?php echo esc_url( admin_url( 'post-new.php' ) ); ?>"><?php _e( 'Build your first post' ); ?></a>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ <hr />
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <div class="floating-header-section">
- <div class="section-header">
- <h2><?php _e( 'Even More Widget Updates' ); ?></h2>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <div class="feature-section one-col">
+ <div class="col">
+ <h2><?php _e( 'A Stunning New Default Theme' ); ?></h2>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ </div>
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <div class="section-content">
- <div class="section-item">
- <div class="inline-svg">
- <img src="https://s.w.org/images/core/4.9/gallery-widget.svg" alt="">
- </div>
- <h3><?php _e( 'The New Gallery Widget' ); ?></h3>
- <p><?php _e( 'An incremental improvement to the media changes hatched in WordPress 4.8, you can now add a gallery via widget. Yes!' ); ?></p>
- </div>
- <div class="section-item">
- <div class="inline-svg">
- <img src="https://s.w.org/images/core/4.9/media-button.svg" alt="">
- </div>
- <h3><?php _e( 'Press a Button, Add Media' ); ?></h3>
- <p><?php _e( 'Want to add media to your text widget? Embed images, video, and audio directly into the widget along with your text, with our simple but useful Add Media button. Woo!' ); ?></p>
- </div>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <div class="full-width">
+ <figure>
+ <img src="https://wordpress.org/gutenberg/files/2018/11/twenty-nineteen.png" alt="">
+ <figcaption><?php _e( 'The front-end of Twenty Nineteen on the left, and how it looks in the editor on the right.' ); ?></figcaption>
+ </figure>
+ </div>
+
+ <div class="feature-section one-col">
+ <div class="col">
+ <p><?php _e( 'Introducing Twenty Nineteen, a new default theme that shows off the power of the new editor.' ); ?></p>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <div class="floating-header-section">
- <div class="section-header">
- <h2><?php _e( 'Site Building Improvements' ); ?></h2>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <div class="feature-section three-col">
+ <div class="col">
+ <img src="https://wordpress.org/gutenberg/files/2018/11/twenty-nineteen-gutenberg.png" alt="">
+ <h3><?php _e( 'Designed for the block editor' ); ?></h3>
+ <p><?php _e( 'Twenty Nineteen features custom styles for the blocks available by default in 5.0. It makes extensive use of editor styles throughout the theme. That way, what you create in your content editor is what you see on the front of your site.' ); ?></p>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <div class="col">
+ <img src="https://wordpress.org/gutenberg/files/2018/11/twenty-nineteen-type.png" alt="">
+ <h3><?php _e( 'Simple, type-driven layout' ); ?></h3>
+ <p><?php _e( 'Featuring ample whitespace, and modern sans-serif headlines paired with classic serif body text, Twenty Nineteen is built to be beautiful on the go. It uses system fonts to increase loading speed. No more long waits on slow networks!' ); ?></p>
+ </div>
+ <div class="col">
+ <img src="https://wordpress.org/gutenberg/files/2018/11/three-3seconds.gif" alt="">
+ <h3><?php _e( 'Versatile design for all sites' ); ?></h3>
+ <p><?php _e( 'Twenty Nineteen is designed to work for a wide variety of use cases. Whether you’re running a photo blog, launching a new business, or supporting a non-profit, Twenty Nineteen is flexible enough to fit your needs.' ); ?></p>
+ </div>
+ </div>
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <div class="section-content">
- <div class="section-item">
- <div class="inline-svg">
- <img src="https://s.w.org/images/core/4.9/theme-switching.svg" alt="">
- </div>
- <h3><?php _e( 'More Reliable Theme Switching' ); ?></h3>
- <p><?php _e( 'When you switch themes, widgets sometimes think they can just up and move location. Improvements in WordPress 4.9 offer more persistent menu and widget placement when you decide it’s time for a new theme. Additionally, you can preview installed themes or download, install, and preview new themes right. Nothing says handy like being able to preview before you deploy. ' ); ?></p>
- </div>
- <div class="section-item">
- <div class="inline-svg">
- <img src="https://s.w.org/images/core/4.9/menu-flow.svg" alt="">
- </div>
- <h3><?php _e( 'Better Menu Instructions = Less Confusion' ); ?></h3>
- <p><?php _e( 'Were you confused by the steps to create a new menu? Perhaps no longer! We’ve ironed out the UX for a smoother menu creation process. Newly updated copy will guide you.' ); ?></p>
- </div>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <div class="feature-section one-col cta">
+ <div class="col">
+ <a class="button button-primary button-hero load-customize hide-if-no-customize" href="<?php echo esc_url( admin_url( 'customize.php?theme=twentynineteen' ) ); ?>"><?php _e( 'Give Twenty Nineteen a try' ); ?></a>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <div class="inline-svg">
- <picture>
- <source media="(max-width: 500px)" srcset="<?php echo 'https://s.w.org/images/core/4.9/gutenberg-mobile.svg'; ?>">
- <img src="https://s.w.org/images/core/4.9/gutenberg.svg" alt="">
- </picture>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <hr />
+
+ <div class="under-the-hood feature-section">
+ <div class="col">
+ <h2><?php _e( 'Developer Happiness' ); ?></h2>
+ </div>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <div class="feature-section">
- <h2>
- <?php
- printf(
- /* translators: %s: handshake emoji */
- __( 'Lend a Hand with Gutenberg %s' ),
- '🤝'
- );
- ?>
- </h2>
- <p><?php printf(
- __( 'WordPress is working on a new way to create and control your content and we’d love to have your help. Interested in being an <a href="%s">early tester</a> or getting involved with the Gutenberg project? <a href="%s">Contribute on GitHub</a>.' ),
- __( 'https://wordpress.org/plugins/gutenberg/' ),
- 'https://github.com/WordPress/gutenberg' ); ?></p>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <div class="under-the-hood feature-section three-col">
+ <div class="col">
+ <h3><?php _e( 'Protect' ); ?></h3>
+ <p><?php _e( 'Blocks provide a comfortable way for users to change content directly, while also ensuring the content structure cannot be easily disturbed by accidental code edits. This allows the developer to control the output, building polished and semantic markup that is preserved through edits and not easily broken.' ); ?></p>
+ </div>
+ <div class="col">
+ <h3><?php _e( 'Compose' ); ?></h3>
+ <p><?php _e( 'Take advantage of a wide collection of APIs and interface components to easily create blocks with intuitive controls for your clients. Utilizing these components not only speeds up development work but also provide a more consistent, usable, and accessible interface to all users.' ); ?></p>
+ </div>
+ <div class="col">
+ <h3><?php _e( 'Create' ); ?></h3>
+ <p><?php _e( 'The new block paradigm opens up a path of exploration and imagination when it comes to solving user needs. With the unified block insertion flow, it’s easier for your clients and customers to find and use blocks for all types of content. Developers can focus on executing their vision and providing rich editing experiences, rather than fussing with difficult APIs.' ); ?></p>
+ </div>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ <div class="under-the-hood feature-section one-col cta">
+ <div class="col">
+ <a class="button button-primary button-hero" href="<?php echo esc_url( 'https://wordpress.org/gutenberg/handbook/' ); ?>"><?php _e( 'Learn how to get started' ); ?></a>
+ </div>
+ </div>
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> <hr />
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-
- <div class="changelog">
- <h2><?php
- printf(
- /* translators: %s: smiling face with smiling eyes emoji */
- __( 'Developer Happiness %s' ),
- '😊'
- );
- ?></h2>
-
- <div class="under-the-hood two-col">
- <div class="col">
- <h3><a href="https://make.wordpress.org/core/2017/11/01/improvements-to-the-customize-js-api-in-4-9/"><?php _e( 'Customizer JS API Improvements' ); ?></a></h3>
- <p><?php
- printf(
- /* translators: %s: https://make.wordpress.org/core/2017/11/01/improvements-to-the-customize-js-api-in-4-9/ */
- __( 'We’ve made numerous improvements to the Customizer JS API in WordPress 4.9, eliminating many pain points and making it just as easy to work with as the PHP API. There are also new base control templates, a date/time control, and section/panel/global notifications to name a few. <a href="%s">Check out the full list.</a>' ),
- 'https://make.wordpress.org/core/2017/11/01/improvements-to-the-customize-js-api-in-4-9/'
- );
- ?></p>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ <div class="feature-section one-col" id="classic-editor">
+ <div class="col">
+ <h2><?php _e( 'Keep it Classic' ); ?></h2>
+ </div>
+ </div>
+
+ <div class="full-width">
+ <img src="https://wordpress.org/gutenberg/files/2018/11/classic.png" alt="">
+ </div>
+
+ <div class="feature-section one-col">
+ <div class="col">
+ <p><?php _e( 'Prefer to stick with the familiar Classic Editor? No problem! Support for the Classic Editor plugin will remain in WordPress until 2021.' ); ?></p>
+ <p><?php _e( 'The Classic Editor plugin restores the previous WordPress editor and the Edit Post screen. It lets you keep using plugins that extend it, add old-style meta boxes, or otherwise depend on the previous editor. To install, visit your plugins page and click the “Install Now” button next to “Classic Editor.” After the plugin finishes installing, click “Activate.” That’s it! ' ); ?></p>
+ <p><em><?php _e( 'Note to users of assistive technology: if you experience usability issues with Gutenberg, we recommend you continue to use the Classic Editor.' ); ?></em></p>
+ <div class="col cta">
+ <a class="button button-primary button-hero" href="<?php echo esc_url( self_admin_url( 'plugin-install.php?tab=featured' ) ); ?>"><?php _e( 'Install the Classic Editor' ); ?></a>
</ins><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <div class="col">
- <h3><a href="https://make.wordpress.org/core/2017/10/22/code-editing-improvements-in-wordpress-4-9/"><?php _e( 'CodeMirror available for use in your themes and plugins' ); ?></a></h3>
- <p><?php _e( 'We’ve introduced a new code editing library, CodeMirror, for use within core. Use it to improve any code writing or editing experiences within your plugins, like CSS or JavaScript include fields.' ); ?></p>
- </div>
- <div class="col">
- <h3><a href="https://make.wordpress.org/core/2017/10/30/mediaelement-upgrades-in-wordpress-4-9/"><?php _e( 'MediaElement.js upgraded to 4.2.6' ); ?></a></h3>
- <p><?php _e( 'WordPress 4.9 includes an upgraded version of MediaElement.js, which removes dependencies on jQuery, improves accessibility, modernizes the UI, and fixes many bugs.' ); ?></p>
- </div>
- <div class="col">
- <h3><a href="https://make.wordpress.org/core/2017/10/15/improvements-for-roles-and-capabilities-in-4-9/"><?php _e( 'Improvements to Roles and Capabilities' ); ?></a></h3>
- <p><?php _e( 'New capabilities have been introduced that allow granular management of plugins and translation files. In addition, the site switching process in multisite has been fine-tuned to update the available roles and capabilities in a more reliable and coherent way.' ); ?></p>
- </div>
</del><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
</ins><span class="cx" style="display: block; padding: 0 10px"> <hr />
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> <div class="return-to-dashboard">
</span></span></pre></div>
<a id="branches50srcwpadmincssaboutcss"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: branches/5.0/src/wp-admin/css/about.css</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- branches/5.0/src/wp-admin/css/about.css 2018-11-21 01:47:49 UTC (rev 43912)
+++ branches/5.0/src/wp-admin/css/about.css 2018-11-21 02:38:17 UTC (rev 43913)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -40,7 +40,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap hr {
</span><span class="cx" style="display: block; padding: 0 10px"> border: 0;
</span><span class="cx" style="display: block; padding: 0 10px"> height: 0;
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- margin: 0;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ margin: 3em 0 0;
</ins><span class="cx" style="display: block; padding: 0 10px"> border-top: 1px solid rgba(0, 0, 0, 0.1);
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -51,6 +51,27 @@
</span><span class="cx" style="display: block; padding: 0 10px"> vertical-align: middle;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+.about-wrap figure {
+ position: relative;
+ margin: 0;
+}
+
+.about-wrap .feature-section figure img {
+ margin-bottom: 0;
+}
+
+.about-wrap figcaption {
+ position: absolute;
+ bottom: 0;
+ width: 100%;
+ padding: 40px 10px 15px;
+ overflow: auto;
+ box-sizing: border-box;
+ background: linear-gradient(0deg,rgba(0,0,0,.7),rgba(0,0,0,.3) 60%,transparent);
+ font-weight: 600;
+ text-shadow: 0px 0px 5px rgba(0,0,0,.75);
+}
+
</ins><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .jetpack-video-wrapper {
</span><span class="cx" style="display: block; padding: 0 10px"> margin-bottom: 0;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -132,19 +153,6 @@
</span><span class="cx" style="display: block; padding: 0 10px"> color: #23282d;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-.about-wrap .changelog h2 {
- font-size: 1.4em;
- font-weight: 600;
- text-align: left;
-}
-
-.about-wrap .changelog h3 {
- margin: 1.33em 0;
- font-size: 1em;
- line-height: inherit;
- color: #23282d;
-}
-
</del><span class="cx" style="display: block; padding: 0 10px"> .about-wrap code,
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap ol li p {
</span><span class="cx" style="display: block; padding: 0 10px"> font-size: 14px;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -151,6 +159,12 @@
</span><span class="cx" style="display: block; padding: 0 10px"> font-weight: 400;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+.about-wrap figcaption {
+ font-size: 13px;
+ text-align: center;
+ color: white;
+}
+
</ins><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .about-description,
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .about-text {
</span><span class="cx" style="display: block; padding: 0 10px"> margin-top: 1.4em;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -161,7 +175,6 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .about-text {
</span><span class="cx" style="display: block; padding: 0 10px"> margin: 1em 200px 1em 0;
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- min-height: 60px;
</del><span class="cx" style="display: block; padding: 0 10px"> color: #555d66;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -175,7 +188,7 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .feature-section.one-col {
</span><span class="cx" style="display: block; padding: 0 10px"> margin: 0 auto;
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- max-width: 700px;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ max-width: 680px;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .inline-svg img {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -197,6 +210,12 @@
</span><span class="cx" style="display: block; padding: 0 10px"> max-width: 47%;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+.about-wrap .three-col,
+.about-wrap .four-col {
+ margin: auto;
+ max-width: 1020px;
+}
+
</ins><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .three-col .col {
</span><span class="cx" style="display: block; padding: 0 10px"> align-self: flex-start;
</span><span class="cx" style="display: block; padding: 0 10px"> min-width: 31%;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -203,6 +222,23 @@
</span><span class="cx" style="display: block; padding: 0 10px"> max-width: 31%;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+.about-wrap .four-col .col {
+ align-self: flex-start;
+ min-width: 23%;
+ max-width: 23%;
+}
+
+.about-wrap .feature-section.eight-col .col {
+ align-self: flex-start;
+ margin-top: 6px;
+ min-width: 12%;
+ max-width: 12%;
+}
+
+.about-wrap .one-col img {
+ margin: 1em 0 2em;
+}
+
</ins><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .two-col img {
</span><span class="cx" style="display: block; padding: 0 10px"> margin-bottom: 1.5em;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -215,6 +251,18 @@
</span><span class="cx" style="display: block; padding: 0 10px"> background: transparent; /* Hide loading.gif */
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+.about-wrap video {
+ margin: 1.5em auto;
+}
+
+.about-wrap .cta {
+ text-align: center;
+}
+.about-wrap .cta .button {
+ margin: 0 auto 5px;
+ font-weight: 600;
+}
+
</ins><span class="cx" style="display: block; padding: 0 10px"> /* 1.3 - Point Releases */
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .point-releases {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -294,7 +342,6 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .feature-section {
</span><span class="cx" style="display: block; padding: 0 10px"> overflow: hidden;
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- padding: 0 0 40px;
</del><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .feature-section.no-heading {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -305,10 +352,6 @@
</span><span class="cx" style="display: block; padding: 0 10px"> overflow: hidden;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-.about-wrap .feature-section img {
- margin-bottom: 1em;
-}
-
</del><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .embed-container {
</span><span class="cx" style="display: block; padding: 0 10px"> text-align: center;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -346,84 +389,6 @@
</span><span class="cx" style="display: block; padding: 0 10px"> padding: 0 5px;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-/* 2.3 Floating Header Layout */
-
-.about-wrap .floating-header-section {
- display: -ms-grid;
- display: grid;
- grid-gap: 0 60px;
- -ms-grid-columns: 5fr 11fr;
- grid-template-columns: 5fr 11fr;
- max-width: 1020px;
- margin: 0 auto 120px;
-}
-
-.about-wrap .floating-header-section .section-header {
- -ms-grid-column: 1;
- grid-column: 1;
- position: relative;
- min-width: 230px;
- max-width: 300px;
-}
-
-.about-wrap .floating-header-section h2 {
- margin: 0;
- text-align: left;
- position: absolute;
-}
-
-.about-wrap .floating-header-section .section-content {
- -ms-grid-column: 2;
- grid-column: 2;
- display: flex;
- justify-content: space-between;
- align-items: flex-start;
- flex-flow: row wrap;
- flex-grow: 2;
- flex-shrink: 0;
-}
-
-.about-wrap .floating-header-section .section-item {
- flex-grow: 1;
- max-width: calc(50% - 30px);
-}
-
-.about-wrap .floating-header-section .section-item:nth-child(1),
-.about-wrap .floating-header-section .section-item:nth-child(2) {
- margin-bottom: 60px;
-}
-
-.about-wrap .floating-header-section .section-item:nth-child(1):nth-last-child(2),
-.about-wrap .floating-header-section .section-item:nth-child(2):nth-last-child(1) {
- margin-bottom: 0;
-}
-
-.about-wrap .floating-header-section.has-long-title {
- display: block;
-}
-
-.about-wrap .floating-header-section.has-long-title .section-header {
- max-width: 100%;
-}
-
-.about-wrap .floating-header-section.has-long-title h2 {
- position: static;
- margin-bottom: 60px;
-}
-
-.about-wrap .floating-header-section.has-long-title .section-content {
- justify-content: flex-start;
-}
-
-.about-wrap .floating-header-section.has-long-title .section-item {
- max-width: 300px;
- margin-bottom: 0;
-}
-
-.about-wrap .floating-header-section.has-long-title .section-item + .section-item {
- margin-left: 60px;
-}
-
</del><span class="cx" style="display: block; padding: 0 10px"> /*------------------------------------------------------------------------------
</span><span class="cx" style="display: block; padding: 0 10px"> 3.0 - Credits & Freedoms Pages
</span><span class="cx" style="display: block; padding: 0 10px"> ------------------------------------------------------------------------------*/
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -538,14 +503,28 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .two-col .col,
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- .about-wrap .three-col .col {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ .about-wrap .three-col .col,
+ .about-wrap .four-col .col {
</ins><span class="cx" style="display: block; padding: 0 10px"> min-width: 48% !important;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ .about-wrap .eight-col .col {
+ min-width: 24% !important;
+ }
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- .about-wrap .three-col img {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ .about-wrap .three-col img,
+ .about-wrap .four-col img,
+ .about-wrap .eight-col img {
</ins><span class="cx" style="display: block; padding: 0 10px"> display: block;
</span><span class="cx" style="display: block; padding: 0 10px"> margin: 0 auto;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ .about-wrap figcaption {
+ position: relative;
+ margin-top: 10px;
+ padding-top: 0;
+ color: #40464D;
+ }
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .floating-header-section {
</span><span class="cx" style="display: block; padding: 0 10px"> display: block;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -584,10 +563,12 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .two-col .col,
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ .about-wrap .three-col .col,
</ins><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .three-col .col {
</span><span class="cx" style="display: block; padding: 0 10px"> min-width: 100% !important;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ .about-wrap .under-the-hood.four-col .col,
</ins><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .under-the-hood.three-col .col,
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .under-the-hood.two-col .col,
</span><span class="cx" style="display: block; padding: 0 10px"> .about-wrap .under-the-hood.one-col .col {
</span></span></pre>
</div>
</div>
</body>
</html>