Index: /trunk/src/bp-core/admin/bp-core-admin-components.php
===================================================================
--- /trunk/src/bp-core/admin/bp-core-admin-components.php	(revision 13136)
+++ /trunk/src/bp-core/admin/bp-core-admin-components.php	(revision 13137)
@@ -18,12 +18,9 @@
  */
 function bp_core_admin_components_settings() {
-?>
-
-	<div class="wrap">
-
-		<h1 class="wp-heading-inline"><?php _e( 'BuddyPress Settings', 'buddypress' ); ?> </h1>
-		<hr class="wp-header-end">
-
-		<h2 class="nav-tab-wrapper"><?php bp_core_admin_tabs( __( 'Components', 'buddypress' ) ); ?></h2>
+	bp_core_admin_tabbed_screen_header( __( 'BuddyPress Settings', 'buddypress' ), __( 'Components', 'buddypress' ) );
+	?>
+
+	<div class="buddypress-body">
+
 		<form action="" method="post" id="bp-admin-component-form">
 
Index: /trunk/src/bp-core/admin/bp-core-admin-functions.php
===================================================================
--- /trunk/src/bp-core/admin/bp-core-admin-functions.php	(revision 13136)
+++ /trunk/src/bp-core/admin/bp-core-admin-functions.php	(revision 13137)
@@ -392,4 +392,51 @@
 
 /**
+ * Outputs the BP Admin Tabbed header.
+ *
+ * @since 10.0.0
+ *
+ * @param string $title      The title of the Admin page.
+ * @param string $active_tab The current displayed tab.
+ * @param string $context    The context of use for the tabs. Defaults to 'settings'.
+ *                           Possible values are 'settings' & 'tools'.
+ */
+function bp_core_admin_tabbed_screen_header( $title = '', $active_tab = '', $context = 'settings' ) {
+	$bp = buddypress();
+
+	// Globalize the active tab for backcompat purpose.
+	$bp->admin->active_nav_tab = $active_tab;
+
+	/**
+	 * Fires before the output of the BP Admin tabbed screen header.
+	 *
+	 * @since 10.0.0
+	 *
+	 * @param string $active_tab The BP Admin active tab.
+	 * @param string $context    The context of use for the tabs.
+	 */
+	do_action( 'bp_core_admin_tabbed_screen_header', $active_tab, $context );
+	?>
+	<div class="buddypress-header">
+		<div class="buddypress-title-section">
+			<h1><span class="bp-badge"></span> <?php echo esc_html( $title ); ?></h1>
+		</div>
+		<nav class="buddypress-tabs-wrapper">
+			<?php if ( isset( $bp->admin->nav_tabs ) ) : ?>
+				<?php foreach ( $bp->admin->nav_tabs as $nav_tab ) : ?>
+
+					<?php echo $nav_tab; ?>
+
+				<?php endforeach; ?>
+			<?php else : ?>
+				<?php bp_core_admin_tabs( esc_html( $active_tab ), $context ); ?>
+			<?php endif; ?>
+		</nav>
+	</div>
+
+	<hr class="wp-header-end">
+	<?php
+}
+
+/**
  * Output the tabs in the admin area.
  *
@@ -401,8 +448,8 @@
  *                           Possible values are 'settings' & 'tools'.
  */
-function bp_core_admin_tabs( $active_tab = '', $context = 'settings' ) {
+function bp_core_admin_tabs( $active_tab = '', $context = 'settings', $echo = true ) {
 	$tabs_html    = '';
-	$idle_class   = 'nav-tab';
-	$active_class = 'nav-tab nav-tab-active';
+	$idle_class   = 'buddypress-nav-tab';
+	$active_class = 'buddypress-nav-tab active';
 
 	/**
@@ -413,15 +460,19 @@
 	 * @param array $value Array of tabs to output to the admin area.
 	 */
-	$tabs = apply_filters( 'bp_core_admin_tabs', bp_core_get_admin_tabs( $active_tab, $context ) );
+	$tabs         = apply_filters( 'bp_core_admin_tabs', bp_core_get_admin_tabs( $active_tab, $context ) );
+	$tabs_html    = array();
 
 	// Loop through tabs and build navigation.
 	foreach ( array_values( $tabs ) as $tab_data ) {
-		$is_current = (bool) ( $tab_data['name'] == $active_tab );
-		$tab_class  = $is_current ? $active_class : $idle_class;
-		$tabs_html .= '<a href="' . esc_url( $tab_data['href'] ) . '" class="' . esc_attr( $tab_class ) . '">' . esc_html( $tab_data['name'] ) . '</a>';
-	}
-
-	echo $tabs_html;
-
+		$is_current     = (bool) ( $tab_data['name'] == $active_tab );
+		$tab_class      = $is_current ? $active_class : $idle_class;
+		$tabs_html[]    = '<a href="' . esc_url( $tab_data['href'] ) . '" class="' . esc_attr( $tab_class ) . '">' . esc_html( $tab_data['name'] ) . '</a>';
+	}
+
+	if ( ! $echo ) {
+		return $tabs_html;
+	}
+
+	echo implode( "\n", $tabs_html );
 	/**
 	 * Fires after the output of tabs for the admin area.
@@ -429,8 +480,101 @@
 	 * @since 1.5.0
 	 * @since 8.0.0 Adds the `$context` parameter.
+	 * @since 10.0.0 Adds the `$active_tab` parameter.
 	 *
 	 * @param string $context The context of use for the tabs.
 	 */
-	do_action( 'bp_admin_tabs', $context );
+	do_action( 'bp_admin_tabs', $context, $active_tab );
+}
+
+/**
+ * Returns the BP Admin settings tabs.
+ *
+ * @since 10.0.0
+ *
+ * @param bool $apply_filters Whether to apply filters or not.
+ * @return array              The BP Admin settings tabs.
+ */
+function bp_core_get_admin_settings_tabs( $apply_filters = true ) {
+	$settings_tabs = array(
+		'0' => array(
+			'id'   => 'bp-components',
+			'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-components' ), 'admin.php' ) ),
+			'name' => __( 'Components', 'buddypress' ),
+		),
+		'2' => array(
+			'id'   => 'bp-settings',
+			'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-settings' ), 'admin.php' ) ),
+			'name' => __( 'Options', 'buddypress' ),
+		),
+		'1' => array(
+			'id'   => 'bp-page-settings',
+			'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-page-settings' ), 'admin.php' ) ),
+			'name' => __( 'Pages', 'buddypress' ),
+		),
+		'3' => array(
+			'id'   => 'bp-credits',
+			'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-credits' ), 'admin.php' ) ),
+			'name' => __( 'Credits', 'buddypress' ),
+		),
+	);
+
+	if ( ! $apply_filters ) {
+		return $settings_tabs;
+	}
+
+	/**
+	 * Filter here to edit the BP Admin settings tabs.
+	 *
+	 * @since 10.0.0
+	 *
+	 * @param array $settings_tabs The BP Admin settings tabs.
+	 */
+	return apply_filters( 'bp_core_get_admin_settings_tabs', $settings_tabs );
+}
+
+/**
+ * Returns the BP Admin tools tabs.
+ *
+ * @since 10.0.0
+ *
+ * @param bool $apply_filters Whether to apply filters or not.
+ * @return array              The BP Admin tools tabs.
+ */
+function bp_core_get_admin_tools_tabs( $apply_filters = true ) {
+	$tools_page = 'tools.php';
+	if ( bp_core_do_network_admin() ) {
+		$tools_page = 'admin.php';
+	}
+
+	$tools_tabs = array(
+		'0' => array(
+			'id'   => 'bp-tools',
+			'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-tools' ), $tools_page ) ),
+			'name' => __( 'Repair', 'buddypress' ),
+		),
+		'1' => array(
+			'id'   => 'bp-members-invitations',
+			'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-members-invitations' ), $tools_page ) ),
+			'name' => __( 'Manage Invitations', 'buddypress' ),
+		),
+		'2' => array(
+			'id'   => 'bp-optouts',
+			'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-optouts' ), $tools_page ) ),
+			'name' => __( 'Manage Opt-outs', 'buddypress' ),
+		),
+	);
+
+	if ( ! $apply_filters ) {
+		return $tools_tabs;
+	}
+
+	/**
+	 * Filter here to edit the BP Admin tools tabs.
+	 *
+	 * @since 10.0.0
+	 *
+	 * @param array $tools_tabs The BP Admin tools tabs.
+	 */
+	return apply_filters( 'bp_core_get_admin_tools_tabs', $tools_tabs );
 }
 
