From 5ce995c6f33167252d285367be9d72535bd36195 Mon Sep 17 00:00:00 2001 From: Patrick Hulce Date: Wed, 26 Jul 2017 14:05:08 -0700 Subject: [PATCH] fix(report): proper arrow state and consistent capitalization --- lighthouse-core/report/v2/renderer/category-renderer.js | 4 ++-- lighthouse-core/report/v2/report-styles.css | 1 + 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/lighthouse-core/report/v2/renderer/category-renderer.js b/lighthouse-core/report/v2/renderer/category-renderer.js index 1f7a31671a7a..9899fbcfa0d8 100644 --- a/lighthouse-core/report/v2/renderer/category-renderer.js +++ b/lighthouse-core/report/v2/renderer/category-renderer.js @@ -210,7 +210,7 @@ class CategoryRenderer { */ _renderAuditGroup(group, opts) { const expandable = opts.expandable; - const element = this._dom.createElement(expandable ? 'details' :'div', 'lh-audit-group'); + const element = this._dom.createElement(expandable ? 'details' : 'div', 'lh-audit-group'); const summmaryEl = this._dom.createChildOf(element, 'summary', 'lh-audit-group__summary'); const headerEl = this._dom.createChildOf(summmaryEl, 'div', 'lh-audit-group__header'); this._dom.createChildOf(summmaryEl, 'div', @@ -338,7 +338,7 @@ class CategoryRenderer { const nonPassedAudits = nonManualAudits.filter(audit => !passedAudits.includes(audit)); const nonPassedElem = this._renderAuditGroup({ - title: `${nonPassedAudits.length} failed audits`, + title: `${nonPassedAudits.length} Failed Audits`, }, {expandable: false}); nonPassedElem.classList.add('lh-failed-audits'); nonPassedAudits.forEach(audit => nonPassedElem.appendChild(this._renderAudit(audit))); diff --git a/lighthouse-core/report/v2/report-styles.css b/lighthouse-core/report/v2/report-styles.css index 229bc4e6a222..367db6093bf7 100644 --- a/lighthouse-core/report/v2/report-styles.css +++ b/lighthouse-core/report/v2/report-styles.css @@ -368,6 +368,7 @@ span.lh-node:hover { margin-left: calc(0px - var(--expandable-indent)); } +.lh-audit-group[open] > .lh-audit-group__summary > .lh-toggle-arrow, .lh-expandable-details[open] > .lh-expandable-details__summary > .lh-toggle-arrow { background-image: var(--expanded-icon-url); }