Upstream
/
WordPress
mirror of https://github.com/WordPress/WordPress.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Administration: Update design of the Dashboard welcome panel. 

Tone down the brightness of the dashboard panel by using a white background behind the main text, and use the highlight color from each color scheme for the main background. This also introduces a `$scheme-name` SCSS variable to allow overrides for specific color schemes.

Props critterverse, sabernhardt, joedolson, audrasjb.
See #54489.


Built from https://develop.svn.wordpress.org/trunk@52562


git-svn-id: http://core.svn.wordpress.org/trunk@52152 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
ryelle 2022-01-11 18:27:03 +00:00
parent f950eec323
commit 908a08696b
47 changed files with 242 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
wp-admin/css/colors/_admin.scss
View File

@ -781,3 +781,17 @@ div#wp-responsive-toggle a:before {
color: $link;
}
}
/* Welcome Panel */
.welcome-panel {
background-color: $highlight-color;
}
[class*="welcome-panel-icon"] {
@if ( $scheme-name == "light" ) {
background-color: $icon-color;
} @else {
background-color: $base-color;
}
}

1
wp-admin/css/colors/_variables.scss
View File

@ -1,5 +1,6 @@
// assign default value to all undefined variables
$scheme-name: "default" !default;
// core variables

9
wp-admin/css/colors/blue/colors-rtl.css
View File

@ -702,4 +702,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #e1a948;
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #096484;
}
[class*=welcome-panel-icon] {
background-color: #52accc;
}

2
wp-admin/css/colors/blue/colors-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

9
wp-admin/css/colors/blue/colors.css
View File

@ -702,4 +702,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #e1a948;
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #096484;
}
[class*=welcome-panel-icon] {
background-color: #52accc;
}

2
wp-admin/css/colors/blue/colors.min.css vendored
View File

File diff suppressed because one or more lines are too long

1
wp-admin/css/colors/blue/colors.scss
View File

@ -1,3 +1,4 @@
$scheme-name: "blue";
$base-color: #52accc;
$icon-color: #e5f8ff;
$highlight-color: #096484;

9
wp-admin/css/colors/coffee/colors-rtl.css
View File

@ -669,4 +669,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #c7a589;
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #c7a589;
}
[class*=welcome-panel-icon] {
background-color: #59524c;
}

2
wp-admin/css/colors/coffee/colors-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

9
wp-admin/css/colors/coffee/colors.css
View File

@ -669,4 +669,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #c7a589;
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #c7a589;
}
[class*=welcome-panel-icon] {
background-color: #59524c;
}

2
wp-admin/css/colors/coffee/colors.min.css vendored
View File

File diff suppressed because one or more lines are too long

1
wp-admin/css/colors/coffee/colors.scss
View File

@ -1,3 +1,4 @@
$scheme-name: "coffee";
$base-color: #59524c;
$highlight-color: #c7a589;
$notification-color: #9ea476;

9
wp-admin/css/colors/ectoplasm/colors-rtl.css
View File

@ -702,4 +702,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #a3b745;
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #a3b745;
}
[class*=welcome-panel-icon] {
background-color: #523f6d;
}

2
wp-admin/css/colors/ectoplasm/colors-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

9
wp-admin/css/colors/ectoplasm/colors.css
View File

@ -702,4 +702,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #a3b745;
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #a3b745;
}
[class*=welcome-panel-icon] {
background-color: #523f6d;
}

2
wp-admin/css/colors/ectoplasm/colors.min.css vendored
View File

File diff suppressed because one or more lines are too long

1
wp-admin/css/colors/ectoplasm/colors.scss
View File

@ -1,3 +1,4 @@
$scheme-name: "ectoplasm";
$base-color: #523f6d;
$icon-color: #ece6f6;
$highlight-color: #a3b745;

9
wp-admin/css/colors/light/colors-rtl.css
View File