@@ -450,42 +594,7 @@
 
 	if ( 'settings' === $context ) {
-		$tabs = array(
-			'0' => array(
-				'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-components' ), 'admin.php' ) ),
-				'name' => __( 'Components', 'buddypress' ),
-			),
-			'2' => array(
-				'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-settings' ), 'admin.php' ) ),
-				'name' => __( 'Options', 'buddypress' ),
-			),
-			'1' => array(
-				'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-page-settings' ), 'admin.php' ) ),
-				'name' => __( 'Pages', 'buddypress' ),
-			),
-			'3' => array(
-				'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-credits' ), 'admin.php' ) ),
-				'name' => __( 'Credits', 'buddypress' ),
-			),
-		);
+		$tabs = bp_core_get_admin_settings_tabs();
 	} elseif ( 'tools' === $context ) {
-		$tools_page = 'tools.php';
-		if ( bp_core_do_network_admin() ) {
-			$tools_page = 'admin.php';
-		}
-
-		$tabs = array(
-			'0' => array(
-				'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-tools' ), $tools_page ) ),
-				'name' => __( 'Repair', 'buddypress' ),
-			),
-			'1' => array(
-				'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-members-invitations' ), $tools_page ) ),
-				'name' => __( 'Manage Invitations', 'buddypress' ),
-			),
-			'2' => array(
-				'href' => bp_get_admin_url( add_query_arg( array( 'page' => 'bp-optouts' ), $tools_page ) ),
-				'name' => __( 'Manage Opt-outs', 'buddypress' ),
-			),
-		);
+		$tabs = bp_core_get_admin_tools_tabs();
 	}
 
