Help/About: WordPress 5.8 About Page.
This is the start of the WordPress 5.8 about page, introducing new content and a first pass of the new style. Props chanthaboune, cbringmann, webcommsat, marybaum, melchoyce, shaunandrews, desrosj, ryelle, oglekler, yvettesonneveld, nalininonstopnewsuk, meher, femkreations, alanjacobmathew, courane01, annezazu, matveb, milana_cap, javiarce, ryokuhi, audrasjb. See #52775. Built from https://develop.svn.wordpress.org/trunk@51264 git-svn-id: http://core.svn.wordpress.org/trunk@50873 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
ryelle
parent
ad14ee34eb
commit
aea10c0c44
|
|
@ -22,19 +22,15 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
|
|||
<div class="wrap about__container">
|
||||
|
||||
<div class="about__header">
|
||||
<div class="about__header-image">
|
||||
<img alt="<?php _e( 'Code is Poetry' ); ?>" src="<?php echo esc_url( admin_url( 'images/about-badge.svg' ) ); ?>" />
|
||||
</div>
|
||||
|
||||
<div class="about__header-title">
|
||||
<p>
|
||||
<h1>
|
||||
<?php _e( 'WordPress' ); ?>
|
||||
<?php echo $display_version; ?>
|
||||
</p>
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<div class="about__header-text">
|
||||
<?php _e( 'Jazz up your stories in an editor that’s cleaner, crisper, and does more to get out of your way.' ); ?>
|
||||
<?php _e( 'The next stop on the road to full site editing' ); ?>
|
||||
</div>
|
||||
|
||||
<nav class="about__header-navigation nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
|
||||
|
|
@ -45,20 +41,63 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
|
|||
</nav>
|
||||
</div>
|
||||
|
||||
<div class="about__section is-feature has-subtle-background-color">
|
||||
<hr />
|
||||
|
||||
<div class="about__section">
|
||||
<h2 class="aligncenter has-accent-color">
|
||||
<?php _e( 'Three Essential Powerhouses' ); ?>
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
<div class="about__section has-2-columns is-wider-left">
|
||||
<div class="column about__image has-subtle-background-color"></div>
|
||||
<div class="column">
|
||||
<h1 class="is-smaller-heading">
|
||||
<?php
|
||||
printf(
|
||||
/* translators: %s: The current WordPress version number. */
|
||||
__( 'Step into WordPress %s.' ),
|
||||
$display_version
|
||||
);
|
||||
?>
|
||||
</h1>
|
||||
<h3>
|
||||
<?php _e( 'Manage Widgets with Blocks' ); ?>
|
||||
</h3>
|
||||
<p>
|
||||
<?php
|
||||
_e( 'With this new version, WordPress brings you fresh colors. The editor helps you work in a few places you couldn’t before—at least, not without getting into code or hiring a pro. The controls you use most, like changing font sizes, are in more places—right where you need them. And layout changes that should be simple, like full-height images, are even simpler to make.' );
|
||||
printf(
|
||||
/* translators: %s: Widgets dev note link. */
|
||||
__( 'After months of hard work, the power of blocks has come to both the Block Widgets Editor and the Customizer. Now you can add blocks both in widget areas across your site and with live preview through the Customizer. This opens up new possibilities to create content: from no-code mini layouts to the vast library of core and third-party blocks. For our developers, you can find more details in the <a href="%s">Widgets dev note</a>.' ),
|
||||
'#'
|
||||
);
|
||||
?>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr />
|
||||
|
||||
<div class="about__section has-2-columns is-wider-right">
|
||||
<div class="column">
|
||||
<h3>
|
||||
<?php _e( 'Display Posts with New Blocks and Patterns' ); ?>
|
||||
</h3>
|
||||
<p>
|
||||
<?php
|
||||
printf(
|
||||
/* translators: %s: Query Loop dev note link. */
|
||||
__( 'The Query Loop Block makes it possible to display posts based on specified parameters; like a PHP loop without the code. Easily display posts from a specific category, to do things like create a portfolio or a page full of your favorite recipes. Think of it as a more complex and powerful Latest Posts Block! Plus, pattern suggestions make it easier than ever to create a list of posts with the design you want. For our theme authors, learn more about experimenting with this awesome tool in the <a href="%s">Query Loop Block dev note</a>.' ),
|
||||
'#'
|
||||
);
|
||||
?>
|
||||
</p>
|
||||
</div>
|
||||
<div class="column about__image has-subtle-background-color"></div>
|
||||
</div>
|
||||
|
||||
<hr />
|
||||
|
||||
<div class="about__section has-2-columns is-wider-left">
|
||||
<div class="column about__image has-subtle-background-color"></div>
|
||||
<div class="column">
|
||||
<h3>
|
||||
<?php _e( 'Edit the Templates Around Posts' ); ?>
|
||||
</h3>
|
||||
<p>
|
||||
<?php
|
||||
_e( 'You can use the familiar block editor to edit templates that hold your content—simply activate a block theme or a theme that has opted in for this feature. Switch from editing your posts to editing your pages and back again, all while using a familiar block editor. There are more than 20 new blocks available within compatible themes. Read more about this feature and how to experiment with it in the release notes.' );
|
||||
?>
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -66,144 +105,122 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
|
|||
|
||||
<hr class="is-large" />
|
||||
|
||||
<div class="about__section has-2-columns">
|
||||
<h2 class="is-section-header is-smaller-heading">
|
||||
<?php _e( 'Now the editor is easier to use' ); ?>
|
||||
<div class="about__section">
|
||||
<h2 class="aligncenter has-accent-color">
|
||||
<?php _e( 'Three Workflow Helpers' ); ?>
|
||||
</h2>
|
||||
<div class="column">
|
||||
<p>
|
||||
<?php
|
||||
_e( '<strong>Font-size adjustment in more places:</strong> now, font-size controls are right where you need them in the List and Code blocks. No more trekking to another screen to make that single change!' );
|
||||
?>
|
||||
</p>
|
||||
<p>
|
||||
<?php
|
||||
_e( '<strong>Reusable blocks:</strong> several enhancements make reusable blocks more stable and easier to use. And now they save automatically with the post when you click the Update button.' );
|
||||
?>
|
||||
</p>
|
||||
<p>
|
||||
<?php
|
||||
_e( '<strong>Inserter drag-and-drop:</strong> drag blocks and block patterns from the inserter right into your post.' );
|
||||
?>
|
||||
</p>
|
||||
</div>
|
||||
<div class="column about__image">
|
||||
<video controls>
|
||||
<source src="https://s.w.org/images/core/5.7/about-57-drag-drop-image.mp4" type="video/mp4" />
|
||||
<source src="https://s.w.org/images/core/5.7/about-57-drag-drop-image.webm" type="video/webm" />
|
||||
</video>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="about__section has-2-columns">
|
||||
<h2 class="is-section-header is-smaller-heading">
|
||||
<?php _e( 'You can do more without writing custom code' ); ?>
|
||||
</h2>
|
||||
<div class="about__section has-2-columns is-wider-left">
|
||||
<div class="column about__image has-subtle-background-color"></div>
|
||||
<div class="column">
|
||||
<h3>
|
||||
<?php _e( 'Overview of the Page Structure' ); ?>
|
||||
</h3>
|
||||
<p>
|
||||
<?php
|
||||
_e( '<strong>Full-height alignment:</strong> have you ever wanted to make a block, like the Cover block, fill the whole window? Now you can.' );
|
||||
_e( 'Sometimes you need a simple landing page, but sometimes you need something a little more robust. As blocks increase, patterns emerge, and content creation gets easier, new solutions are needed to make complex content easy to navigate. List View is the best way to jump between layers of content and nested blocks. Since the List View gives you an overview of all the blocks in your content, you can now navigate quickly to the precise block you need. Ready to focus completely on your content? Toggle it on or off to suit your workflow.' );
|
||||
?>
|
||||
</p>
|
||||
<p>
|
||||
<?php
|
||||
_e( '<strong>Buttons block:</strong> now you can choose a vertical or a horizontal layout. And you can set the width of a button to a preset percentage.' );
|
||||
?>
|
||||
</p>
|
||||
<p>
|
||||
<?php
|
||||
_e( '<strong>Social Icons block:</strong> now you can change the size of the icons.' );
|
||||
?>
|
||||
</p>
|
||||
</div>
|
||||
<div class="column about__image">
|
||||
<img src="https://s.w.org/images/core/5.7/about-57-cover.jpg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr />
|
||||
|
||||
<div class="about__section has-subtle-background-color">
|
||||
<div class="column">
|
||||
<h2 class="is-smaller-heading"><?php _e( 'A Simpler Default Color Palette' ); ?></h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="about__section has-subtle-background-color">
|
||||
<figure class="column about__image" id="about-image-comparison">
|
||||
<div class="about__image-comparison no-js">
|
||||
<img src="https://s.w.org/images/core/5.7/about-57-color-old.png" alt="<?php esc_attr_e( 'Dashboard with old color scheme.' ); ?>" />
|
||||
<div class="about__image-comparison-resize">
|
||||
<img src="https://s.w.org/images/core/5.7/about-57-color-new.png" alt="<?php esc_attr_e( 'Dashboard with new color scheme.' ); ?>" />
|
||||
</div>
|
||||
</div>
|
||||
<figcaption><?php _e( 'Above, the Dashboard before and after the color update in 5.7.' ); ?></figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
|
||||
<div class="about__section has-2-columns has-subtle-background-color">
|
||||
<div class="about__section has-2-columns is-wider-right">
|
||||
<div class="column">
|
||||
<h3>
|
||||
<?php _e( 'Suggested Patterns for Blocks' ); ?>
|
||||
</h3>
|
||||
<p>
|
||||
<?php
|
||||
printf(
|
||||
/* translators: %s: WCAG information link. */
|
||||
__( 'This new streamlined color palette collapses all the colors that used to be in the WordPress source code down to seven core colors and a range of 56 shades that meet the <a href="%s">WCAG 2.0 AA recommended contrast ratio</a> against white or black.' ),
|
||||
'https://www.w3.org/WAI/WCAG2AAA-Conformance'
|
||||
);
|
||||
?>
|
||||
</p>
|
||||
<p>
|
||||
<?php
|
||||
_e( 'The colors are perceptually uniform from light to dark in each range, which means they start at white and get darker by the same amount with each step.' );
|
||||
_e( 'Starting in this release the Pattern Transformations tool will suggest block patterns based on the block you are using. Right now, you can give it a try in the Query Block and Social Icon Block. As more patterns are added, you will be able to get inspiration for how to style your site without ever leaving the editor!' );
|
||||
?>
|
||||
</p>
|
||||
</div>
|
||||
<div class="column about__image has-subtle-background-color"></div>
|
||||
</div>
|
||||
|
||||
<hr />
|
||||
|
||||
<div class="about__section has-2-columns is-wider-left">
|
||||
<div class="column about__image has-subtle-background-color"></div>
|
||||
<div class="column">
|
||||
<h3>
|
||||
<?php _e( 'Style and Colorize Images' ); ?>
|
||||
</h3>
|
||||
<p>
|
||||
<?php
|
||||
_e( 'Half the range has a 4.5 or higher contrast ratio against black, and the other half maintains the same contrast against white.' );
|
||||
?>
|
||||
</p>
|
||||
<p>
|
||||
<?php
|
||||
printf(
|
||||
/* translators: %s: Color palette dev note link. */
|
||||
__( 'Find the new palette in the default WordPress Dashboard color scheme, and use it when you’re building themes, plugins, or any other components. For all the details, <a href="%s">check out the Color Palette dev note</a>.' ),
|
||||
'https://make.wordpress.org/core/2021/02/23/standardization-of-wp-admin-colors-in-wordpress-5-7'
|
||||
);
|
||||
_e( 'Colorize your image and cover blocks with duotone filters! Duotone can add a pop of color to your designs and style your images (or videos in the cover block) to integrate well with your themes. You can think of the duotone effect as a black and white filter, but instead of the shadows being black and the highlights being white, you pick your own colors for the shadows and highlights. There’s more to learn about how it works in the documentation.' );
|
||||
?>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="about__section has-subtle-background-color">
|
||||
<div class="column about__image">
|
||||
<picture>
|
||||
<source media="(max-width: 600px)" srcset="<?php echo esc_url( admin_url( 'images/about-color-palette-vert.svg' ) ); ?>" />
|
||||
<img alt="" src="<?php echo esc_url( admin_url( 'images/about-color-palette.svg' ) ); ?>" />
|
||||
</picture>
|
||||
<hr class="is-large" />
|
||||
|
||||
<div class="about__section">
|
||||
<h2 class="aligncenter has-accent-color">
|
||||
<?php _e( 'For Developers to Explore' ); ?>
|
||||
</h2>
|
||||
<div class="column about__image has-subtle-background-color" style="margin:32px 0;height:360px;"></div>
|
||||
</div>
|
||||
|
||||
<div class="about__section has-1-column">
|
||||
<div class="column">
|
||||
<h3>
|
||||
<?php _e( 'Theme.json' ); ?>
|
||||
</h3>
|
||||
<p>
|
||||
<?php
|
||||
_e( 'Introducing the Global Styles and Global Settings APIs: control the editor settings, available customization tools, and style blocks using a theme.json file in the active theme. This configuration file enables or disables features and sets default styles for both a website and blocks. If you build themes, you can experiment with this early iteration of a useful new feature. For more about what is currently available and how it works, check out this dev note.' );
|
||||
?>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr />
|
||||
|
||||
<div class="about__section has-2-columns">
|
||||
<div class="about__section has-3-columns">
|
||||
<div class="column">
|
||||
<h3><?php _e( 'From HTTP to HTTPS in a single click' ); ?></h3>
|
||||
<p><?php _e( 'Starting now, switching a site from HTTP to HTTPS is a one-click move. WordPress will automatically update database URLs when you make the switch. No more hunting and guessing!' ); ?></p>
|
||||
<h3><?php _e( 'New Robots API' ); ?></h3>
|
||||
<h3>
|
||||
<?php _e( 'Dropping support for Internet Explorer 11' ); ?>
|
||||
</h3>
|
||||
<p>
|
||||
<?php
|
||||
_e( 'The new Robots API lets you include the filter directives in the robots meta tag, and the API includes the <code>max-image-preview: large</code> directive by default. That means search engines can show bigger image previews, which can boost your traffic (unless the site is marked <em>not-public</em>).' );
|
||||
printf(
|
||||
/* translators: %s: Link to Browse Happy. */
|
||||
__( 'Support for Internet Explorer 11 has been dropped as of this release. This means you may have issues managing your site that will not be fixed in the future. If you are currently using IE11, it is strongly recommended that you <a href="%s">switch to a more modern browser</a>.' ),
|
||||
'https://browsehappy.com/'
|
||||
);
|
||||
?>
|
||||
</p>
|
||||
</div>
|
||||
<div class="column">
|
||||
<h3><?php _e( 'Ongoing cleanup after update to jQuery 3.5.1' ); ?></h3>
|
||||
<p><?php _e( 'For years jQuery helped make things move on the screen in ways the basic tools couldn’t—but that keeps changing, and so does jQuery.' ); ?></p>
|
||||
<p><?php _e( 'In 5.7, jQuery gets more focused and less intrusive, with fewer messages in the console.' ); ?></p>
|
||||
<h3><?php _e( 'Lazy-load your iframes' ); ?></h3>
|
||||
<p><?php _e( 'Now it’s simple to let iframes lazy-load. By default, WordPress will add a <code>loading="lazy"</code> attribute to iframe tags when both width and height are specified.' ); ?></p>
|
||||
<h3>
|
||||
<?php _e( 'Adding support for WebP' ); ?>
|
||||
</h3>
|
||||
<p>
|
||||
<?php
|
||||
_e( 'WebP is a modern image format that provides improved lossless and lossy compression for images on the web. WebP images are around 30% smaller on average than their JPEG or PNG equivalents, resulting in sites that are faster and use less bandwidth.' );
|
||||
?>
|
||||
</p>
|
||||
</div>
|
||||
<div class="column">
|
||||
<h3>
|
||||
<?php _e( 'Adding Additional Block Supports' ); ?>
|
||||
</h3>
|
||||
<p>
|
||||
<?php
|
||||
printf(
|
||||
/* translators: %1$s: Link to 5.6's block dev notes. %2$s: Link to 5.7's block dev notes. %1$s: Link to 5.8's block dev notes. */
|
||||
__( 'Expanding on previously implemented block supports in WordPress <a href="%1$s">5.6</a> and <a href="%2$s">5.7</a>, WordPress 5.8 introduces several new block <code>supports</code> flags and new options to customize your registered blocks. More information is available in the <a href="%3$s">block supports dev note</a>.' ),
|
||||
'https://make.wordpress.org/core/2020/11/18/block-supports-in-wordpress-5-6/',
|
||||
'https://make.wordpress.org/core/2021/02/24/changes-to-block-editor-components-and-blocks/',
|
||||
'https://make.wordpress.org/core/2021/06/25/block-supports-api-updates-for-wordpress-5-8/'
|
||||
);
|
||||
?>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -215,9 +232,9 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
|
|||
<p>
|
||||
<?php
|
||||
printf(
|
||||
/* translators: %s: WordPress 5.7 Field Guide link. */
|
||||
__( 'Check out the latest version of the WordPress Field Guide. It highlights developer notes for each change you may want to be aware of. <a href="%s">WordPress 5.7 Field Guide.</a>' ),
|
||||
'https://make.wordpress.org/core/2021/02/23/wordpress-5-7-field-guide'
|
||||
/* translators: %s: WordPress 5.8 Field Guide link. */
|
||||
__( 'Check out the latest version of the WordPress Field Guide. It highlights developer notes for each change you may want to be aware of. <a href="%s">WordPress 5.8 Field Guide.</a>' ),
|
||||
'#'
|
||||
);
|
||||
?>
|
||||
</p>
|
||||
|
|
@ -238,83 +255,6 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
|
|||
|
||||
<?php require_once ABSPATH . 'wp-admin/admin-footer.php'; ?>
|
||||
|
||||
<script>
|
||||
window.addEventListener( 'load', function() {
|
||||
var createElement = wp.element.createElement;
|
||||
var Fragment = wp.element.Fragment;
|
||||
var render = wp.element.render;
|
||||
var useState = wp.element.useState;
|
||||
var ResizableBox = wp.components.ResizableBox;
|
||||
|
||||
var container = document.getElementById( 'about-image-comparison' );
|
||||
var images = container ? container.querySelectorAll( 'img' ) : [];
|
||||
if ( ! images.length ) {
|
||||
// Something's wrong, return early.
|
||||
return;
|
||||
}
|
||||
|
||||
var beforeImage = images.item( 0 );
|
||||
var afterImage = images.item( 1 );
|
||||
var caption = container.querySelector( 'figcaption' ).innerText;
|
||||
|
||||
function ImageComparison( props ) {
|
||||
var stateHelper = useState( props.width );
|
||||
var width = stateHelper[0];
|
||||
var setWidth = stateHelper[1];
|
||||
|
||||
return createElement(
|
||||
'div',
|
||||
{
|
||||
className: 'about__image-comparison'
|
||||
},
|
||||
createElement( 'img', { src: beforeImage.src, alt: beforeImage.alt } ),
|
||||
createElement(
|
||||
ResizableBox,
|
||||
{
|
||||
size: {
|
||||
width: width,
|
||||
height: props.height
|
||||
},
|
||||
onResizeStop: function( event, direction, elt, delta ) {
|
||||
setWidth( parseInt( width + delta.width, 10 ) );
|
||||
},
|
||||
showHandle: true,
|
||||
enable: {
|
||||
top: false,
|
||||
right: ! wp.i18n.isRTL(),
|
||||
bottom: false,
|
||||
left: wp.i18n.isRTL(),
|
||||
},
|
||||
className: 'about__image-comparison-resize'
|
||||
},
|
||||
createElement(
|
||||
'div',
|
||||
{
|
||||
style: { width: '100%', height: '100%', overflow: 'hidden' }
|
||||
},
|
||||
createElement('img', { src: afterImage.src, alt: afterImage.alt } )
|
||||
)
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
render(
|
||||
createElement(
|
||||
Fragment,
|
||||
{},
|
||||
createElement(
|
||||
ImageComparison,
|
||||
{
|
||||
width: beforeImage.clientWidth / 2,
|
||||
height: beforeImage.clientHeight
|
||||
}
|
||||
),
|
||||
createElement( 'figcaption', {}, caption )
|
||||
),
|
||||
container
|
||||
);
|
||||
} );
|
||||
</script>
|
||||
<?php
|
||||
|
||||
// These are strings we may use to describe maintenance/security releases, where we aim for no new strings.
|
||||
|
|
|
|||
|
|
@ -21,21 +21,14 @@ $credits = wp_credits();
|
|||
<div class="wrap about__container">
|
||||
|
||||
<div class="about__header">
|
||||
<div class="about__header-image">
|
||||
<img alt="<?php _e( 'Code is Poetry' ); ?>" src="<?php echo esc_url( admin_url( 'images/about-badge.svg' ) ); ?>" />
|
||||
<div class="about__header-title">
|
||||
<h1>
|
||||
<?php _e( 'Contributors' ); ?>
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<div class="about__header-container">
|
||||
<div class="about__header-title">
|
||||
<p>
|
||||
<?php _e( 'WordPress' ); ?>
|
||||
<?php echo $display_version; ?>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="about__header-text">
|
||||
<?php _e( 'Jazz up your stories in an editor that’s cleaner, crisper, and does more to get out of your way.' ); ?>
|
||||
</div>
|
||||
<div class="about__header-text">
|
||||
<?php _e( 'WordPress 5.8 was created by a worldwide team of passionate individuals' ); ?>
|
||||
</div>
|
||||
|
||||
<nav class="about__header-navigation nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
|
||||
|
|
@ -47,9 +40,7 @@ $credits = wp_credits();
|
|||
</div>
|
||||
|
||||
<div class="about__section is-feature">
|
||||
<div class="column">
|
||||
<h1><?php _e( 'Credits' ); ?></h1>
|
||||
|
||||
<div class="column aligncenter">
|
||||
<?php if ( ! $credits ) : ?>
|
||||
|
||||
<p>
|
||||
|
|
@ -93,7 +84,7 @@ if ( ! $credits ) {
|
|||
<hr />
|
||||
|
||||
<div class="about__section">
|
||||
<div class="column has-subtle-background-color">
|
||||
<div class="column is-edge-to-edge">
|
||||
<?php wp_credits_section_title( $credits['groups']['core-developers'] ); ?>
|
||||
<?php wp_credits_section_list( $credits, 'core-developers' ); ?>
|
||||
<?php wp_credits_section_list( $credits, 'contributing-developers' ); ?>
|
||||
|
|
|
|||
|
|
@ -21,22 +21,24 @@
|
|||
|
||||
.about__container {
|
||||
/* Section backgrounds */
|
||||
--background: #fff;
|
||||
--subtle-background: #fde4bf;
|
||||
--background: transparent;
|
||||
--subtle-background: #def;
|
||||
|
||||
/* Main text color */
|
||||
--text: #00131c;
|
||||
--text: #000;
|
||||
--text-light: #fff;
|
||||
|
||||
/* Accent colors: used in header, on special classes. */
|
||||
--accent-1: #0a5b89; /* Accent background */
|
||||
--accent-2: #fde4bf; /* Heading subtitle */
|
||||
--accent-1: #3858e9; /* Accent background, link color */
|
||||
--accent-2: #2d46ba; /* Header background */
|
||||
|
||||
/* Navigation colors. */
|
||||
--nav-background: var(--background);
|
||||
--nav-border: #fcc36f;
|
||||
--nav-background: #fff;
|
||||
--nav-border: transparent;
|
||||
--nav-color: var(--text);
|
||||
--nav-current: #0a5b88;
|
||||
--nav-current: var(--accent-1);
|
||||
|
||||
--gap: 2rem;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
|
|
@ -47,14 +49,14 @@
|
|||
.credits-php,
|
||||
.freedoms-php,
|
||||
.privacy-php {
|
||||
background: #fff;
|
||||
background: #f0f7ff;
|
||||
}
|
||||
|
||||
.about-php #wpcontent,
|
||||
.credits-php #wpcontent,
|
||||
.freedoms-php #wpcontent,
|
||||
.privacy-php #wpcontent {
|
||||
background: white;
|
||||
background: linear-gradient(-180deg, #fff 50%, #f0f7ff 100%);
|
||||
padding: 0 24px;
|
||||
}
|
||||
|
||||
|
|
@ -98,20 +100,16 @@
|
|||
}
|
||||
|
||||
.about__section {
|
||||
background: #fff;
|
||||
background: var(--background);
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.about__container .has-accent-background-color {
|
||||
background-color: #0a5b89;
|
||||
background-color: var(--accent-1);
|
||||
color: #fff;
|
||||
color: var(--text-light);
|
||||
}
|
||||
|
||||
.about__container .has-accent-background-color a {
|
||||
color: #fff;
|
||||
color: var(--text-light);
|
||||
}
|
||||
|
||||
|
|
@ -120,9 +118,7 @@
|
|||
}
|
||||
|
||||
.about__container .has-accent-color {
|
||||
color: #00131c;
|
||||
color: var(--text);
|
||||
font-weight: bold;
|
||||
color: var(--accent-1);
|
||||
}
|
||||
|
||||
.about__container .has-border {
|
||||
|
|
@ -130,7 +126,6 @@
|
|||
}
|
||||
|
||||
.about__container .has-subtle-background-color {
|
||||
background-color: #fde4bf;
|
||||
background-color: var(--subtle-background);
|
||||
}
|
||||
|
||||
|
|
@ -143,11 +138,11 @@
|
|||
/* 1.1 - Layout */
|
||||
|
||||
.about__section {
|
||||
margin: 0;
|
||||
margin: 0 0 var(--gap);
|
||||
}
|
||||
|
||||
.about__section .column {
|
||||
padding: 32px;
|
||||
padding: var(--gap);
|
||||
}
|
||||
|
||||
.about__section + .about__section .column {
|
||||
|
|
@ -155,12 +150,12 @@
|
|||
}
|
||||
|
||||
.about__section + .about__section .is-section-header {
|
||||
padding-bottom: 32px;
|
||||
padding-bottom: var(--gap);
|
||||
}
|
||||
|
||||
.about__section .column[class*="background-color"],
|
||||
.about__section .column.has-border {
|
||||
padding-top: 32px;
|
||||
padding-top: var(--gap);
|
||||
}
|
||||
|
||||
.about__section .column.is-edge-to-edge {
|
||||
|
|
@ -177,12 +172,12 @@
|
|||
|
||||
.about__section .has-text-columns {
|
||||
columns: 2;
|
||||
column-gap: 64px;
|
||||
column-gap: calc(var(--gap) * 2);
|
||||
}
|
||||
|
||||
.about__section .is-section-header {
|
||||
margin-bottom: 0;
|
||||
padding: 32px 32px 0;
|
||||
padding: var(--gap) var(--gap) 0;
|
||||
}
|
||||
|
||||
.about__section .is-section-header p:last-child {
|
||||
|
|
@ -195,7 +190,7 @@
|
|||
}
|
||||
|
||||
.about__section.is-feature {
|
||||
padding: 32px;
|
||||
padding: var(--gap);
|
||||
}
|
||||
|
||||
.about__section.is-feature p {
|
||||
|
|
@ -203,7 +198,7 @@
|
|||
}
|
||||
|
||||
.about__section.is-feature p + p {
|
||||
margin-top: 1rem;
|
||||
margin-top: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-1-column {
|
||||
|
|
@ -220,7 +215,7 @@
|
|||
}
|
||||
|
||||
.about__section.has-gutters {
|
||||
gap: 16px;
|
||||
gap: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-2-columns {
|
||||
|
|
@ -334,13 +329,13 @@
|
|||
.about__section.has-2-columns.is-wider-left,
|
||||
.about__section.has-3-columns {
|
||||
display: block;
|
||||
padding-bottom: 16px;
|
||||
padding-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-2-columns.has-gutters .column,
|
||||
.about__section.has-2-columns.has-gutters .column,
|
||||
.about__section.has-3-columns.has-gutters .column {
|
||||
margin-bottom: 16px;
|
||||
margin-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-2-columns.has-gutters .column:last-child,
|
||||
|
|
@ -350,8 +345,8 @@
|
|||
}
|
||||
|
||||
.about__section.has-3-columns .column:nth-of-type(n) {
|
||||
padding-top: 16px;
|
||||
padding-bottom: 16px;
|
||||
padding-top: calc(var(--gap) / 2);
|
||||
padding-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-4-columns {
|
||||
|
|
@ -399,11 +394,11 @@
|
|||
@media screen and (max-width: 600px) {
|
||||
.about__section.has-2-columns {
|
||||
display: block;
|
||||
padding-bottom: 16px;
|
||||
padding-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-2-columns.has-gutters .column {
|
||||
margin-bottom: 16px;
|
||||
margin-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-2-columns.has-gutters .column:last-child {
|
||||
|
|
@ -411,8 +406,8 @@
|
|||
}
|
||||
|
||||
.about__section.has-2-columns .column:nth-of-type(n) {
|
||||
padding-top: 16px;
|
||||
padding-bottom: 16px;
|
||||
padding-top: calc(var(--gap) / 2);
|
||||
padding-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -423,11 +418,11 @@
|
|||
|
||||
.about__section.has-4-columns {
|
||||
display: block;
|
||||
padding-bottom: 16px;
|
||||
padding-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-4-columns.has-gutters .column {
|
||||
margin-bottom: 16px;
|
||||
margin-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-4-columns.has-gutters .column:last-child {
|
||||
|
|
@ -435,8 +430,8 @@
|
|||
}
|
||||
|
||||
.about__section.has-4-columns .column:nth-of-type(n) {
|
||||
padding-top: 16px;
|
||||
padding-bottom: 16px;
|
||||
padding-top: calc(var(--gap) / 2);
|
||||
padding-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -444,14 +439,11 @@
|
|||
|
||||
.about__container {
|
||||
line-height: 1.4;
|
||||
color: #00131c;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.about__container h1 {
|
||||
margin: 0 0 1em;
|
||||
padding: 0;
|
||||
font-weight: 600;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
|
|
@ -460,17 +452,18 @@
|
|||
.about__container h3.is-larger-heading {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.5em;
|
||||
font-size: 2.9em;
|
||||
font-size: 2em;
|
||||
line-height: 1.2;
|
||||
font-weight: 400;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.about__container h3,
|
||||
.about__container h1.is-smaller-heading,
|
||||
.about__container h2.is-smaller-heading {
|
||||
margin-top: 0;
|
||||
font-size: 1.5em;
|
||||
font-weight: 700;
|
||||
font-size: 1.6em;
|
||||
line-height: 1.3;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.about__container p {
|
||||
|
|
@ -479,7 +472,6 @@
|
|||
}
|
||||
|
||||
.about__section a {
|
||||
color: #0a5b89;
|
||||
color: var(--accent-1);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
|
@ -487,7 +479,6 @@
|
|||
.about__section a:hover,
|
||||
.about__section a:active,
|
||||
.about__section a:focus {
|
||||
color: #0a5b89;
|
||||
color: var(--accent-1);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
@ -504,7 +495,7 @@
|
|||
|
||||
.about__container ul {
|
||||
list-style: disc;
|
||||
margin-right: 16px;
|
||||
margin-right: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__container img {
|
||||
|
|
@ -562,7 +553,6 @@
|
|||
|
||||
.about__container .about__image-comparison.no-js .about__image-comparison-resize {
|
||||
overflow: hidden;
|
||||
border-left: 2px solid #007cba;
|
||||
border-left: 2px solid var(--wp-admin-theme-color);
|
||||
}
|
||||
|
||||
|
|
@ -580,17 +570,17 @@
|
|||
|
||||
.about__container hr {
|
||||
margin: 0;
|
||||
height: 32px;
|
||||
height: var(--gap);
|
||||
border: none;
|
||||
}
|
||||
|
||||
.about__container hr.is-small {
|
||||
height: 8px;
|
||||
height: calc(var(--gap) / 4);
|
||||
}
|
||||
|
||||
.about__container hr.is-large {
|
||||
height: 64px;
|
||||
margin: 16px auto;
|
||||
height: calc(var(--gap) * 2);
|
||||
margin: calc(var(--gap) / 2) auto;
|
||||
}
|
||||
|
||||
.about__container div.updated,
|
||||
|
|
@ -622,62 +612,66 @@
|
|||
/* 1.3 - Header */
|
||||
|
||||
.about__header {
|
||||
margin-bottom: 32px;
|
||||
padding-top: 3em;
|
||||
background-position: bottom center;
|
||||
margin-bottom: var(--gap);
|
||||
padding-top: 0;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-image: url('../images/about-header-brushes.svg');
|
||||
background-color: #0a5b89;
|
||||
background-color: var(--accent-1);
|
||||
color: #fff;
|
||||
background-image: url('../images/about-header-about.svg');
|
||||
background-color: var(--accent-2);
|
||||
color: var(--text-light);
|
||||
}
|
||||
|
||||
.credits-php .about__header {
|
||||
background-image: url('../images/about-header-credits.svg');
|
||||
}
|
||||
|
||||
.freedoms-php .about__header {
|
||||
background-image: url('../images/about-header-freedoms.svg');
|
||||
}
|
||||
|
||||
.privacy-php .about__header {
|
||||
background-image: url('../images/about-header-privacy.svg');
|
||||
}
|
||||
|
||||
.about__header-image {
|
||||
margin: 0 32px 3em;
|
||||
margin: 0 var(--gap) 3em;
|
||||
}
|
||||
|
||||
.about__header-title {
|
||||
padding: 1em 0;
|
||||
margin: 0 32px;
|
||||
text-align: center;
|
||||
padding: 2rem 0 0;
|
||||
margin: 0 2rem;
|
||||
}
|
||||
|
||||
.about__header-title p {
|
||||
margin: 0;
|
||||
.about__header-title h1 {
|
||||
margin: 0 0 0.5rem;
|
||||
padding: 0;
|
||||
font-size: 6em;
|
||||
font-size: 4.5rem;
|
||||
line-height: 1;
|
||||
font-weight: 900;
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.about__header-text {
|
||||
max-width: 25em;
|
||||
margin: 0 auto 8em;
|
||||
padding: 0 16px;
|
||||
font-size: 1.5em;
|
||||
line-height: 1.4;
|
||||
color: #fde4bf;
|
||||
color: var(--accent-2);
|
||||
text-align: center;
|
||||
max-width: 42rem;
|
||||
margin: 0 0 5em;
|
||||
padding: 0 2rem;
|
||||
font-size: 2rem;
|
||||
line-height: 1.15;
|
||||
}
|
||||
|
||||
.about__header-navigation {
|
||||
clear: both;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top: 0;
|
||||
background: #fff;
|
||||
background: var(--nav-background);
|
||||
color: #00131c;
|
||||
color: var(--nav-color);
|
||||
border-bottom: 3px solid #fcc36f;
|
||||
border-bottom: 3px solid var(--nav-border);
|
||||
}
|
||||
|
||||
.about__header-navigation .nav-tab {
|
||||
margin-right: 0;
|
||||
padding: 24px 32px;
|
||||
padding: calc(var(--gap) * 0.75) var(--gap);
|
||||
float: none;
|
||||
font-size: 1.4em;
|
||||
line-height: 1;
|
||||
border-width: 0 0 3px;
|
||||
|
|
@ -689,33 +683,26 @@
|
|||
|
||||
.about__header-navigation .nav-tab:hover,
|
||||
.about__header-navigation .nav-tab:active {
|
||||
background-color: #0a5b88;
|
||||
background-color: var(--nav-current);
|
||||
color: #fff;
|
||||
color: var(--text-light);
|
||||
}
|
||||
|
||||
.about__header-navigation .nav-tab-active {
|
||||
margin-bottom: -3px;
|
||||
color: #0a5b88;
|
||||
color: var(--nav-current);
|
||||
border-width: 0 0 6px;
|
||||
border-color: #0a5b88;
|
||||
border-color: var(--nav-current);
|
||||
}
|
||||
|
||||
.about__header-navigation .nav-tab-active:hover,
|
||||
.about__header-navigation .nav-tab-active:active {
|
||||
background-color: #0a5b88;
|
||||
background-color: var(--nav-current);
|
||||
color: #fff;
|
||||
color: var(--text-light);
|
||||
border-color: #0a5b88;
|
||||
border-color: var(--nav-current);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 960px){
|
||||
.about__header-title p {
|
||||
.about__header-title h1 {
|
||||
font-size: 4.8em;
|
||||
}
|
||||
}
|
||||
|
|
@ -731,22 +718,20 @@
|
|||
|
||||
.about__header-title,
|
||||
.about__header-image {
|
||||
margin-right: 16px;
|
||||
margin-left: 16px;
|
||||
margin-right: calc(var(--gap) / 2);
|
||||
margin-left: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__header-text,
|
||||
.about__header-navigation .nav-tab {
|
||||
margin-top: 0;
|
||||
margin-left: 0;
|
||||
padding: 24px 16px;
|
||||
padding-right: calc(var(--gap) / 2);
|
||||
padding-left: calc(var(--gap) / 2);
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
.about__header {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
.about__header-title p {
|
||||
font-size: 2.4em;
|
||||
}
|
||||
|
|
@ -755,11 +740,14 @@
|
|||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.about__header-navigation {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.about__header-navigation .nav-tab {
|
||||
float: none;
|
||||
display: block;
|
||||
margin-bottom: 0;
|
||||
padding: 16px 16px;
|
||||
padding: calc(var(--gap) / 2);
|
||||
border-right-width: 6px;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
|
@ -775,47 +763,59 @@
|
|||
2.0 - Credits Page
|
||||
------------------------------------------------------------------------------*/
|
||||
|
||||
.about__section .wp-people-group-title {
|
||||
margin-bottom: calc(var(--gap) * 2);
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
.about__section .wp-people-group {
|
||||
margin: 0;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.about__section .wp-person {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
box-sizing: border-box;
|
||||
padding: 0 0 1em 1em;
|
||||
height: 6em;
|
||||
width: calc( 33% - 4px );
|
||||
min-width: 280px;
|
||||
margin-bottom: var(--gap);
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.about__section .compact .wp-person {
|
||||
height: auto;
|
||||
width: calc( 25% - 4px );
|
||||
min-width: 220px;
|
||||
padding-bottom: 0.5em;
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.about__section .wp-person-avatar {
|
||||
display: block;
|
||||
margin: 0 auto calc(var(--gap) / 2);
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
border-radius: 100%;
|
||||
overflow: hidden;
|
||||
background: var(--accent-1);
|
||||
}
|
||||
|
||||
.about__section .wp-person .gravatar {
|
||||
float: right;
|
||||
margin: -4px 0 0.85em 0.85em;
|
||||
padding: 1px;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border-radius: 100%;
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
filter: grayscale(100%);
|
||||
mix-blend-mode: screen;
|
||||
}
|
||||
|
||||
.about__section .compact .wp-person-avatar,
|
||||
.about__section .compact .wp-person .gravatar {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.about__section .wp-person .web {
|
||||
font-size: 1.4em;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
color: #00131c;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.about__section .wp-person .web:hover {
|
||||
|
|
@ -831,16 +831,41 @@
|
|||
margin-top: 0.5em;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 782px) {
|
||||
.about__section .wp-person {
|
||||
width: 33%;
|
||||
}
|
||||
|
||||
.about__section .compact .wp-person {
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
.about__section .wp-person-avatar,
|
||||
.about__section .wp-person .gravatar {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
.about__section .wp-person {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.about__section .compact .wp-person {
|
||||
width: 33%;
|
||||
}
|
||||
|
||||
.about__section .wp-person .web {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
.about__section .wp-person {
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
.about__section .wp-person .gravatar {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.about__section .wp-person .web {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -20,22 +20,24 @@
|
|||
|
||||
.about__container {
|
||||
/* Section backgrounds */
|
||||
--background: #fff;
|
||||
--subtle-background: #fde4bf;
|
||||
--background: transparent;
|
||||
--subtle-background: #def;
|
||||
|
||||
/* Main text color */
|
||||
--text: #00131c;
|
||||
--text: #000;
|
||||
--text-light: #fff;
|
||||
|
||||
/* Accent colors: used in header, on special classes. */
|
||||
--accent-1: #0a5b89; /* Accent background */
|
||||
--accent-2: #fde4bf; /* Heading subtitle */
|
||||
--accent-1: #3858e9; /* Accent background, link color */
|
||||
--accent-2: #2d46ba; /* Header background */
|
||||
|
||||
/* Navigation colors. */
|
||||
--nav-background: var(--background);
|
||||
--nav-border: #fcc36f;
|
||||
--nav-background: #fff;
|
||||
--nav-border: transparent;
|
||||
--nav-color: var(--text);
|
||||
--nav-current: #0a5b88;
|
||||
--nav-current: var(--accent-1);
|
||||
|
||||
--gap: 2rem;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
|
|
@ -46,14 +48,14 @@
|
|||
.credits-php,
|
||||
.freedoms-php,
|
||||
.privacy-php {
|
||||
background: #fff;
|
||||
background: #f0f7ff;
|
||||
}
|
||||
|
||||
.about-php #wpcontent,
|
||||
.credits-php #wpcontent,
|
||||
.freedoms-php #wpcontent,
|
||||
.privacy-php #wpcontent {
|
||||
background: white;
|
||||
background: linear-gradient(180deg, #fff 50%, #f0f7ff 100%);
|
||||
padding: 0 24px;
|
||||
}
|
||||
|
||||
|
|
@ -97,20 +99,16 @@
|
|||
}
|
||||
|
||||
.about__section {
|
||||
background: #fff;
|
||||
background: var(--background);
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.about__container .has-accent-background-color {
|
||||
background-color: #0a5b89;
|
||||
background-color: var(--accent-1);
|
||||
color: #fff;
|
||||
color: var(--text-light);
|
||||
}
|
||||
|
||||
.about__container .has-accent-background-color a {
|
||||
color: #fff;
|
||||
color: var(--text-light);
|
||||
}
|
||||
|
||||
|
|
@ -119,9 +117,7 @@
|
|||
}
|
||||
|
||||
.about__container .has-accent-color {
|
||||
color: #00131c;
|
||||
color: var(--text);
|
||||
font-weight: bold;
|
||||
color: var(--accent-1);
|
||||
}
|
||||
|
||||
.about__container .has-border {
|
||||
|
|
@ -129,7 +125,6 @@
|
|||
}
|
||||
|
||||
.about__container .has-subtle-background-color {
|
||||
background-color: #fde4bf;
|
||||
background-color: var(--subtle-background);
|
||||
}
|
||||
|
||||
|
|
@ -142,11 +137,11 @@
|
|||
/* 1.1 - Layout */
|
||||
|
||||
.about__section {
|
||||
margin: 0;
|
||||
margin: 0 0 var(--gap);
|
||||
}
|
||||
|
||||
.about__section .column {
|
||||
padding: 32px;
|
||||
padding: var(--gap);
|
||||
}
|
||||
|
||||
.about__section + .about__section .column {
|
||||
|
|
@ -154,12 +149,12 @@
|
|||
}
|
||||
|
||||
.about__section + .about__section .is-section-header {
|
||||
padding-bottom: 32px;
|
||||
padding-bottom: var(--gap);
|
||||
}
|
||||
|
||||
.about__section .column[class*="background-color"],
|
||||
.about__section .column.has-border {
|
||||
padding-top: 32px;
|
||||
padding-top: var(--gap);
|
||||
}
|
||||
|
||||
.about__section .column.is-edge-to-edge {
|
||||
|
|
@ -176,12 +171,12 @@
|
|||
|
||||
.about__section .has-text-columns {
|
||||
columns: 2;
|
||||
column-gap: 64px;
|
||||
column-gap: calc(var(--gap) * 2);
|
||||
}
|
||||
|
||||
.about__section .is-section-header {
|
||||
margin-bottom: 0;
|
||||
padding: 32px 32px 0;
|
||||
padding: var(--gap) var(--gap) 0;
|
||||
}
|
||||
|
||||
.about__section .is-section-header p:last-child {
|
||||
|
|
@ -194,7 +189,7 @@
|
|||
}
|
||||
|
||||
.about__section.is-feature {
|
||||
padding: 32px;
|
||||
padding: var(--gap);
|
||||
}
|
||||
|
||||
.about__section.is-feature p {
|
||||
|
|
@ -202,7 +197,7 @@
|
|||
}
|
||||
|
||||
.about__section.is-feature p + p {
|
||||
margin-top: 1rem;
|
||||
margin-top: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-1-column {
|
||||
|
|
@ -219,7 +214,7 @@
|
|||
}
|
||||
|
||||
.about__section.has-gutters {
|
||||
gap: 16px;
|
||||
gap: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-2-columns {
|
||||
|
|
@ -333,13 +328,13 @@
|
|||
.about__section.has-2-columns.is-wider-left,
|
||||
.about__section.has-3-columns {
|
||||
display: block;
|
||||
padding-bottom: 16px;
|
||||
padding-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-2-columns.has-gutters .column,
|
||||
.about__section.has-2-columns.has-gutters .column,
|
||||
.about__section.has-3-columns.has-gutters .column {
|
||||
margin-bottom: 16px;
|
||||
margin-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-2-columns.has-gutters .column:last-child,
|
||||
|
|
@ -349,8 +344,8 @@
|
|||
}
|
||||
|
||||
.about__section.has-3-columns .column:nth-of-type(n) {
|
||||
padding-top: 16px;
|
||||
padding-bottom: 16px;
|
||||
padding-top: calc(var(--gap) / 2);
|
||||
padding-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-4-columns {
|
||||
|
|
@ -398,11 +393,11 @@
|
|||
@media screen and (max-width: 600px) {
|
||||
.about__section.has-2-columns {
|
||||
display: block;
|
||||
padding-bottom: 16px;
|
||||
padding-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-2-columns.has-gutters .column {
|
||||
margin-bottom: 16px;
|
||||
margin-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-2-columns.has-gutters .column:last-child {
|
||||
|
|
@ -410,8 +405,8 @@
|
|||
}
|
||||
|
||||
.about__section.has-2-columns .column:nth-of-type(n) {
|
||||
padding-top: 16px;
|
||||
padding-bottom: 16px;
|
||||
padding-top: calc(var(--gap) / 2);
|
||||
padding-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -422,11 +417,11 @@
|
|||
|
||||
.about__section.has-4-columns {
|
||||
display: block;
|
||||
padding-bottom: 16px;
|
||||
padding-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-4-columns.has-gutters .column {
|
||||
margin-bottom: 16px;
|
||||
margin-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__section.has-4-columns.has-gutters .column:last-child {
|
||||
|
|
@ -434,8 +429,8 @@
|
|||
}
|
||||
|
||||
.about__section.has-4-columns .column:nth-of-type(n) {
|
||||
padding-top: 16px;
|
||||
padding-bottom: 16px;
|
||||
padding-top: calc(var(--gap) / 2);
|
||||
padding-bottom: calc(var(--gap) / 2);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -443,14 +438,11 @@
|
|||
|
||||
.about__container {
|
||||
line-height: 1.4;
|
||||
color: #00131c;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.about__container h1 {
|
||||
margin: 0 0 1em;
|
||||
padding: 0;
|
||||
font-weight: 600;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
|
|
@ -459,17 +451,18 @@
|
|||
.about__container h3.is-larger-heading {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.5em;
|
||||
font-size: 2.9em;
|
||||
font-size: 2em;
|
||||
line-height: 1.2;
|
||||
font-weight: 400;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.about__container h3,
|
||||
.about__container h1.is-smaller-heading,
|
||||
.about__container h2.is-smaller-heading {
|
||||
margin-top: 0;
|
||||
font-size: 1.5em;
|
||||
font-weight: 700;
|
||||
font-size: 1.6em;
|
||||
line-height: 1.3;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.about__container p {
|
||||
|
|
@ -478,7 +471,6 @@
|
|||
}
|
||||
|
||||
.about__section a {
|
||||
color: #0a5b89;
|
||||
color: var(--accent-1);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
|
@ -486,7 +478,6 @@
|
|||
.about__section a:hover,
|
||||
.about__section a:active,
|
||||
.about__section a:focus {
|
||||
color: #0a5b89;
|
||||
color: var(--accent-1);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
@ -503,7 +494,7 @@
|
|||
|
||||
.about__container ul {
|
||||
list-style: disc;
|
||||
margin-left: 16px;
|
||||
margin-left: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__container img {
|
||||
|
|
@ -561,7 +552,6 @@
|
|||
|
||||
.about__container .about__image-comparison.no-js .about__image-comparison-resize {
|
||||
overflow: hidden;
|
||||
border-right: 2px solid #007cba;
|
||||
border-right: 2px solid var(--wp-admin-theme-color);
|
||||
}
|
||||
|
||||
|
|
@ -579,17 +569,17 @@
|
|||
|
||||
.about__container hr {
|
||||
margin: 0;
|
||||
height: 32px;
|
||||
height: var(--gap);
|
||||
border: none;
|
||||
}
|
||||
|
||||
.about__container hr.is-small {
|
||||
height: 8px;
|
||||
height: calc(var(--gap) / 4);
|
||||
}
|
||||
|
||||
.about__container hr.is-large {
|
||||
height: 64px;
|
||||
margin: 16px auto;
|
||||
height: calc(var(--gap) * 2);
|
||||
margin: calc(var(--gap) / 2) auto;
|
||||
}
|
||||
|
||||
.about__container div.updated,
|
||||
|
|
@ -621,62 +611,66 @@
|
|||
/* 1.3 - Header */
|
||||
|
||||
.about__header {
|
||||
margin-bottom: 32px;
|
||||
padding-top: 3em;
|
||||
background-position: bottom center;
|
||||
margin-bottom: var(--gap);
|
||||
padding-top: 0;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-image: url('../images/about-header-brushes.svg');
|
||||
background-color: #0a5b89;
|
||||
background-color: var(--accent-1);
|
||||
color: #fff;
|
||||
background-image: url('../images/about-header-about.svg');
|
||||
background-color: var(--accent-2);
|
||||
color: var(--text-light);
|
||||
}
|
||||
|
||||
.credits-php .about__header {
|
||||
background-image: url('../images/about-header-credits.svg');
|
||||
}
|
||||
|
||||
.freedoms-php .about__header {
|
||||
background-image: url('../images/about-header-freedoms.svg');
|
||||
}
|
||||
|
||||
.privacy-php .about__header {
|
||||
background-image: url('../images/about-header-privacy.svg');
|
||||
}
|
||||
|
||||
.about__header-image {
|
||||
margin: 0 32px 3em;
|
||||
margin: 0 var(--gap) 3em;
|
||||
}
|
||||
|
||||
.about__header-title {
|
||||
padding: 1em 0;
|
||||
margin: 0 32px;
|
||||
text-align: center;
|
||||
padding: 2rem 0 0;
|
||||
margin: 0 2rem;
|
||||
}
|
||||
|
||||
.about__header-title p {
|
||||
margin: 0;
|
||||
.about__header-title h1 {
|
||||
margin: 0 0 0.5rem;
|
||||
padding: 0;
|
||||
font-size: 6em;
|
||||
font-size: 4.5rem;
|
||||
line-height: 1;
|
||||
font-weight: 900;
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.about__header-text {
|
||||
max-width: 25em;
|
||||
margin: 0 auto 8em;
|
||||
padding: 0 16px;
|
||||
font-size: 1.5em;
|
||||
line-height: 1.4;
|
||||
color: #fde4bf;
|
||||
color: var(--accent-2);
|
||||
text-align: center;
|
||||
max-width: 42rem;
|
||||
margin: 0 0 5em;
|
||||
padding: 0 2rem;
|
||||
font-size: 2rem;
|
||||
line-height: 1.15;
|
||||
}
|
||||
|
||||
.about__header-navigation {
|
||||
clear: both;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top: 0;
|
||||
background: #fff;
|
||||
background: var(--nav-background);
|
||||
color: #00131c;
|
||||
color: var(--nav-color);
|
||||
border-bottom: 3px solid #fcc36f;
|
||||
border-bottom: 3px solid var(--nav-border);
|
||||
}
|
||||
|
||||
.about__header-navigation .nav-tab {
|
||||
margin-left: 0;
|
||||
padding: 24px 32px;
|
||||
padding: calc(var(--gap) * 0.75) var(--gap);
|
||||
float: none;
|
||||
font-size: 1.4em;
|
||||
line-height: 1;
|
||||
border-width: 0 0 3px;
|
||||
|
|
@ -688,33 +682,26 @@
|
|||
|
||||
.about__header-navigation .nav-tab:hover,
|
||||
.about__header-navigation .nav-tab:active {
|
||||
background-color: #0a5b88;
|
||||
background-color: var(--nav-current);
|
||||
color: #fff;
|
||||
color: var(--text-light);
|
||||
}
|
||||
|
||||
.about__header-navigation .nav-tab-active {
|
||||
margin-bottom: -3px;
|
||||
color: #0a5b88;
|
||||
color: var(--nav-current);
|
||||
border-width: 0 0 6px;
|
||||
border-color: #0a5b88;
|
||||
border-color: var(--nav-current);
|
||||
}
|
||||
|
||||
.about__header-navigation .nav-tab-active:hover,
|
||||
.about__header-navigation .nav-tab-active:active {
|
||||
background-color: #0a5b88;
|
||||
background-color: var(--nav-current);
|
||||
color: #fff;
|
||||
color: var(--text-light);
|
||||
border-color: #0a5b88;
|
||||
border-color: var(--nav-current);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 960px){
|
||||
.about__header-title p {
|
||||
.about__header-title h1 {
|
||||
font-size: 4.8em;
|
||||
}
|
||||
}
|
||||
|
|
@ -730,22 +717,20 @@
|
|||
|
||||
.about__header-title,
|
||||
.about__header-image {
|
||||
margin-left: 16px;
|
||||
margin-right: 16px;
|
||||
margin-left: calc(var(--gap) / 2);
|
||||
margin-right: calc(var(--gap) / 2);
|
||||
}
|
||||
|
||||
.about__header-text,
|
||||
.about__header-navigation .nav-tab {
|
||||
margin-top: 0;
|
||||
margin-right: 0;
|
||||
padding: 24px 16px;
|
||||
padding-left: calc(var(--gap) / 2);
|
||||
padding-right: calc(var(--gap) / 2);
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
.about__header {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
.about__header-title p {
|
||||
font-size: 2.4em;
|
||||
}
|
||||
|
|
@ -754,11 +739,14 @@
|
|||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.about__header-navigation {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.about__header-navigation .nav-tab {
|
||||
float: none;
|
||||
display: block;
|
||||
margin-bottom: 0;
|
||||
padding: 16px 16px;
|
||||
padding: calc(var(--gap) / 2);
|
||||
border-left-width: 6px;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
|
@ -774,47 +762,59 @@
|
|||
2.0 - Credits Page
|
||||
------------------------------------------------------------------------------*/
|
||||
|
||||
.about__section .wp-people-group-title {
|
||||
margin-bottom: calc(var(--gap) * 2);
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
.about__section .wp-people-group {
|
||||
margin: 0;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.about__section .wp-person {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
box-sizing: border-box;
|
||||
padding: 0 1em 1em 0;
|
||||
height: 6em;
|
||||
width: calc( 33% - 4px );
|
||||
min-width: 280px;
|
||||
margin-bottom: var(--gap);
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.about__section .compact .wp-person {
|
||||
height: auto;
|
||||
width: calc( 25% - 4px );
|
||||
min-width: 220px;
|
||||
padding-bottom: 0.5em;
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.about__section .wp-person-avatar {
|
||||
display: block;
|
||||
margin: 0 auto calc(var(--gap) / 2);
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
border-radius: 100%;
|
||||
overflow: hidden;
|
||||
background: var(--accent-1);
|
||||
}
|
||||
|
||||
.about__section .wp-person .gravatar {
|
||||
float: left;
|
||||
margin: -4px 0.85em 0.85em 0;
|
||||
padding: 1px;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border-radius: 100%;
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
filter: grayscale(100%);
|
||||
mix-blend-mode: screen;
|
||||
}
|
||||
|
||||
.about__section .compact .wp-person-avatar,
|
||||
.about__section .compact .wp-person .gravatar {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.about__section .wp-person .web {
|
||||
font-size: 1.4em;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
color: #00131c;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.about__section .wp-person .web:hover {
|
||||
|
|
@ -830,16 +830,41 @@
|
|||
margin-top: 0.5em;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 782px) {
|
||||
.about__section .wp-person {
|
||||
width: 33%;
|
||||
}
|
||||
|
||||
.about__section .compact .wp-person {
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
.about__section .wp-person-avatar,
|
||||
.about__section .wp-person .gravatar {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
.about__section .wp-person {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.about__section .compact .wp-person {
|
||||
width: 33%;
|
||||
}
|
||||
|
||||
.about__section .wp-person .web {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
.about__section .wp-person {
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
.about__section .wp-person .gravatar {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.about__section .wp-person .web {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -24,21 +24,14 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
|
|||
<div class="wrap about__container">
|
||||
|
||||
<div class="about__header">
|
||||
<div class="about__header-image">
|
||||
<img alt="<?php _e( 'Code is Poetry' ); ?>" src="<?php echo esc_url( admin_url( 'images/about-badge.svg' ) ); ?>" />
|
||||
<div class="about__header-title">
|
||||
<h1>
|
||||
<?php _e( 'The Four Freedoms' ); ?>
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<div class="about__header-container">
|
||||
<div class="about__header-title">
|
||||
<p>
|
||||
<?php _e( 'WordPress' ); ?>
|
||||
<?php echo $display_version; ?>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="about__header-text">
|
||||
<?php _e( 'Jazz up your stories in an editor that’s cleaner, crisper, and does more to get out of your way.' ); ?>
|
||||
</div>
|
||||
<div class="about__header-text">
|
||||
<?php _e( 'WordPress is free and open source software, built by a distributed community of mostly volunteer developers from around the world' ); ?>
|
||||
</div>
|
||||
|
||||
<nav class="about__header-navigation nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
|
||||
|
|
@ -50,8 +43,6 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
|
|||
</div>
|
||||
|
||||
<div class="about__section has-subtle-background-color is-feature">
|
||||
<h1><?php _e( 'Freedoms' ); ?></h1>
|
||||
|
||||
<p class="about-description">
|
||||
<?php
|
||||
printf(
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 6.5 KiB |
|
|
@ -1 +0,0 @@
|
|||
<svg width="181" height="100" xmlns="http://www.w3.org/2000/svg"><rect fill="#F6F7F7" width="14" height="20"/><rect fill="#F0F0F1" x="14" width="14" height="20"/><rect fill="#DCDCDE" x="28" width="14" height="20"/><rect fill="#C3C4C7" x="42" width="14" height="20"/><rect fill="#A7AAAD" x="56" width="14" height="20"/><rect fill="#8C8F93" x="70" width="14" height="20"/><rect fill="#797C81" x="84" width="14" height="20"/><rect fill="#65696F" x="98" width="14" height="20"/><rect fill="#51575D" x="112" width="14" height="20"/><rect fill="#3D4349" x="126" width="14" height="20"/><rect fill="#2D3337" x="140" width="14" height="20"/><rect fill="#1E2327" x="154" width="14" height="20"/><rect fill="#111517" x="168" width="13" height="20"/><rect fill="#F1F6FB" y="20" width="15" height="20"/><rect fill="#7EADE1" x="45" y="20" width="15" height="20"/><rect fill="#3971AC" x="90" y="20" width="15" height="20"/><rect fill="#153956" x="135" y="20" width="15" height="20"/><rect fill="#C8D9EB" x="15" y="20" width="15" height="20"/><rect fill="#5F93CF" x="60" y="20" width="15" height="20"/><rect fill="#2B5E92" x="105" y="20" width="15" height="20"/><rect fill="#0B2638" x="150" y="20" width="15" height="20"/><rect fill="#A5C1E3" x="30" y="20" width="15" height="20"/><rect fill="#4981BF" x="75" y="20" width="15" height="20"/><rect fill="#1F4B74" x="120" y="20" width="15" height="20"/><rect fill="#04131B" x="165" y="20" width="16" height="20"/><rect fill="#FAF0F1" y="40" width="15" height="20"/><rect fill="#EF8788" x="45" y="40" width="15" height="20"/><rect fill="#C6443F" x="90" y="40" width="15" height="20"/><rect fill="#61221F" x="135" y="40" width="15" height="20"/><rect fill="#F3D1D3" x="15" y="40" width="15" height="20"/><rect fill="#E76C6C" x="60" y="40" width="15" height="20"/><rect fill="#A53834" x="105" y="40" width="15" height="20"/><rect fill="#3F1615" x="150" y="40" width="15" height="20"/><rect fill="#F3AFB0" x="30" y="40" width="15" height="20"/><rect fill="#D55A59" x="75" y="40" width="15" height="20"/><rect fill="#7F2C28" x="120" y="40" width="15" height="20"/><rect fill="#210C0B" x="165" y="40" width="16" height="20"/><rect fill="#FCF9EA" y="60" width="15" height="20"/><rect fill="#E9C457" x="45" y="60" width="15" height="20"/><rect fill="#926921" x="90" y="60" width="15" height="20"/><rect fill="#47330B" x="135" y="60" width="15" height="20"/><rect fill="#F3E6B2" x="15" y="60" width="15" height="20"/><rect fill="#D3A73E" x="60" y="60" width="15" height="20"/><rect fill="#705218" x="105" y="60" width="15" height="20"/><rect fill="#332406" x="150" y="60" width="15" height="20"/><rect fill="#EED683" x="30" y="60" width="15" height="20"/><rect fill="#B5872D" x="75" y="60" width="15" height="20"/><rect fill="#5D4312" x="120" y="60" width="15" height="20"/><rect fill="#1F1603" x="165" y="60" width="16" height="20"/><rect fill="#EFF9F0" y="80" width="15" height="20"/><rect fill="#62CB5C" x="45" y="80" width="15" height="20"/><rect fill="#3C8632" x="90" y="80" width="15" height="20"/><rect fill="#1A4315" x="135" y="80" width="15" height="20"/><rect fill="#C1E4C2" x="15" y="80" width="15" height="20"/><rect fill="#53B64B" x="60" y="80" width="15" height="20"/><rect fill="#2F6D26" x="105" y="80" width="15" height="20"/><rect fill="#102F0E" x="150" y="80" width="15" height="20"/><rect fill="#87DA86" x="30" y="80" width="15" height="20"/><rect fill="#48A03E" x="75" y="80" width="15" height="20"/><rect fill="#265A1E" x="120" y="80" width="15" height="20"/><rect fill="#071B07" x="165" y="80" width="16" height="20"/></svg>
|
||||
|
Before Width: | Height: | Size: 3.5 KiB |
|
|
@ -1 +0,0 @@
|
|||
<svg width="905" height="20" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="nonzero"><rect fill="#F6F7F7" width="14" height="20"/><rect fill="#F0F0F1" x="14" width="14" height="20"/><rect fill="#DCDCDE" x="28" width="14" height="20"/><rect fill="#C3C4C7" x="42" width="14" height="20"/><rect fill="#A7AAAD" x="56" width="14" height="20"/><rect fill="#8C8F93" x="70" width="14" height="20"/><rect fill="#797C81" x="84" width="14" height="20"/><rect fill="#65696F" x="98" width="14" height="20"/><rect fill="#51575D" x="112" width="14" height="20"/><rect fill="#3D4349" x="126" width="14" height="20"/><rect fill="#2D3337" x="140" width="14" height="20"/><rect fill="#1E2327" x="154" width="14" height="20"/><rect fill="#111517" x="168" width="13" height="20"/><rect fill="#F1F6FB" x="181" width="15" height="20"/><rect fill="#7EADE1" x="226" width="15" height="20"/><rect fill="#3971AC" x="271" width="15" height="20"/><rect fill="#153956" x="316" width="15" height="20"/><rect fill="#C8D9EB" x="196" width="15" height="20"/><rect fill="#5F93CF" x="241" width="15" height="20"/><rect fill="#2B5E92" x="286" width="15" height="20"/><rect fill="#0B2638" x="331" width="15" height="20"/><rect fill="#A5C1E3" x="211" width="15" height="20"/><rect fill="#4981BF" x="256" width="15" height="20"/><rect fill="#1F4B74" x="301" width="15" height="20"/><rect fill="#04131B" x="346" width="16" height="20"/><rect fill="#FAF0F1" x="362" width="15" height="20"/><rect fill="#EF8788" x="407" width="15" height="20"/><rect fill="#C6443F" x="452" width="15" height="20"/><rect fill="#61221F" x="497" width="15" height="20"/><rect fill="#F3D1D3" x="377" width="15" height="20"/><rect fill="#E76C6C" x="422" width="15" height="20"/><rect fill="#A53834" x="467" width="15" height="20"/><rect fill="#3F1615" x="512" width="15" height="20"/><rect fill="#F3AFB0" x="392" width="15" height="20"/><rect fill="#D55A59" x="437" width="15" height="20"/><rect fill="#7F2C28" x="482" width="15" height="20"/><rect fill="#210C0B" x="527" width="16" height="20"/><rect fill="#FCF9EA" x="543" width="15" height="20"/><rect fill="#E9C457" x="588" width="15" height="20"/><rect fill="#926921" x="633" width="15" height="20"/><rect fill="#47330B" x="678" width="15" height="20"/><rect fill="#F3E6B2" x="558" width="15" height="20"/><rect fill="#D3A73E" x="603" width="15" height="20"/><rect fill="#705218" x="648" width="15" height="20"/><rect fill="#332406" x="693" width="15" height="20"/><rect fill="#EED683" x="573" width="15" height="20"/><rect fill="#B5872D" x="618" width="15" height="20"/><rect fill="#5D4312" x="663" width="15" height="20"/><rect fill="#1F1603" x="708" width="16" height="20"/><rect fill="#EFF9F0" x="724" width="15" height="20"/><rect fill="#62CB5C" x="769" width="15" height="20"/><rect fill="#3C8632" x="814" width="15" height="20"/><rect fill="#1A4315" x="859" width="15" height="20"/><rect fill="#C1E4C2" x="739" width="15" height="20"/><rect fill="#53B64B" x="784" width="15" height="20"/><rect fill="#2F6D26" x="829" width="15" height="20"/><rect fill="#102F0E" x="874" width="15" height="20"/><rect fill="#87DA86" x="754" width="15" height="20"/><rect fill="#48A03E" x="799" width="15" height="20"/><rect fill="#265A1E" x="844" width="15" height="20"/><rect fill="#071B07" x="889" width="16" height="20"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 3.3 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 44 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 136 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 51 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.7 KiB |
|
|
@ -0,0 +1,16 @@
|
|||
<svg width="1280" height="568" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0)">
|
||||
<g clip-path="url(#clip1)" fill="#3858E9">
|
||||
<path d="M1198.19 326.128c4.48 34.433-6.49 68.552-10.69 103.364a66.133 66.133 0 01-11.19 27.433 51.192 51.192 0 00-9.46 24.438c0 2.113-.55 4.189-1.6 6.022-20.49 25.889-33.01 59.345-62.36 76.53-15.25 8.924-24.68 25.226-44.13 29.798-8.95 2.145-20.43 10.438-29.47 17.343a104.507 104.507 0 01-30.329 15.767c-14.185 4.887-28.906 7.725-42.02 16.46-13.114 8.734-27.994 9.46-43.944 7.631-19.198-2.208-38.806-1.356-58.224-1.23-38.742.315-73.071-14.253-105.257-33.299-23.327-13.779-44.353-31.532-66.514-47.299a57.609 57.609 0 01-21.846-29.892c-2.396-7.474-6.872-8.167-12.609-8.798-6.904-.725-8.922 3.153-12.295 8.861-15.762 26.929-29.127 57.168-55.166 75.268a183.653 183.653 0 01-78.272 31.848c-32.879 4.761-65.127 13.559-98.479 15.262-15.226.788-30.484 2.428-45.395-1.798a52.236 52.236 0 00-20.206-1.545c-27.488 3.154-52.329-5.612-74.395-20.37-30.862-20.622-62.669-40.519-89.149-66.565-23.264-22.924-38.364-51.966-50.437-82.489C91.338 405.464 89.32 316.731 80.62 229.26c-2.932-29.326 4.287-58.21 15.762-85.895 11.474-27.686 22.066-56.38 31.523-85.138 11.727-35.222 34.96-61.552 62.574-84.508a225.646 225.646 0 01112.76-51.587c36.315-5.234 71.873-15.766 108.724-16.618a177.46 177.46 0 0172.283 12.613c14.911 6.086 31.524 8.073 47.034 12.613 28.371 8.199 56.962 18.132 76.601 40.677 14.312 16.429 31.524 30.02 44.669 47.3 5.832 7.599 13.24 8.576 20.711 3.153 45.456-33.204 98.605-48.687 150.587-67.543 42.179-15.294 84.231-20.654 128.207-14.158 23.989 3.563 47.694 9.05 68.405 21.82 54.35 33.52 100.59 74.543 122.19 137.514 10.9 31.753 27.51 61.457 35.84 94.125 10.87 42.979 24.55 85.768 19.7 132.5zm-958.314-71.39c1.135 10.942 1.608 22.073 3.5 32.825 8.164 46.479 13.555 93.526 26.732 138.965 5.327 18.415 11.348 37.46 24.871 51.965 17.307 18.542 40.666 29.01 61.251 43.263a18.91 18.91 0 0013.208 4.131c37.513-4.099 75.467-5.581 111.751-17.248 9.74-3.154 20.679-5.203 27.331-14.505 19.135-26.614 41.673-51.272 48.356-85.139 4.445-22.514 17.937-42.505 17.528-66.502-.789-44.398-7.282-88.985 5.737-132.941 5.391-18.195-4.602-35.096-9.457-51.871-8.795-30.492-27.772-54.394-53.59-73.345-19.828-14.631-43.786-17.88-66.199-23.02a125.241 125.241 0 00-68.091 4.7c-22.728 7.567-42.998 24.248-68.941 21.694a4.452 4.452 0 00-3.5 2.396c-2.932 9.46-12.199 11.068-18.914 15.766-20.459 14.411-25.219 37.114-30.2 58.903-3.341 14.726-2.427 30.303-16.518 40.488-2.963 2.145-6.462 6.055-4.792 9.271 7.125 13.559-2.9 26.897-.031 40.204h-.032zm485.461 43.925c-1.733 52.407 8.04 99.517 35.276 145.05 23.39 39.163 53.59 67.259 94.57 81.386 52.518 18.005 99.614-1.482 143.589-30.272 22.068-14.379 27.738-39.195 36.848-60.826 6.31-14.663 13.31-29.326 17.91-44.934 15.76-53.353-2.46-104.846-7.6-157.064a13.664 13.664 0 00-2.39-5.771c-19.45-29.262-27.68-64.168-47.921-93.241-24.02-34.686-58.601-52.376-96.556-44.367-31.523 6.685-62.164 17.816-93.12 27.118a8.197 8.197 0 00-4.918 3.406c-4.445 9.46-13.996 12.613-22.066 16.87-19.261 10.153-31.523 25.983-42.273 44.461-11.191 18.919-12.767 40.551-13.334 59.912a547.521 547.521 0 002.017 58.272h-.032z"/>
|
||||
<path d="M405.281 413.631c-5.769.441-11.539 1.198-17.276 1.292-19.734.316-35.022-6.306-50.122-20.906-48.672-46.731-52.802-146.973-23.075-191.119a54.45 54.45 0 0138.553-24.532c36.662-4.573 73.009-2.838 105.478 16.365 27.331 16.145 48.482 36.294 54.503 71.989 5.328 31.533 4.13 59.912-7.597 88.922a79.11 79.11 0 01-11.254 20.433c-22.98 28.726-52.013 42.79-89.21 37.556zm-20.018-114.779c-2.743 13.622 6.904 24.879 11.065 37.618 3.783 11.699 14.91 13.275 20.679 2.302a234.248 234.248 0 0019.891-55.213c.73-3.604.816-7.309.252-10.942-2.427-18.541-18.315-25.447-33.225-14.253a44.876 44.876 0 00-18.725 40.488h.063zM785.547 306.104c-.378-21.82.568-43.168 10.593-64.169 13.208-27.685 37.828-40.298 63.677-45.407 32.185-6.306 64.308-1.86 90.788 23.335 30.924 29.42 43.281 64.421 38.962 106.17a205.454 205.454 0 00-2.206 26.645c1.008 37.839-15.604 65.178-47.286 85.611-31.681 20.433-61.534 12.865-91.765-1.072-9.457-4.352-17.432-11.604-26.7-16.366-18.094-9.459-26.133-25.73-29.916-44.145a265.17 265.17 0 01-6.147-70.602zm71.874 24.848c-2.364 14.537 3.404 26.74 10.623 38.533 5.548 9.113 12.389 18.762 23.391 18.541 12.799-.252 10.749-13.811 13.208-22.073 9.962-33.235 9.079-65.903-8.038-97.089-3.657-6.685-8.701-10.437-16.487-9.144-7.786 1.293-13.587 5.266-14.753 13.874l-7.944 57.358z"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0">
|
||||
<path fill="#fff" d="M0 0h1280v568H0z"/>
|
||||
</clipPath>
|
||||
<clipPath id="clip1">
|
||||
<path fill="#fff" transform="translate(79.738 -94.55)" d="M0 0h1119.52v757.098H0z"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.6 KiB |
|
|
@ -149,10 +149,10 @@ function wp_credits_section_list( $credits = array(), $slug = '' ) {
|
|||
foreach ( $group_data['data'] as $person_data ) {
|
||||
echo '<li class="wp-person" id="wp-person-' . esc_attr( $person_data[2] ) . '">' . "\n\t";
|
||||
echo '<a href="' . esc_url( sprintf( $credits_data['profiles'], $person_data[2] ) ) . '" class="web">';
|
||||
$size = $compact ? 40 : 80;
|
||||
$size = $compact ? 80 : 160;
|
||||
$data = get_avatar_data( $person_data[1] . '@md5.gravatar.com', array( 'size' => $size ) );
|
||||
$data2x = get_avatar_data( $person_data[1] . '@md5.gravatar.com', array( 'size' => $size * 2 ) );
|
||||
echo '<img src="' . esc_url( $data['url'] ) . '" srcset="' . esc_url( $data2x['url'] ) . ' 2x" class="gravatar" alt="" />' . "\n";
|
||||
echo '<span class="wp-person-avatar"><img src="' . esc_url( $data['url'] ) . '" srcset="' . esc_url( $data2x['url'] ) . ' 2x" class="gravatar" alt="" /></span>' . "\n";
|
||||
echo esc_html( $person_data[0] ) . "</a>\n\t";
|
||||
if ( ! $compact ) {
|
||||
// phpcs:ignore WordPress.WP.I18n.LowLevelTranslationFunction,WordPress.WP.I18n.NonSingularStringLiteralText
|
||||
|
|
|
|||
|
|
@ -18,21 +18,14 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
|
|||
<div class="wrap about__container">
|
||||
|
||||
<div class="about__header">
|
||||
<div class="about__header-image">
|
||||
<img alt="<?php _e( 'Code is Poetry' ); ?>" src="<?php echo esc_url( admin_url( 'images/about-badge.svg' ) ); ?>" />
|
||||
<div class="about__header-title">
|
||||
<h1>
|
||||
<?php _e( 'Privacy' ); ?>
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<div class="about__header-container">
|
||||
<div class="about__header-title">
|
||||
<p>
|
||||
<?php _e( 'WordPress' ); ?>
|
||||
<?php echo $display_version; ?>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="about__header-text">
|
||||
<?php _e( 'Jazz up your stories in an editor that’s cleaner, crisper, and does more to get out of your way.' ); ?>
|
||||
</div>
|
||||
<div class="about__header-text">
|
||||
<?php _e( 'We take privacy and transparency very seriously' ); ?>
|
||||
</div>
|
||||
|
||||
<nav class="about__header-navigation nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
|
||||
|
|
@ -45,8 +38,6 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
|
|||
|
||||
<div class="about__section">
|
||||
<div class="column">
|
||||
<h1><?php _e( 'Privacy' ); ?></h1>
|
||||
|
||||
<p><img class="privacy-image" src="<?php echo esc_url( admin_url( 'images/privacy.png' ) ); ?>" alt="" /></p>
|
||||
|
||||
<p><?php _e( 'From time to time, your WordPress site may send data to WordPress.org — including, but not limited to — the version of WordPress you are using, and a list of installed plugins and themes.' ); ?></p>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
*
|
||||
* @global string $wp_version
|
||||
*/
|
||||
$wp_version = '5.8-beta4-51263';
|
||||
$wp_version = '5.8-beta4-51264';
|
||||
|
||||
/**
|
||||
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.
|
||||
|
|
|
|||
Loading…
Reference in New Issue