@ -704,6 +704,15 @@ div#wp-responsive-toggle a:before {
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #04a4cc;
}
[class*=welcome-panel-icon] {
background-color: #999;
}
/* Override the theme filter highlight color for this scheme */
.theme-section.current,
.theme-filter.current {

2
wp-admin/css/colors/light/colors-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

9
wp-admin/css/colors/light/colors.css
View File

@ -704,6 +704,15 @@ div#wp-responsive-toggle a:before {
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #04a4cc;
}
[class*=welcome-panel-icon] {
background-color: #999;
}
/* Override the theme filter highlight color for this scheme */
.theme-section.current,
.theme-filter.current {

2
wp-admin/css/colors/light/colors.min.css vendored
View File

File diff suppressed because one or more lines are too long

1
wp-admin/css/colors/light/colors.scss
View File

@ -1,3 +1,4 @@
$scheme-name: "light";
$base-color: #e5e5e5;
$icon-color: #999;
$text-color: #333;

9
wp-admin/css/colors/midnight/colors-rtl.css
View File

@ -702,4 +702,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #e14d43;
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #e14d43;
}
[class*=welcome-panel-icon] {
background-color: #363b3f;
}

2
wp-admin/css/colors/midnight/colors-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

9
wp-admin/css/colors/midnight/colors.css
View File

@ -702,4 +702,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #e14d43;
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #e14d43;
}
[class*=welcome-panel-icon] {
background-color: #363b3f;
}

2
wp-admin/css/colors/midnight/colors.min.css vendored
View File

File diff suppressed because one or more lines are too long

1
wp-admin/css/colors/midnight/colors.scss
View File

@ -1,3 +1,4 @@
$scheme-name: "midnight";
$base-color: #363b3f;
$highlight-color: #e14d43;
$notification-color: #69a8bb;

9
wp-admin/css/colors/modern/colors-rtl.css
View File

@ -702,4 +702,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #3858e9;
color: #3858e9;
}
/* Welcome Panel */
.welcome-panel {
background-color: #3858e9;
}
[class*=welcome-panel-icon] {
background-color: #1e1e1e;
}

2
wp-admin/css/colors/modern/colors-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

9
wp-admin/css/colors/modern/colors.css
View File

@ -702,4 +702,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #3858e9;
color: #3858e9;
}
/* Welcome Panel */
.welcome-panel {
background-color: #3858e9;
}
[class*=welcome-panel-icon] {
background-color: #1e1e1e;
}

2
wp-admin/css/colors/modern/colors.min.css vendored
View File

File diff suppressed because one or more lines are too long

1
wp-admin/css/colors/modern/colors.scss
View File

@ -1,3 +1,4 @@
$scheme-name: "modern";
$base-color: #1e1e1e;
$highlight-color: #3858e9;
$menu-submenu-focus-text: #33f078;

9
wp-admin/css/colors/ocean/colors-rtl.css
View File

@ -669,4 +669,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #9ebaa0;
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #9ebaa0;
}
[class*=welcome-panel-icon] {
background-color: #738e96;
}

2
wp-admin/css/colors/ocean/colors-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

9
wp-admin/css/colors/ocean/colors.css
View File

@ -669,4 +669,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #9ebaa0;
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #9ebaa0;
}
[class*=welcome-panel-icon] {
background-color: #738e96;
}

2
wp-admin/css/colors/ocean/colors.min.css vendored
View File

File diff suppressed because one or more lines are too long

1
wp-admin/css/colors/ocean/colors.scss
View File

@ -1,3 +1,4 @@
$scheme-name: "ocean";
$base-color: #738e96;
$icon-color: #f2fcff;
$highlight-color: #9ebaa0;

9
wp-admin/css/colors/sunrise/colors-rtl.css
View File

@ -702,4 +702,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #dd823b;
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #dd823b;
}
[class*=welcome-panel-icon] {
background-color: #cf4944;
}

2
wp-admin/css/colors/sunrise/colors-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

9
wp-admin/css/colors/sunrise/colors.css
View File

@ -702,4 +702,13 @@ div#wp-responsive-toggle a:before {
.wp-core-ui.wp-customizer .theme-overlay .theme-header .close:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .close:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .right:hover, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:focus, .wp-core-ui.wp-customizer .theme-overlay .theme-header .left:hover {
border-bottom-color: #dd823b;
color: #0073aa;
}
/* Welcome Panel */
.welcome-panel {
background-color: #dd823b;
}
[class*=welcome-panel-icon] {
background-color: #cf4944;
}

2
wp-admin/css/colors/sunrise/colors.min.css vendored
View File

File diff suppressed because one or more lines are too long