@@ -501,4 +610,41 @@
 	return apply_filters( 'bp_core_get_admin_tabs', $tabs, $context );
 }
+
+/**
+ * Makes sure plugins using `bp_core_admin_tabs()` to output their custom BP Admin Tabs are well displayed
+ * inside the 10.0.0 tabbed header.
+ *
+ * @since 10.0.0
+ *
+ * @param string $context    The context of use for the tabs.
+ * @param string $active_tab The active tab.
+ */
+function bp_backcompat_admin_tabs( $context = '', $active_tab = '' ) {
+	$bp = buddypress();
+
+	// Only add the back compat for Settings or Tools sub pages.
+	if ( 'settings' !== $context && 'tools' !== $context ) {
+		return;
+	}
+
+	// Globalize the active tab for backcompat purpose.
+	if ( ! $bp->admin->active_nav_tab || $active_tab !== $bp->admin->active_nav_tab ) {
+		_doing_it_wrong(
+			'bp_core_admin_tabs()',
+			__( 'BuddyPress Settings and Tools Screens are now using a new tabbed header. Please use `bp_core_admin_tabbed_screen_header()` instead of bp_core_admin_tabs() to output tabs.', 'buddypress' ),
+			'10.0.0'
+		);
+
+		// Let's try to use JavaScript to force the use of the 10.0.0 Admin tabbed screen header.
+		wp_enqueue_script(
+			'bp-backcompat-admin-tabs',
+			sprintf( '%1$sbackcompat-admin-tabs%2$s.js', $bp->admin->js_url, bp_core_get_minified_asset_suffix() ),
+			array(),
+			bp_get_version(),
+			true
+		);
+	}
+}
+add_action( 'bp_admin_tabs', 'bp_backcompat_admin_tabs', 1, 2 );
 
 /** Help **********************************************************************/
@@ -1292,10 +1438,17 @@
  * @since 2.8.0
  *
- * @param string $classes CSS classes for the body tag in the admin, a comma separated string.
+ * @param string $classes CSS classes for the body tag in the admin, a space separated string.
  *
  * @return string
  */
 function bp_core_admin_body_classes( $classes ) {
-	return $classes . ' buddypress';
+	$bp = buddypress();
+
+	$bp_class = ' buddypress';
+	if ( isset( $bp->admin->nav_tabs ) && $bp->admin->nav_tabs ) {
+		$bp_class .= ' bp-is-tabbed-screen';
+	}
+
+	return $classes . $bp_class;
 }
 add_filter( 'admin_body_class', 'bp_core_admin_body_classes' );
Index: /trunk/src/bp-core/admin/bp-core-admin-optouts.php
===================================================================
--- /trunk/src/bp-core/admin/bp-core-admin-optouts.php	(revision 13136)
+++ /trunk/src/bp-core/admin/bp-core-admin-optouts.php	(revision 13137)
@@ -317,12 +317,8 @@
 	);
 
+	bp_core_admin_tabbed_screen_header( __( 'BuddyPress tools', 'buddypress' ), __( 'Manage Opt-outs', 'buddypress' ), 'tools' );
 	?>
 
-	<div class="wrap">
-		<h1 class="wp-heading-inline"><?php esc_html_e( 'BuddyPress tools', 'buddypress' ); ?></h1>
-		<hr class="wp-header-end">
-
-		<h2 class="nav-tab-wrapper"><?php bp_core_admin_tabs( __( 'Manage Opt-outs', 'buddypress' ), 'tools' ); ?></h2>
-
+	<div class="buddypress-body">
 		<?php
 		if ( $usersearch ) {
@@ -426,11 +422,8 @@
 	);
 
+	bp_core_admin_tabbed_screen_header( __( 'BuddyPress tools', 'buddypress' ), __( 'Manage Opt-outs', 'buddypress' ), 'tools' );
 	?>
 
-	<div class="wrap">
-		<h1 class="wp-heading-inline"><?php esc_html_e( 'BuddyPress tools', 'buddypress' ); ?></h1>
-		<hr class="wp-header-end">
-
-		<h2 class="nav-tab-wrapper"><?php bp_core_admin_tabs( __( 'Manage Opt-outs', 'buddypress' ), 'tools' ); ?></h2>
+	<div class="buddypress-body">
 
 		<p><?php echo esc_html( $helper_text ); ?></p>
