Menu: Add arrow to external links (#386)

* Signal external link * Increase min-width or the text would be wrapped
WordPress · Apr 10, 2023 · 482d0c7 · 482d0c7
1 parent 8d11d55
commit 482d0c7
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 24 deletions.
diff --git a/mu-plugins/blocks/global-header-footer/blocks.php b/mu-plugins/blocks/global-header-footer/blocks.php
@@ -442,11 +442,6 @@ function get_global_menu_items() {
 					'url'   => 'https://wordpress.org/plugins/',
 					'type'  => 'custom',
 				),
-				array(
-					'title' => esc_html_x( 'Openverse', 'Menu item title', 'wporg' ),
-					'url'   => 'https://openverse.org/',
-					'type'  => 'custom',
-				),
 				array(
 					'title' => esc_html_x( 'Mobile', 'Menu item title', 'wporg' ),
 					'url'   => 'https://wordpress.org/mobile/',
@@ -457,6 +452,11 @@ function get_global_menu_items() {
 					'url'   => 'https://wordpress.org/hosting/',
 					'type'  => 'custom',
 				),
+				array(
+					'title' => esc_html_x( 'Openverse ↗︎', 'Menu item title', 'wporg' ),
+					'url'   => 'https://openverse.org/',
+					'type'  => 'custom',
+				),
 			),
 		),
 		array(
@@ -480,13 +480,13 @@ function get_global_menu_items() {
 					'type'  => 'custom',
 				),
 				array(
-					'title' => esc_html_x( 'WordPress.tv', 'Menu item title', 'wporg' ),
-					'url'   => 'https://wordpress.tv/',
+					'title' => esc_html_x( 'Developers', 'Menu item title', 'wporg' ),
+					'url'   => 'https://developer.wordpress.org/',
 					'type'  => 'custom',
 				),
 				array(
-					'title' => esc_html_x( 'Developers', 'Menu item title', 'wporg' ),
-					'url'   => 'https://developer.wordpress.org/',
+					'title' => esc_html_x( 'WordPress.tv ↗︎', 'Menu item title', 'wporg' ),
+					'url'   => 'https://wordpress.tv/',
 					'type'  => 'custom',
 				),
 			),
@@ -502,28 +502,28 @@ function get_global_menu_items() {
 					'type'  => 'custom',
 				),
 				array(
-					'title' => esc_html_x( 'WordCamp', 'Menu item title', 'wporg' ),
-					'url'   => 'https://central.wordcamp.org/',
+					'title' => esc_html_x( 'Photo Directory', 'Menu item title', 'wporg' ),
+					'url'   => 'https://wordpress.org/photos/',
 					'type'  => 'custom',
 				),
 				array(
-					'title' => esc_html_x( 'Meetups', 'Menu item title', 'wporg' ),
-					'url'   => 'https://www.meetup.com/pro/wordpress/',
+					'title' => esc_html_x( 'Five for the Future', 'Menu item title', 'wporg' ),
+					'url'   => 'https://wordpress.org/five-for-the-future/',
 					'type'  => 'custom',
 				),
 				array(
-					'title' => esc_html_x( 'Photo Directory', 'Menu item title', 'wporg' ),
-					'url'   => 'https://wordpress.org/photos/',
+					'title' => esc_html_x( 'WordCamp ↗︎', 'Menu item title', 'wporg' ),
+					'url'   => 'https://central.wordcamp.org/',
 					'type'  => 'custom',
 				),
 				array(
-					'title' => esc_html_x( 'Job Board', 'Menu item title', 'wporg' ),
-					'url'   => 'https://jobs.wordpress.net/',
+					'title' => esc_html_x( 'Meetups ↗︎', 'Menu item title', 'wporg' ),
+					'url'   => 'https://www.meetup.com/pro/wordpress/',
 					'type'  => 'custom',
 				),
 				array(
-					'title' => esc_html_x( 'Five for the Future', 'Menu item title', 'wporg' ),
-					'url'   => 'https://wordpress.org/five-for-the-future/',
+					'title' => esc_html_x( 'Job Board ↗︎', 'Menu item title', 'wporg' ),
+					'url'   => 'https://jobs.wordpress.net/',
 					'type'  => 'custom',
 				),
 			),
@@ -544,17 +544,17 @@ function get_global_menu_items() {
 					'type'  => 'custom',
 				),
 				array(
-					'title' => esc_html_x( 'Gutenberg', 'Menu item title', 'wporg' ),
-					'url'   => 'https://wordpress.org/gutenberg/',
+					'title' => esc_html_x( 'Enterprise', 'Menu item title', 'wporg' ),
+					'url'   => 'https://wordpress.org/enterprise/',
 					'type'  => 'custom',
 				),
 				array(
-					'title' => esc_html_x( 'Enterprise', 'Menu item title', 'wporg' ),
-					'url'   => 'https://wordpress.org/enterprise/',
+					'title' => esc_html_x( 'Gutenberg ↗︎', 'Menu item title', 'wporg' ),
+					'url'   => 'https://wordpress.org/gutenberg/',
 					'type'  => 'custom',
 				),
 				array(
-					'title' => esc_html_x( 'WordPress Swag Store', 'Menu item title', 'wporg' ),
+					'title' => esc_html_x( 'WordPress Swag Store ↗︎', 'Menu item title', 'wporg' ),
 					'url'   => 'https://mercantile.wordpress.org/',
 					'type'  => 'custom',
 				),

diff --git a/mu-plugins/blocks/global-header-footer/postcss/header/menu.pcss b/mu-plugins/blocks/global-header-footer/postcss/header/menu.pcss
@@ -187,6 +187,7 @@
 		padding-top: calc(var(--wp--style--block-gap) / 2);
 		padding-bottom: calc(var(--wp--style--block-gap) / 2);
 		border: none;
+		white-space: nowrap;
 
 		@media (--tablet) {
 			font-size: inherit;