Changeset 55451

Timestamp:

03/01/2023 04:40:29 PM (20 months ago)

Author:

ryelle

Message:

Administration: Update the Dashboard welcome banner for 6.2.

Props richtabor, markoserb, laurlittle.
See #57759.

Location:

trunk/src/wp-admin

Files:

• css/colors/_admin.scss (modified) (1 diff)
• css/colors/_variables.scss (modified) (1 diff)
• css/colors/modern/colors.scss (modified) (1 diff)
• css/dashboard.css (modified) (3 diffs)
• images/dashboard-background.svg (added)
• includes/dashboard.php (modified) (1 diff)

trunk/src/wp-admin/css/colors/_admin.scss

@@ -789 +789 @@
 
 /* Welcome Panel */
-.welcome-panel {
-    background-color: $dashboard-accent-1;
-}
-
-.welcome-panel-header-image circle {
-    stroke: $dashboard-accent-2;
-    fill: $dashboard-accent-1;
-}
-
-[class*="welcome-panel-icon"] {
-    background-color: $dashboard-icon-background;
-}
+@if ( $custom-welcome-panel == "true" ) {
+    .welcome-panel {
+        background-color: $dashboard-accent-1;
+    }
+
+    .welcome-panel-header-image .curve,
+    .welcome-panel-header-image .dot {
+        fill: $dashboard-accent-2;
+    }
+
+    [class*="welcome-panel-icon"] {
+        background-color: $dashboard-icon-background;
+    }
+}

trunk/src/wp-admin/css/colors/_variables.scss

@@ -66 +66 @@
 // Dashboard Colors
 
+$custom-welcome-panel: "true" !default;
 $dashboard-accent-1: $highlight-color !default;
-$dashboard-accent-2: rgba(255, 255, 255, 0.5) !default;
+$dashboard-accent-2: rgba(255, 255, 255, 0.33) !default;
 $dashboard-icon-background: $dashboard-accent-2 !default;
 

trunk/src/wp-admin/css/colors/modern/colors.scss

@@ -8 +8 @@
 $link-focus: darken($highlight-color, 10%);
 
-$dashboard-accent-1: #273fcc;
-$dashboard-accent-2: #627eff;
-$dashboard-icon-background: #1d2327;
+$custom-welcome-panel: "false";
 
 @import "../_admin.scss";

trunk/src/wp-admin/css/dashboard.css

@@ -121 +121 @@
     overflow: auto;
     margin: 16px 0;
-    background-color: #273fcc;
+    background-color: #1d35b4;
     font-size: 14px;
     line-height: 1.3;
@@ -147 +147 @@
 
 .welcome-panel-header {
-    --about-header-bg-width: 780px;
-
     position: relative;
     color: #fff;
@@ -166 +164 @@
     display: block;
     margin: auto;
-    width: var(--about-header-bg-width);
-    height: auto;
-    transform: scale(0.75);
-    transform-origin: center top;
+    width: 100%;
+    height: 100%;
+}
+
+.rtl .welcome-panel-header-image svg {
+    transform: scaleX(-1);
 }
 

trunk/src/wp-admin/includes/dashboard.php

@@ -2044 +2044 @@
     <div class="welcome-panel-header">
         <div class="welcome-panel-header-image">
-            <?php echo file_get_contents( dirname( __DIR__ ) . '/images/about-header-about.svg' ); ?>
+            <?php echo file_get_contents( dirname( __DIR__ ) . '/images/dashboard-background.svg' ); ?>
         </div>
         <h2><?php _e( 'Welcome to WordPress!' ); ?></h2>