Index: /trunk/src/bp-core/admin/bp-core-admin-settings.php
===================================================================
--- /trunk/src/bp-core/admin/bp-core-admin-settings.php	(revision 13136)
+++ /trunk/src/bp-core/admin/bp-core-admin-settings.php	(revision 13137)
@@ -289,14 +289,8 @@
 	// We're saving our own options, until the WP Settings API is updated to work with Multisite.
 	$form_action = add_query_arg( 'page', 'bp-settings', bp_get_admin_url( 'admin.php' ) );
-
+	bp_core_admin_tabbed_screen_header( __( 'BuddyPress Settings', 'buddypress' ), __( 'Options', 'buddypress' ) );
 	?>
 
-	<div class="wrap">
-
-		<h1 class="wp-heading-inline"><?php esc_html_e( 'BuddyPress Settings', 'buddypress' ); ?></h1>
-		<hr class="wp-header-end">
-
-		<h2 class="nav-tab-wrapper"><?php bp_core_admin_tabs( esc_html__( 'Options', 'buddypress' ) ); ?></h2>
-
+	<div class="buddypress-body">
 		<form action="<?php echo esc_url( $form_action ) ?>" method="post">
 
Index: /trunk/src/bp-core/admin/bp-core-admin-slugs.php
===================================================================
--- /trunk/src/bp-core/admin/bp-core-admin-slugs.php	(revision 13136)
+++ /trunk/src/bp-core/admin/bp-core-admin-slugs.php	(revision 13137)
@@ -18,12 +18,8 @@
  */
 function bp_core_admin_slugs_settings() {
+	bp_core_admin_tabbed_screen_header( __( 'BuddyPress Settings', 'buddypress' ), __( 'Pages', 'buddypress' ) );
 ?>
 
-	<div class="wrap">
-
-		<h1 class="wp-heading-inline"><?php esc_html_e( 'BuddyPress Settings', 'buddypress' ); ?> </h1>
-		<hr class="wp-header-end">
-
-		<h2 class="nav-tab-wrapper"><?php bp_core_admin_tabs( esc_html__( 'Pages', 'buddypress' ) ); ?></h2>
+	<div class="buddypress-body">
 		<form action="" method="post" id="bp-admin-page-form">
 
Index: /trunk/src/bp-core/admin/bp-core-admin-tools.php
===================================================================
--- /trunk/src/bp-core/admin/bp-core-admin-tools.php	(revision 13136)
+++ /trunk/src/bp-core/admin/bp-core-admin-tools.php	(revision 13137)
@@ -17,11 +17,7 @@
  */
 function bp_core_admin_tools() {
+	bp_core_admin_tabbed_screen_header( __( 'BuddyPress tools', 'buddypress' ), __( 'Repair', 'buddypress' ), 'tools' );
 	?>
-	<div class="wrap">
-
-		<h1 class="wp-heading-inline"><?php esc_html_e( 'BuddyPress Tools', 'buddypress' ) ?></h1>
-		<hr class="wp-header-end">
-
-		<h2 class="nav-tab-wrapper"><?php bp_core_admin_tabs( __( 'Repair', 'buddypress' ), 'tools' ); ?></h2>
+	<div class="buddypress-body">
 
 		<p><?php esc_html_e( 'BuddyPress keeps track of various relationships between members, groups, and activity items.', 'buddypress' ); ?></p>
Index: /trunk/src/bp-core/admin/css/common-rtl.css
===================================================================
--- /trunk/src/bp-core/admin/css/common-rtl.css	(revision 13136)
+++ /trunk/src/bp-core/admin/css/common-rtl.css	(revision 13137)
@@ -36,5 +36,5 @@
 	color: #d84800;
 	display: inline-block;
-	font: 400 150px/1 dashicons !important;
+	font: 400 150px/1 dashicons;
 }
 
@@ -121,10 +121,10 @@
 	padding-bottom: 15px;
 	height: 70px;
-	width: 280px;
+	width: 250px;
 }
 
 .bp-about-wrap .compact .wp-person {
 	height: auto;
-	width: 180px;
+	width: 150px;
 	padding-bottom: 0;
 	margin-bottom: 0;
@@ -557,2 +557,94 @@
 	content: "\f534";
 }
