Chris@0: /**
Chris@0:  * @file
Chris@0:  * Seven styles for the System Status Report.
Chris@0:  */
Chris@0: 
Chris@0: .system-status-report__requirements-group {
Chris@0:   padding-top: 20px;
Chris@0: }
Chris@0: .system-status-report__entry {
Chris@18:   overflow: auto;
Chris@18:   width: 100%;
Chris@18:   margin: 0;
Chris@0:   border: 0;
Chris@0:   border-top: 1px solid #ccc;
Chris@18:   border-radius: 0;
Chris@17:   background-color: transparent;
Chris@0: }
Chris@0: .system-status-report__entry:last-of-type {
Chris@0:   border-bottom: 1px solid #bebfb9;
Chris@0: }
Chris@0: .system-status-report__entry--error {
Chris@0:   background-color: transparent;
Chris@0: }
Chris@0: .system-status-report__entry--warning {
Chris@0:   background-color: transparent;
Chris@0: }
Chris@0: /* Account for native and poly-filled details element */
Chris@0: .system-status-report__status-title {
Chris@0:   position: relative;
Chris@0:   box-sizing: border-box;
Chris@0:   width: 100%;
Chris@18:   padding: 1em 1em 1em 3em; /* LTR */
Chris@0:   font-weight: bold;
Chris@0: }
Chris@0: .system-status-report__status-title .details-title {
Chris@18:   text-transform: none;
Chris@0:   color: inherit;
Chris@0: }
Chris@0: .system-status-report__status-title .details-title {
Chris@0:   padding-left: 3em; /* LTR */
Chris@0: }
Chris@0: [dir="rtl"] .system-status-report__status-title .details-title {
Chris@0:   padding-right: 3em;
Chris@0:   padding-left: 0;
Chris@0: }
Chris@0: [dir="rtl"].details .system-status-report__status-title {
Chris@0:   padding: 1em 3em 1em 1em;
Chris@0: }
Chris@0: .collapse-processed > .system-status-report__status-title:before {
Chris@0:   float: right; /* LTR */
Chris@0: }
Chris@0: .system-status-report__status-title::-webkit-details-marker {
Chris@0:   float: right; /* LTR */
Chris@0: }
Chris@0: [dir="rtl"] .collapse-processed > .system-status-report__status-title:before {
Chris@0:   float: left;
Chris@0: }
Chris@0: [dir="rtl"] .system-status-report__status-title::-webkit-details-marker {
Chris@0:   float: left;
Chris@0: }
Chris@0: 
Chris@0: /* Make poly-filled details and summary elements behave correctly. */
Chris@0: .system-status-report summary:first-child ~ * {
Chris@0:   display: none;
Chris@0: }
Chris@0: .system-status-report details[open] > *,
Chris@0: .system-status-report details > summary:first-child {
Chris@0:   display: block;
Chris@17:   color: inherit;
Chris@0: }
Chris@0: 
Chris@0: .system-status-report__status-title .details-title:before,
Chris@0: .details .system-status-report__status-icon:before {
Chris@18:   position: absolute;
Chris@18:   top: 1em;
Chris@18:   left: 10px; /* LTR */
Chris@18:   display: inline-block;
Chris@18:   width: 16px;
Chris@18:   height: 16px;
Chris@18:   margin-right: 10px; /* LTR */
Chris@0:   content: "";
Chris@18:   vertical-align: top;
Chris@0:   background-repeat: no-repeat;
Chris@18:   background-position: top center;
Chris@0:   background-size: contain;
Chris@0: }
Chris@0: [dir="rtl"] .system-status-report__status-title .details-title:before,
Chris@0: [dir="rtl"].details .system-status-report__status-title:before {
Chris@18:   right: 10px;
Chris@0:   left: auto;
Chris@0:   margin-right: 0;
Chris@0: }
Chris@0: .system-status-report__status-icon--error .details-title:before,
Chris@0: .details .system-status-report__status-icon--error:before {
Chris@0:   background-image: url(../../../stable/images/core/icons/e32700/error.svg);
Chris@0: }
Chris@0: .system-status-report__status-icon--warning .details-title:before,
Chris@0: .details .system-status-report__status-icon--warning:before {
Chris@0:   background-image: url(../../../stable/images/core/icons/e29700/warning.svg);
Chris@0: }
Chris@0: 
Chris@0: .system-status-report__entry__value {
Chris@0:   box-sizing: border-box;
Chris@0:   padding: 0 1em 1em 3em; /* LTR */
Chris@0: }
Chris@0: [dir="rtl"] .system-status-report__entry__value {
Chris@0:   padding-right: 3em;
Chris@0:   padding-left: 1em;
Chris@0: }
Chris@0: 
Chris@0: @media screen and (max-width: 48em) {
Chris@0:   .system-status-report {
Chris@0:     word-wrap: break-word;
Chris@0:   }
Chris@0: }
Chris@0: 
Chris@0: @media screen and (min-width: 48em) {
Chris@0:   .system-status-report__entry::after {
Chris@0:     display: table;
Chris@0:     clear: both;
Chris@18:     content: "";
Chris@0:   }
Chris@0:   .system-status-report__status-title {
Chris@18:     float: left; /* LTR */
Chris@0:     width: 18rem;
Chris@0:     cursor: default;
Chris@0:   }
Chris@0:   .system-status-report__status-title:hover,
Chris@0:   .system-status-report__status-title:focus {
Chris@0:     text-decoration: none;
Chris@0:   }
Chris@0:   [dir="rtl"] .system-status-report__status-title {
Chris@0:     float: right;
Chris@0:   }
Chris@14:   html.js .system-status-report__status-title::-webkit-details-marker {
Chris@0:     display: none;
Chris@0:   }
Chris@0:   .collapse-processed > .system-status-report__status-title:before {
Chris@0:     position: relative;
Chris@0:     top: 3px;
Chris@0:   }
Chris@0:   .system-status-report__entry__value {
Chris@18:     display: block;
Chris@18:     float: right;
Chris@0:     width: calc(100% - 23em);
Chris@18:     padding-top: 1em;
Chris@0:     padding-left: 0; /* LTR */
Chris@0:   }
Chris@0:   [dir="rtl"] .system-status-report__entry__value {
Chris@18:     padding-right: 3em;
Chris@0:     padding-left: 0;
Chris@0:   }
Chris@0: }