vhad/wordpress-develop
1
0
Fork 0
mirror of https://github.com/gosticks/wordpress-develop.git synced 2026-04-10 07:34:34 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Site Health: Support custom sub-menus and pages.

Browse Source 
Allow developers to extend the Site Health screen with their own custom navigation tabs and pages.

This implements a new filter, `site_health_navigation_tabs`, which takes an associated array of tab identifiers/slugs, and tab labels, allowing developers to add their own subpage to the Site Health interface as new tabs.

To output a custom page, or add to an existing page, the `site_health_tab_content` action is triggered whenever the `tab` query argument is present and not empty. This action includes the current tab as its argument, which a developer would match against to only output content when relevant.

Props ramiy for initial patch.
Fixes #47225.

git-svn-id: https://develop.svn.wordpress.org/trunk@50764 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Marius L. J
2021-04-17 01:12:25 +00:00
parent bf17761e70
commit a32a192ede
5 changed files with 182 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
src/wp-admin/css/site-health.css
View File

@@ -118,12 +118,22 @@
.health-check-tabs-wrapper {
/* IE 11 */
display: -ms-inline-grid;
-ms-grid-columns: 1fr 1fr;
-ms-grid-columns: 1fr 1fr 1fr 1fr;
vertical-align: top;
/* modern browsers */
display: inline-grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.health-check-tabs-wrapper.tab-count-1 {
grid-template-columns: 1fr;
}
.health-check-tabs-wrapper.tab-count-2 {
grid-template-columns: 1fr 1fr;
}
.health-check-tabs-wrapper.tab-count-3 {
grid-template-columns: 1fr 1fr 1fr;
}
.health-check-tab {
display: block; /* IE 11 */
@@ -134,6 +144,43 @@
transition: box-shadow 0.5s ease-in-out;
}
.health-check-offscreen-nav-wrapper {
position: relative;
background: transparent;
border: none;
}
.health-check-offscreen-nav-wrapper:focus .health-check-offscreen-nav {
left: initial;
}
.health-check-offscreen-nav {
display: none;
position: absolute;
padding-top: 10px;
right: 0;
top: 100%;
width: 13rem;
}
.health-check-offscreen-nav-wrapper.visible .health-check-offscreen-nav {
display: inline-block;
}
.health-check-offscreen-nav:before {
position: absolute;
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 10px 5px 10px;
border-color: transparent transparent #ffffff transparent;
right: 20px;
top: 5px;
}
.health-check-offscreen-nav .health-check-tab {
background: #fff;
box-shadow: 0 2px 5px 0 rgba( 0, 0, 0, 0.75 );
}
.health-check-tab:nth-child(1) {
-ms-grid-column: 1; /* IE 11 */
}
@@ -152,6 +199,10 @@
box-shadow: inset 0 -3px #3582c4;
font-weight: 600;
}
.health-check-offscreen-nav .health-check-tab.active {
box-shadow: inset 3px 0 #3582c4;
font-weight: 600;
}
.health-check-body {
max-width: 800px;