+
+/*------------------------------------------------------------------------------
+ * 7.0 Admins page with tabbed nav.
+ *----------------------------------------------------------------------------*/
+body.bp-is-tabbed-screen #wpcontent {
+	padding-right: 0;
+}
+
+.buddypress-header {
+	text-align: center;
+	margin: 0 0 1rem;
+	background: #fff;
+	border-bottom: 1px solid #dcdcde;
+}
+
+.buddypress-title-section {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	flex-direction: column;
+	clear: both;
+	padding: 1rem 0;
+}
+
+.buddypress-title-section h1 {
+	display: inline-block;
+	font-weight: 600;
+	margin: 0 0.8rem;
+	font-size: 23px;
+	padding: 9px 0 4px;
+	line-height: 1.3;
+}
+
+.buddypress-title-section h1 .bp-badge {
+	font-size: 32px;
+	vertical-align: top;
+}
+
+.buddypress-tabs-wrapper {
+
+	/* IE 11 */
+	display: -ms-inline-grid;
+	-ms-grid-columns: 1fr 1fr;
+	vertical-align: top;
+
+	/* modern browsers */
+	display: inline-grid; /* stylelint-disable-line declaration-block-no-duplicate-properties */
+	grid-template-columns: 1fr 1fr;
+}
+
+.buddypress-tabs-wrapper .buddypress-nav-tab {
+	display: block;
+	text-decoration: none;
+	color: inherit;
+	padding: 0.5rem 1rem 1rem;
+	margin: 0 1rem;
+	transition: box-shadow 0.5s ease-in-out;
+}
+
+.buddypress-tabs-wrapper .buddypress-nav-tab.active {
+	box-shadow: inset 0 -3px #3582c4;
+	font-weight: 600;
+}
+
+.buddypress-body {
+	max-width: 800px;
+	margin: 0 auto;
+}
+
+.buddypress-body .form-table {
+	border: 1px solid #dcdcde;
+	background-color: #fff;
+	padding: 0.5rem 1rem;
+	border-collapse: inherit;
+}
+
+/* Media queries */
+@media screen and (max-width: 782px) {
+
+	.buddypress-body {
+		margin: 0 12px;
+		width: auto;
+	}
+}
+
+@media only screen and (max-width: 1004px) {
+
+	.buddypress-body {
+		margin: 0 22px;
+		width: auto;
+	}
+}
Index: /trunk/src/bp-core/admin/css/common.css
===================================================================
--- /trunk/src/bp-core/admin/css/common.css	(revision 13136)
+++ /trunk/src/bp-core/admin/css/common.css	(revision 13137)
@@ -36,5 +36,5 @@
 	color: #d84800;
 	display: inline-block;
-	font: 400 150px/1 dashicons !important;
+	font: 400 150px/1 dashicons;
 }
 
@@ -121,10 +121,10 @@
 	padding-bottom: 15px;
 	height: 70px;
-	width: 280px;
+	width: 250px;
 }
 
 .bp-about-wrap .compact .wp-person {
 	height: auto;
-	width: 180px;
+	width: 150px;
 	padding-bottom: 0;
 	margin-bottom: 0;
@@ -557,2 +557,94 @@
 	content: "\f534";
 }