1
wp-admin/css/colors/sunrise/colors.scss
View File

@ -1,3 +1,4 @@
$scheme-name: "sunrise";
$base-color: #cf4944;
$highlight-color: #dd823b;
$notification-color: #ccaf0b;

37
wp-admin/css/dashboard-rtl.css
View File

@ -116,10 +116,9 @@
position: relative;
overflow: auto;
margin: 16px 0;
background: #3858e9 url(../images/about-texture.png) center repeat;
background: #2271b1 url(../images/about-texture.png) center repeat;
background-size: 500px 500px;
background-blend-mode: overlay;
color: #fff;
font-size: 14px;
line-height: 1.3;
}
@ -149,11 +148,6 @@
font-size: 20px;
font-weight: 400;
line-height: 1.4;
color: #fff;
}
.welcome-panel a {
color: #fff;
}
.welcome-panel p {
@ -161,6 +155,27 @@
line-height: inherit;
}
.welcome-panel-header {
color: #fff;
}
.welcome-panel-header a {
color: #fff;
}
.welcome-panel-header a:focus,
.welcome-panel-header a:hover {
color: #f5e6ab;
text-decoration: none;
}
.welcome-panel-header a:focus,
.welcome-panel .welcome-panel-close:focus {
outline-color: currentColor;
outline-offset: 1px;
box-shadow: none;
}
.welcome-panel-header p {
margin: 0.5em 0 0;
font-size: 20px;
@ -187,6 +202,10 @@
color: #fff;
}
.welcome-panel .welcome-panel-close {
color: #fff;
}
.welcome-panel .welcome-panel-close:hover,
.welcome-panel .welcome-panel-close:focus,
.welcome-panel .welcome-panel-close:hover::before,
@ -231,13 +250,13 @@
grid-template-columns: repeat(3, 1fr);
gap: 32px;
align-self: flex-end;
background: #3858e9;
background: #fff;
}
[class*="welcome-panel-icon"] {
height: 60px;
width: 60px;
background-color: #1d35b4;
background-color: #1d2327;
background-position: center;
background-size: 24px 24px;
background-repeat: no-repeat;

2
wp-admin/css/dashboard-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

37
wp-admin/css/dashboard.css
View File

@ -115,10 +115,9 @@
position: relative;
overflow: auto;
margin: 16px 0;
background: #3858e9 url(../images/about-texture.png) center repeat;
background: #2271b1 url(../images/about-texture.png) center repeat;
background-size: 500px 500px;
background-blend-mode: overlay;
color: #fff;
font-size: 14px;
line-height: 1.3;
}
@ -148,11 +147,6 @@
font-size: 20px;
font-weight: 400;
line-height: 1.4;
color: #fff;
}
.welcome-panel a {
color: #fff;
}
.welcome-panel p {
@ -160,6 +154,27 @@
line-height: inherit;
}
.welcome-panel-header {
color: #fff;
}
.welcome-panel-header a {
color: #fff;
}
.welcome-panel-header a:focus,
.welcome-panel-header a:hover {
color: #f5e6ab;
text-decoration: none;
}
.welcome-panel-header a:focus,
.welcome-panel .welcome-panel-close:focus {
outline-color: currentColor;
outline-offset: 1px;
box-shadow: none;
}
.welcome-panel-header p {
margin: 0.5em 0 0;
font-size: 20px;
@ -186,6 +201,10 @@
color: #fff;
}
.welcome-panel .welcome-panel-close {
color: #fff;
}
.welcome-panel .welcome-panel-close:hover,
.welcome-panel .welcome-panel-close:focus,
.welcome-panel .welcome-panel-close:hover::before,
@ -230,13 +249,13 @@
grid-template-columns: repeat(3, 1fr);
gap: 32px;
align-self: flex-end;
background: #3858e9;
background: #fff;
}
[class*="welcome-panel-icon"] {
height: 60px;
width: 60px;
background-color: #1d35b4;
background-color: #1d2327;
background-position: center;
background-size: 24px 24px;
background-repeat: no-repeat;

2
wp-admin/css/dashboard.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
wp-includes/version.php
View File

@ -16,7 +16,7 @@
*
* @global string $wp_version
*/
$wp_version = '6.0-alpha-52558';
$wp_version = '6.0-alpha-52562';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.