mirror of
https://github.com/WordPress/WordPress.git
synced 2025-03-13 15:20:06 +01:00
8240259860
This changeset removes the `presentation` role from the Site Health debug tab tables to switch them into regular data tables, and updates the related stylesheet to keep the previously used styles. Props audrasjb, hbhalodia, rvouill, mukesh27, sabernhardt, joedolson, alexstine. Fixes #62880. Built from https://develop.svn.wordpress.org/trunk@59859 git-svn-id: http://core.svn.wordpress.org/trunk@59201 1a063a9b-81f0-0310-95a4-ce76da25c4cd
365 lines
6.2 KiB
CSS
365 lines
6.2 KiB
CSS
/*! This file is auto-generated */
|
|
/* Note: Any Site Health selectors that use
|
|
duplicate styling from the Privacy settings screen
|
|
are styled in the Privacy section of edit.css */
|
|
|
|
.health-check-body h2 {
|
|
line-height: 1.4;
|
|
}
|
|
|
|
.health-check-body h3 {
|
|
padding: 0;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.site-health-progress-wrapper {
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.site-health-progress {
|
|
display: inline-block;
|
|
height: 20px;
|
|
width: 20px;
|
|
margin: 0;
|
|
border-radius: 100%;
|
|
position: relative;
|
|
font-weight: 600;
|
|
font-size: 0.4rem;
|
|
}
|
|
|
|
.site-health-progress-count {
|
|
position: absolute;
|
|
display: block;
|
|
height: 80px;
|
|
width: 80px;
|
|
right: 50%;
|
|
top: 50%;
|
|
margin-top: -40px;
|
|
margin-right: -40px;
|
|
border-radius: 100%;
|
|
line-height: 6.3;
|
|
font-size: 2em;
|
|
}
|
|
|
|
.loading .site-health-progress svg #bar {
|
|
stroke-dashoffset: 0;
|
|
stroke: #c3c4c7;
|
|
animation: loadingPulse 3s infinite ease-in-out;
|
|
}
|
|
|
|
.site-health-progress svg circle {
|
|
stroke-dashoffset: 0;
|
|
transition: stroke-dashoffset 1s linear;
|
|
stroke: #c3c4c7;
|
|
stroke-width: 2em;
|
|
}
|
|
|
|
.site-health-progress svg #bar {
|
|
stroke-dashoffset: 565;
|
|
stroke: #d63638;
|
|
}
|
|
|
|
.green .site-health-progress #bar {
|
|
stroke: #00a32a;
|
|
}
|
|
.green .site-health-progress .site-health-progress-label {
|
|
color: #00a32a;
|
|
}
|
|
|
|
.orange .site-health-progress #bar {
|
|
stroke: #dba617;
|
|
}
|
|
.orange .site-health-progress .site-health-progress-label {
|
|
color: #dba617;
|
|
}
|
|
|
|
.site-health-progress-label {
|
|
font-weight: 600;
|
|
line-height: 20px;
|
|
margin-right: 0.3rem;
|
|
}
|
|
|
|
@keyframes loadingPulse {
|
|
0% {
|
|
stroke: #c3c4c7;
|
|
}
|
|
50% {
|
|
stroke: #72aee6;
|
|
}
|
|
100% {
|
|
stroke: #c3c4c7;
|
|
}
|
|
}
|
|
|
|
.health-check-tabs-wrapper {
|
|
/* IE 11 */
|
|
display: -ms-inline-grid;
|
|
-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 */
|
|
text-decoration: none;
|
|
color: inherit;
|
|
padding: 0.5rem 1rem 1rem;
|
|
margin: 0 1rem;
|
|
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 {
|
|
right: initial;
|
|
}
|
|
|
|
.health-check-offscreen-nav {
|
|
display: none;
|
|
position: absolute;
|
|
padding-top: 10px;
|
|
left: 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;
|
|
border-color: transparent transparent #ffffff;
|
|
left: 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-offscreen-nav .health-check-tab.active {
|
|
box-shadow: inset -3px 0 #3582c4;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.health-check-body {
|
|
max-width: 800px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.widefat.health-check-table th {
|
|
font-size: 13px;
|
|
}
|
|
|
|
.health-check-table td:first-child {
|
|
width: 30%;
|
|
}
|
|
|
|
.health-check-table td {
|
|
width: 70%;
|
|
}
|
|
|
|
.health-check-table ul,
|
|
.health-check-table ol {
|
|
margin: 0;
|
|
}
|
|
|
|
.health-check-body li {
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.health-check-body .pass::before,
|
|
.health-check-body .good::before {
|
|
content: "\f147";
|
|
color: #00a32a;
|
|
}
|
|
|
|
.health-check-body .warning::before {
|
|
content: "\f460";
|
|
color: #dba617;
|
|
}
|
|
|
|
.health-check-body .info::before {
|
|
content: "\f348";
|
|
color: #72aee6;
|
|
}
|
|
|
|
.health-check-body .fail::before,
|
|
.health-check-body .error::before {
|
|
content: "\f335";
|
|
color: #d63638;
|
|
}
|
|
|
|
.site-health-copy-buttons {
|
|
margin: 1rem 0;
|
|
}
|
|
|
|
.site-health-copy-buttons .copy-button-wrapper {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
margin: 0.5rem 0 1rem;
|
|
}
|
|
|
|
.site-health-copy-buttons .success {
|
|
color: #007017;
|
|
margin-right: 0.5rem;
|
|
}
|
|
|
|
.site-status-has-issues.hide {
|
|
display: none;
|
|
}
|
|
|
|
.site-health-view-more {
|
|
text-align: center;
|
|
}
|
|
|
|
.site-health-issues-wrapper:first-of-type {
|
|
margin-top: 3rem;
|
|
}
|
|
|
|
.site-health-issues-wrapper {
|
|
margin-bottom: 3rem;
|
|
margin-top: 2rem;
|
|
}
|
|
|
|
.site-status-all-clear {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
text-align: center;
|
|
height: 100%;
|
|
width: 100%;
|
|
margin: 0 0 3rem;
|
|
}
|
|
|
|
@media all and (min-width: 784px) {
|
|
.site-status-all-clear {
|
|
margin: 2rem 0 5rem;
|
|
}
|
|
}
|
|
|
|
.site-status-all-clear.hide {
|
|
display: none;
|
|
}
|
|
|
|
.site-status-all-clear .dashicons {
|
|
font-size: 150px;
|
|
height: 150px;
|
|
margin-bottom: 2rem;
|
|
width: 150px;
|
|
}
|
|
|
|
.site-status-all-clear .encouragement {
|
|
font-size: 1.5rem;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.site-status-all-clear p {
|
|
margin: 0;
|
|
}
|
|
|
|
.wp-core-ui .button.site-health-view-passed {
|
|
position: relative;
|
|
padding-left: 40px;
|
|
padding-right: 20px;
|
|
}
|
|
|
|
.health-check-wp-paths-sizes.spinner {
|
|
visibility: visible;
|
|
float: none;
|
|
margin: 0 4px;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
/* Styling unique to the dashboard widget. */
|
|
#dashboard_site_health .site-health-details {
|
|
padding-right: 16px;
|
|
}
|
|
|
|
#dashboard_site_health .site-health-details p:first-child {
|
|
margin-top: 0;
|
|
}
|
|
|
|
#dashboard_site_health .site-health-details p:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
#dashboard_site_health .health-check-widget {
|
|
display: grid;
|
|
grid-template-columns: 1fr 2fr;
|
|
grid-auto-rows: minmax(64px, auto);
|
|
column-gap: 16px;
|
|
align-items: center;
|
|
}
|
|
#dashboard_site_health .site-health-progress-label {
|
|
margin-right: 0;
|
|
}
|
|
|
|
.health-check-widget-title-section {
|
|
margin-bottom: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
@media screen and (max-width: 480px) {
|
|
#dashboard_site_health .health-check-widget {
|
|
grid-template-columns: 100%;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 782px) {
|
|
|
|
.site-health-issues-wrapper .health-check-accordion-trigger {
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.health-check-accordion-trigger .badge {
|
|
margin: 1em 0 0;
|
|
}
|
|
|
|
.health-check-table {
|
|
table-layout: fixed;
|
|
}
|
|
|
|
.health-check-table th,
|
|
.health-check-table td {
|
|
box-sizing: border-box;
|
|
display: block;
|
|
width: 100%;
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
.widefat.health-check-table th,
|
|
.health-check-table td:first-child {
|
|
width: 100%;
|
|
padding-bottom: 0;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.wp-core-ui .site-health-copy-buttons .copy-button {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|