+
+/*------------------------------------------------------------------------------
+ * 7.0 Admins page with tabbed nav.
+ *----------------------------------------------------------------------------*/
+body.bp-is-tabbed-screen #wpcontent {
+	padding-left: 0;
+}
+
+.buddypress-header {
+	text-align: center;
+	margin: 0 0 1rem;
+	background: #fff;
+	border-bottom: 1px solid #dcdcde;
+}
+
+.buddypress-title-section {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	flex-direction: column;
+	clear: both;
+	padding: 1rem 0;
+}
+
+.buddypress-title-section h1 {
+	display: inline-block;
+	font-weight: 600;
+	margin: 0 0.8rem;
+	font-size: 23px;
+	padding: 9px 0 4px;
+	line-height: 1.3;
+}
+
+.buddypress-title-section h1 .bp-badge {
+	font-size: 32px;
+	vertical-align: top;
+}
+
+.buddypress-tabs-wrapper {
+
+	/* IE 11 */
+	display: -ms-inline-grid;
+	-ms-grid-columns: 1fr 1fr;
+	vertical-align: top;
+
+	/* modern browsers */
+	display: inline-grid; /* stylelint-disable-line declaration-block-no-duplicate-properties */
+	grid-template-columns: 1fr 1fr;
+}
+
+.buddypress-tabs-wrapper .buddypress-nav-tab {
+	display: block;
+	text-decoration: none;
+	color: inherit;
+	padding: 0.5rem 1rem 1rem;
+	margin: 0 1rem;
+	transition: box-shadow 0.5s ease-in-out;
+}
+
+.buddypress-tabs-wrapper .buddypress-nav-tab.active {
+	box-shadow: inset 0 -3px #3582c4;
+	font-weight: 600;
+}
+
+.buddypress-body {
+	max-width: 800px;
+	margin: 0 auto;
+}
+
+.buddypress-body .form-table {
+	border: 1px solid #dcdcde;
+	background-color: #fff;
+	padding: 0.5rem 1rem;
+	border-collapse: inherit;
+}
+
+/* Media queries */
+@media screen and (max-width: 782px) {
+
+	.buddypress-body {
+		margin: 0 12px;
+		width: auto;
+	}
+}
+
+@media only screen and (max-width: 1004px) {
+
+	.buddypress-body {
+		margin: 0 22px;
+		width: auto;
+	}
+}
Index: /trunk/src/bp-core/admin/js/backcompat-admin-tabs.js
===================================================================
--- /trunk/src/bp-core/admin/js/backcompat-admin-tabs.js	(revision 13137)
+++ /trunk/src/bp-core/admin/js/backcompat-admin-tabs.js	(revision 13137)
@@ -0,0 +1,66 @@
+( function() {
+	var bpBackCompatAdminTabs = function() {
+		var wrap = document.querySelector( '.nav-tab-wrapper' ).closest( '.wrap' );
+
+		if ( wrap ) {
+			// 1. Add the tabbed class to the body tag.
+			document.body.classList.add( 'bp-is-tabbed-screen' );
+
+			// 2. Make the wrapping div the BuddyPress body.
+			wrap.classList.add( 'buddypress-body' );
+			wrap.classList.remove( 'wrap' );
+
+			// 3. Create the BuddyPress header.
+			var buddypressHeader = document.createElement( 'div' );
+			buddypressHeader.classList.add( 'buddypress-header' );
+
+			var headings = wrap.querySelectorAll( 'h1' );
+			var buddypressTitleSection = document.createElement( 'div' );
+			buddypressTitleSection.classList.add( 'buddypress-title-section' );
+
+			// 4. Move the document title in it.
+			if ( headings && headings[0] ) {
+				var buddyPressLogo = document.createElement( 'span' );
+				buddyPressLogo.classList.add( 'bp-badge' );
+				headings[0].innerHTML = '&nbsp;' + headings[0].innerHTML;
+				headings[0].prepend( buddyPressLogo );
+				buddypressTitleSection.appendChild( headings[0] );
+			}
+
+			buddypressHeader.appendChild( buddypressTitleSection );
+
+			// 5. Move the tabs in it.
+			var headerNavTabs = document.createElement( 'nav' );
+			headerNavTabs.classList.add( 'buddypress-tabs-wrapper' );
+
+			var bpAdminTabs = document.querySelectorAll( '.buddypress-nav-tab' );
+			var columns = [];
+			bpAdminTabs.forEach( function( tabItem ) {
+				headerNavTabs.appendChild( tabItem );
+				columns.push( '1fr' );
+			} );
+
+			// 6. Add the header's nav tabs into the header.
+			buddypressHeader.appendChild( headerNavTabs );
+
+			// 7. Edit the number of grid columns.
+			if ( columns.length > 0 ) {
+				headerNavTabs.setAttribute( 'style', '-ms-grid-columns: ' + columns.join( ' ' ) + '; grid-template-columns: ' + columns.join( ' ' ) + ';');
+			}
+
+			// 8. Create the header's separator.
+			var headerSeparator = document.createElement( 'hr' );
+			headerSeparator.classList.add( 'wp-header-end' );
+
+			// 9. Insert the BuddyPress header into the document.
+			document.querySelector('#wpbody-content').insertBefore( buddypressHeader, wrap );
+			document.querySelector('#wpbody-content').insertBefore( headerSeparator, wrap );
+		}
+	};
+
+	if ( 'loading' === document.readyState ) {
+		document.addEventListener( 'DOMContentLoaded', bpBackCompatAdminTabs );
+	} else {
+		bpBackCompatAdminTabs;
+	}
+} )();
Index: /trunk/src/bp-core/classes/class-bp-admin.php
===================================================================
--- /trunk/src/bp-core/classes/class-bp-admin.php	(revision 13136)
+++ /trunk/src/bp-core/classes/class-bp-admin.php	(revision 13137)
@@ -75,4 +75,28 @@
 	 */
 	public $notices = array();
+
+	/**
+	 * BuddyPress admin screens nav tabs.
+	 *
+	 * @since 10.0.0
+	 * @var array()
+	 */
+	public $nav_tabs = array();
+
+	/**
+	 * BuddyPress admin active nav tab.
+	 *
+	 * @since 10.0.0
+	 * @var string()
+	 */
+	public $active_nav_tab = '';
+
+	/**
+	 * BuddyPress admin screens submenu pages.
+	 *
+	 * @since 10.0.0
+	 * @var array()
+	 */
+	public $submenu_pages = array();
 
 	/** Methods ***************************************************************/
@@ -230,5 +254,5 @@
 
 		// Add the option pages.
-		$hooks[] = add_submenu_page(
+		$bp_components_page = add_submenu_page(
 			$this->settings_page,
 			__( 'BuddyPress Components', 'buddypress' ),
@@ -239,5 +263,8 @@
 		);
 
-		$hooks[] = add_submenu_page(
+		$this->submenu_pages['settings']['bp-components'] = $bp_components_page;
+		$hooks[]                                          = $bp_components_page;
+
+		$bp_page_settings_page = add_submenu_page(
 			$this->settings_page,
 			__( 'BuddyPress Pages', 'buddypress' ),
@@ -248,5 +275,8 @@
 		);
 
-		$hooks[] = add_submenu_page(
+		$this->submenu_pages['settings']['bp-page-settings'] = $bp_page_settings_page;
+		$hooks[]                                             = $bp_page_settings_page;
+
+		$bp_settings_page = add_submenu_page(
 			$this->settings_page,
 			__( 'BuddyPress Options', 'buddypress' ),
@@ -257,6 +287,9 @@
 		);
 
+		$this->submenu_pages['settings']['bp-settings'] = $bp_settings_page;
+		$hooks[]                                        = $bp_settings_page;
+
 		// Credits.
-		$hooks[] = add_submenu_page(
+		$bp_credits_page = add_submenu_page(
 			$this->settings_page,
 			__( 'BuddyPress Credits', 'buddypress' ),
@@ -266,4 +299,7 @@
 			array( $this, 'credits_screen' )
 		);
+
+		$this->submenu_pages['settings']['bp-credits'] = $bp_credits_page;
+		$hooks[]                                       = $bp_credits_page;
 
 		// For consistency with non-Multisite, we add a Tools menu in
@@ -294,5 +330,8 @@
 		}
 
-		$hooks[] = add_submenu_page(
+		// Init the Tools submenu pages global.
+		$this->submenu_pages['tools'] = array();
+
+		$bp_repair_tools = add_submenu_page(
 			$tools_parent,
 			__( 'BuddyPress Tools', 'buddypress' ),
@@ -303,5 +342,8 @@
 		);
 
-		$hooks[] = add_submenu_page(
+		$this->submenu_pages['tools']['bp-tools'] = $bp_repair_tools;
+		$hooks[]                                  = $bp_repair_tools;
+
+		$bp_optouts_tools = add_submenu_page(
 			$tools_parent,
 			__( 'Manage Opt-outs', 'buddypress' ),
@@ -311,4 +353,7 @@
 			'bp_core_optouts_admin'
 		);
+
+		$this->submenu_pages['tools']['bp-optouts'] = $bp_optouts_tools;
+		$hooks[]                                    = $bp_optouts_tools;
 
 		// For network-wide configs, add a link to (the root site's) Emails screen.
@@ -333,4 +378,19 @@
 		foreach( $hooks as $hook ) {
 			add_action( "admin_head-$hook", 'bp_core_modify_admin_menu_highlight' );
+		}
+
+		/**
+		 * Fires before adding inline styles for BP Admin tabs.
+		 *
+		 * @since 10.0.0
+		 *
+		 * @param array $submenu_pages The BP_Admin submenu pages passed by reference.
+		 */
+		do_action_ref_array( 'bp_admin_submenu_pages', array( &$this->submenu_pages ) );
+
+		foreach( $this->submenu_pages as $subpage_hooks ) {
+			foreach ( $subpage_hooks as $subpage_hook ) {
+				add_action( "admin_print_styles-{$subpage_hook}", array( $this, 'add_inline_styles' ), 20 );
+			}
 		}
 	}
@@ -811,12 +871,8 @@
 	 */
 	public function credits_screen() {
+		bp_core_admin_tabbed_screen_header( __( 'BuddyPress Settings', 'buddypress' ), __( 'Credits', 'buddypress' ) );
 	?>
 
-		<div class="wrap bp-about-wrap">
-
-		<h1 class="wp-heading-inline"><?php esc_html_e( 'BuddyPress Settings', 'buddypress' ); ?></h1>
-		<hr class="wp-header-end">
-
-		<h2 class="nav-tab-wrapper"><?php bp_core_admin_tabs( esc_html__( 'Credits', 'buddypress' ) ); ?></h2>
+		<div class="buddypress-body bp-about-wrap">
 
 			<p class="about-description"><?php esc_html_e( 'Meet the contributors behind BuddyPress:', 'buddypress' ); ?></p>
@@ -1225,4 +1281,51 @@
 		}
 	}
+
+	/**
+	 * Adds inline styles to adapt the number of grid columns according to the number of BP Admin tabs.
+	 *
+	 * @since 10.0.0
+	 */
+	public function add_inline_styles() {
+		$screen                  = get_current_screen();
+		$current_settings_tab_id = array_search( $screen->id, $this->submenu_pages['settings'], true );
+		$current_tools_tab_id    = array_search( $screen->id, $this->submenu_pages['tools'], true );
+		$current_tab_id          = '';
+		$tabs                    = array();
+		$context                 = '';
+
+		if ( $current_settings_tab_id ) {
+			$current_tab_id = $current_settings_tab_id;
+			$tabs           = wp_list_pluck( bp_core_get_admin_settings_tabs(), 'name', 'id' );
+			$context        = 'settings';
+		} elseif ( $current_tools_tab_id ) {
+			$current_tab_id = $current_tools_tab_id;
+			$tabs           = wp_list_pluck( bp_core_get_admin_tools_tabs(), 'name', 'id' );
+			$context        = 'tools';
+		}
+
+		if ( $current_tab_id && isset( $tabs[ $current_tab_id ] ) ) {
+			$this->nav_tabs = bp_core_admin_tabs( $tabs[ $current_tab_id ], $context, false );
+			$grid_columns   = array_fill( 0, count( $this->nav_tabs ), '1fr');
+			$help_tab_css   = '';
+
+			if ( $screen->get_help_tabs() ) {
+				$help_tab_css  = '#screen-meta { margin-right: 0; } #screen-meta-links { position: absolute; right: 0; }';
+			}
+
+			wp_add_inline_style(
+				'bp-admin-common-css',
+				sprintf(
+					'.buddypress-tabs-wrapper {
+						-ms-grid-columns: %1$s;
+						grid-template-columns: %1$s;
+					}
+					%2$s',
+					implode( " ", $grid_columns ),
+					$help_tab_css
+				)
+			);
+		}
+	}
 }
 endif; // End class_exists check.
Index: /trunk/src/bp-members/classes/class-bp-members-admin.php
===================================================================
--- /trunk/src/bp-members/classes/class-bp-members-admin.php	(revision 13136)
+++ /trunk/src/bp-members/classes/class-bp-members-admin.php	(revision 13137)
@@ -150,4 +150,14 @@
 			$this->capability = 'manage_network_users';
 		}
+
+		/*
+		 * For consistency with non-Multisite, we add a Tools menu in
+		 * the Network Admin as a home for our Tools panel.
+		 */
+		if ( is_multisite() && bp_core_do_network_admin() ) {
+			$this->tools_parent = 'network-tools';
+		} else {
+			$this->tools_parent = 'tools.php';
+		}
 	}
 
@@ -255,4 +265,7 @@
 			add_filter( 'pre_get_users', array( $this, 'users_table_filter_by_type' ) );
 		}
+
+		// Add the Members invitations submenu page to the tools submenu pages.
+		add_action( 'bp_admin_submenu_pages', array( $this, 'set_submenu_page' ), 10, 1 );
 	}
 
@@ -512,14 +525,6 @@
 		}
 
-		// For consistency with non-Multisite, we add a Tools menu in
-		// the Network Admin as a home for our Tools panel.
-		if ( is_multisite() && bp_core_do_network_admin() ) {
-			$tools_parent = 'network-tools';
-		} else {
-			$tools_parent = 'tools.php';
-		}
-
 		$hooks['members_invitations'] = $this->members_invites_page = add_submenu_page(
-			$tools_parent,
+			$this->tools_parent,
 			__( 'Manage Invitations',  'buddypress' ),
 			__( 'Manage Invitations',  'buddypress' ),
@@ -571,4 +576,17 @@
 		// Highlight the BuddyPress tools submenu when managing invitations.
 		add_action( "admin_head-{$this->members_invites_page}", 'bp_core_modify_admin_menu_highlight' );
+	}
+
+	/**
+	 * Include the Members Invitations tab to the Admin tabs needing specific inline styles.
+	 *
+	 * @since 10.0.0
+	 *
+	 * @param array $submenu_pages The BP_Admin submenu pages passed by reference.
+	 */
+	public function set_submenu_page( &$submenu_pages ) {
+		if ( isset( $submenu_pages['tools'] ) ) {
+			$submenu_pages['tools']['bp-members-invitations'] = get_plugin_page_hookname( 'bp-members-invitations', $this->tools_parent );
+		}
 	}
 
@@ -3004,12 +3022,8 @@
 		);
 
+		bp_core_admin_tabbed_screen_header( __( 'BuddyPress tools', 'buddypress' ), __( 'Manage Invitations', 'buddypress' ), 'tools' );
 		?>
 
-		<div class="wrap">
-			<h1 class="wp-heading-inline"><?php esc_html_e( 'BuddyPress tools', 'buddypress' ); ?></h1>
-			<hr class="wp-header-end">
-
-			<h2 class="nav-tab-wrapper"><?php bp_core_admin_tabs( __( 'Manage Invitations', 'buddypress' ), 'tools' ); ?></h2>
-
+		<div class="buddypress-body">
 			<?php
 			if ( $usersearch ) {
@@ -3125,9 +3139,9 @@
 		);
 
+		bp_core_admin_tabbed_screen_header( __( 'BuddyPress tools', 'buddypress' ), __( 'Manage Invitations', 'buddypress' ), 'tools' );
 		?>
 
-		<div class="wrap">
-			<h1 class="wp-heading-inline"><?php echo esc_html( $header_text ); ?></h1>
-			<hr class="wp-header-end">
+		<div class="buddypress-body">
+			<h2><?php echo esc_html( $header_text ); ?></h2>
 
 			<p><?php echo esc_html( $helper_text ); ?></p>
