lighthouse 10.4.0 → 11.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CONTRIBUTING.md +1 -1
- package/cli/cli-flags.d.ts +1 -6
- package/cli/cli-flags.js +0 -5
- package/cli/run.js +3 -10
- package/cli/sentry-prompt.js +4 -2
- package/cli/test/smokehouse/core-tests.js +0 -2
- package/cli/test/smokehouse/frontends/smokehouse-bin.js +24 -14
- package/cli/test/smokehouse/lighthouse-runners/bundle.d.ts +1 -2
- package/cli/test/smokehouse/lighthouse-runners/bundle.js +12 -21
- package/cli/test/smokehouse/lighthouse-runners/cli.d.ts +1 -3
- package/cli/test/smokehouse/lighthouse-runners/cli.js +3 -7
- package/cli/test/smokehouse/lighthouse-runners/devtools.d.ts +1 -5
- package/cli/test/smokehouse/lighthouse-runners/devtools.js +1 -12
- package/cli/test/smokehouse/readme.md +0 -2
- package/cli/test/smokehouse/report-assert.d.ts +1 -3
- package/cli/test/smokehouse/report-assert.js +2 -19
- package/cli/test/smokehouse/smokehouse.js +3 -32
- package/core/audits/accessibility/aria-allowed-role.d.ts +10 -0
- package/core/audits/accessibility/aria-allowed-role.js +46 -0
- package/core/audits/accessibility/image-redundant-alt.d.ts +10 -0
- package/core/audits/accessibility/image-redundant-alt.js +45 -0
- package/core/audits/accessibility/label-content-name-mismatch.d.ts +10 -0
- package/core/audits/accessibility/label-content-name-mismatch.js +44 -0
- package/core/audits/accessibility/skip-link.d.ts +10 -0
- package/core/audits/accessibility/skip-link.js +43 -0
- package/core/audits/accessibility/table-duplicate-name.d.ts +10 -0
- package/core/audits/accessibility/table-duplicate-name.js +44 -0
- package/core/audits/accessibility/target-size.js +1 -1
- package/core/audits/byte-efficiency/duplicated-javascript.js +2 -2
- package/core/audits/byte-efficiency/render-blocking-resources.js +1 -0
- package/core/audits/dobetterweb/uses-http2.d.ts +18 -1
- package/core/audits/dobetterweb/uses-http2.js +62 -16
- package/core/audits/installable-manifest.d.ts +1 -5
- package/core/audits/installable-manifest.js +2 -7
- package/core/audits/largest-contentful-paint-element.d.ts +0 -6
- package/core/audits/largest-contentful-paint-element.js +13 -15
- package/core/audits/metrics/{experimental-interaction-to-next-paint.d.ts → interaction-to-next-paint.d.ts} +3 -3
- package/core/audits/metrics/{experimental-interaction-to-next-paint.js → interaction-to-next-paint.js} +3 -3
- package/core/audits/uses-rel-preconnect.js +23 -8
- package/core/audits/work-during-interaction.js +2 -2
- package/core/computed/processed-navigation.d.ts +1 -1
- package/core/config/config-helpers.d.ts +3 -3
- package/core/config/config-helpers.js +5 -12
- package/core/config/config.js +1 -7
- package/core/config/constants.d.ts +0 -2
- package/core/config/constants.js +2 -18
- package/core/config/default-config.js +59 -53
- package/core/config/filters.js +1 -1
- package/core/config/validation.d.ts +7 -12
- package/core/config/validation.js +16 -26
- package/core/gather/base-artifacts.d.ts +4 -4
- package/core/gather/base-artifacts.js +2 -6
- package/core/gather/base-gatherer.d.ts +12 -37
- package/core/gather/base-gatherer.js +7 -54
- package/core/gather/driver/dom.d.ts +4 -4
- package/core/gather/driver/dom.js +2 -2
- package/core/gather/driver/environment.d.ts +4 -4
- package/core/gather/driver/environment.js +2 -2
- package/core/gather/driver/execution-context.d.ts +12 -3
- package/core/gather/driver/execution-context.js +34 -3
- package/core/gather/driver/navigation.d.ts +2 -2
- package/core/gather/driver/navigation.js +2 -5
- package/core/gather/driver/network-monitor.d.ts +7 -6
- package/core/gather/driver/network-monitor.js +4 -4
- package/core/gather/driver/network.d.ts +2 -2
- package/core/gather/driver/network.js +1 -1
- package/core/gather/driver/prepare.d.ts +10 -10
- package/core/gather/driver/prepare.js +10 -10
- package/core/gather/driver/service-workers.d.ts +4 -4
- package/core/gather/driver/service-workers.js +2 -2
- package/core/gather/driver/storage.d.ts +6 -6
- package/core/gather/driver/storage.js +3 -3
- package/core/gather/driver/target-manager.d.ts +6 -5
- package/core/gather/driver/target-manager.js +3 -3
- package/core/gather/driver/wait-for-condition.d.ts +14 -14
- package/core/gather/driver/wait-for-condition.js +8 -8
- package/core/gather/driver.d.ts +9 -6
- package/core/gather/driver.js +14 -4
- package/core/gather/fetcher.d.ts +3 -3
- package/core/gather/fetcher.js +1 -1
- package/core/gather/gatherers/accessibility.d.ts +4 -4
- package/core/gather/gatherers/accessibility.js +8 -3
- package/core/gather/gatherers/anchor-elements.d.ts +4 -4
- package/core/gather/gatherers/anchor-elements.js +4 -4
- package/core/gather/gatherers/bf-cache-failures.d.ts +8 -14
- package/core/gather/gatherers/bf-cache-failures.js +5 -14
- package/core/gather/gatherers/cache-contents.d.ts +4 -4
- package/core/gather/gatherers/cache-contents.js +3 -3
- package/core/gather/gatherers/console-messages.d.ts +6 -6
- package/core/gather/gatherers/console-messages.js +4 -4
- package/core/gather/gatherers/css-usage.d.ts +14 -14
- package/core/gather/gatherers/css-usage.js +9 -9
- package/core/gather/gatherers/devtools-log-compat.d.ts +5 -5
- package/core/gather/gatherers/devtools-log-compat.js +4 -4
- package/core/gather/gatherers/devtools-log.d.ts +6 -6
- package/core/gather/gatherers/devtools-log.js +4 -4
- package/core/gather/gatherers/dobetterweb/doctype.d.ts +4 -4
- package/core/gather/gatherers/dobetterweb/doctype.js +3 -3
- package/core/gather/gatherers/dobetterweb/domstats.d.ts +4 -4
- package/core/gather/gatherers/dobetterweb/domstats.js +3 -3
- package/core/gather/gatherers/dobetterweb/optimized-images.d.ts +10 -22
- package/core/gather/gatherers/dobetterweb/optimized-images.js +10 -27
- package/core/gather/gatherers/dobetterweb/response-compression.d.ts +6 -12
- package/core/gather/gatherers/dobetterweb/response-compression.js +14 -21
- package/core/gather/gatherers/dobetterweb/tags-blocking-first-paint.d.ts +8 -14
- package/core/gather/gatherers/dobetterweb/tags-blocking-first-paint.js +5 -14
- package/core/gather/gatherers/full-page-screenshot.d.ts +10 -10
- package/core/gather/gatherers/full-page-screenshot.js +7 -10
- package/core/gather/gatherers/global-listeners.d.ts +4 -4
- package/core/gather/gatherers/global-listeners.js +3 -3
- package/core/gather/gatherers/iframe-elements.d.ts +4 -4
- package/core/gather/gatherers/iframe-elements.js +3 -3
- package/core/gather/gatherers/image-elements.d.ts +10 -10
- package/core/gather/gatherers/image-elements.js +6 -6
- package/core/gather/gatherers/inputs.d.ts +4 -4
- package/core/gather/gatherers/inputs.js +3 -3
- package/core/gather/gatherers/inspector-issues.d.ts +8 -19
- package/core/gather/gatherers/inspector-issues.js +9 -26
- package/core/gather/gatherers/installability-errors.d.ts +6 -6
- package/core/gather/gatherers/installability-errors.js +4 -4
- package/core/gather/gatherers/js-usage.d.ts +6 -6
- package/core/gather/gatherers/js-usage.js +4 -4
- package/core/gather/gatherers/link-elements.d.ts +8 -20
- package/core/gather/gatherers/link-elements.js +7 -24
- package/core/gather/gatherers/main-document-content.d.ts +4 -16
- package/core/gather/gatherers/main-document-content.js +5 -23
- package/core/gather/gatherers/meta-elements.d.ts +4 -4
- package/core/gather/gatherers/meta-elements.js +3 -3
- package/core/gather/gatherers/network-user-agent.d.ts +5 -5
- package/core/gather/gatherers/network-user-agent.js +4 -4
- package/core/gather/gatherers/script-elements.d.ts +6 -11
- package/core/gather/gatherers/script-elements.js +4 -13
- package/core/gather/gatherers/scripts.d.ts +7 -6
- package/core/gather/gatherers/scripts.js +7 -9
- package/core/gather/gatherers/seo/embedded-content.d.ts +4 -4
- package/core/gather/gatherers/seo/embedded-content.js +3 -3
- package/core/gather/gatherers/seo/font-size.d.ts +6 -6
- package/core/gather/gatherers/seo/font-size.js +5 -5
- package/core/gather/gatherers/seo/robots-txt.d.ts +4 -4
- package/core/gather/gatherers/seo/robots-txt.js +3 -3
- package/core/gather/gatherers/seo/tap-targets.d.ts +8 -8
- package/core/gather/gatherers/seo/tap-targets.js +5 -5
- package/core/gather/gatherers/service-worker.d.ts +4 -10
- package/core/gather/gatherers/service-worker.js +3 -15
- package/core/gather/gatherers/source-maps.d.ts +11 -23
- package/core/gather/gatherers/source-maps.js +22 -53
- package/core/gather/gatherers/stacks.d.ts +7 -7
- package/core/gather/gatherers/stacks.js +6 -6
- package/core/gather/gatherers/trace-compat.d.ts +5 -5
- package/core/gather/gatherers/trace-compat.js +4 -4
- package/core/gather/gatherers/trace-elements.d.ts +13 -25
- package/core/gather/gatherers/trace-elements.js +19 -32
- package/core/gather/gatherers/trace.d.ts +8 -8
- package/core/gather/gatherers/trace.js +5 -5
- package/core/gather/gatherers/viewport-dimensions.d.ts +4 -4
- package/core/gather/gatherers/viewport-dimensions.js +3 -3
- package/core/gather/gatherers/web-app-manifest.d.ts +8 -8
- package/core/gather/gatherers/web-app-manifest.js +5 -5
- package/core/gather/navigation-runner.d.ts +9 -9
- package/core/gather/navigation-runner.js +14 -8
- package/core/gather/runner-helpers.d.ts +3 -3
- package/core/gather/runner-helpers.js +12 -4
- package/core/gather/session.d.ts +2 -2
- package/core/gather/session.js +1 -1
- package/core/gather/snapshot-runner.d.ts +2 -2
- package/core/gather/snapshot-runner.js +1 -1
- package/core/gather/timespan-runner.d.ts +2 -2
- package/core/gather/timespan-runner.js +1 -1
- package/core/index.cjs +0 -7
- package/core/index.d.ts +0 -15
- package/core/index.js +2 -40
- package/core/lib/asset-saver.js +14 -4
- package/core/lib/axe.js +1 -1
- package/core/lib/dependency-graph/simulator/network-analyzer.d.ts +28 -12
- package/core/lib/dependency-graph/simulator/network-analyzer.js +128 -100
- package/core/lib/emulation.d.ts +14 -14
- package/core/lib/emulation.js +7 -7
- package/core/lib/navigation-error.js +5 -0
- package/core/lib/network-recorder.d.ts +2 -1
- package/core/lib/network-recorder.js +1 -0
- package/core/lib/network-request.js +12 -3
- package/core/lib/page-functions.d.ts +10 -2
- package/core/lib/page-functions.js +85 -8
- package/core/lib/sentry.js +9 -2
- package/core/lib/stack-packs.js +4 -0
- package/core/runner.d.ts +8 -30
- package/core/runner.js +8 -39
- package/core/user-flow.d.ts +4 -4
- package/core/user-flow.js +2 -2
- package/dist/report/bundle.esm.js +2221 -5832
- package/dist/report/flow.js +2631 -235
- package/dist/report/standalone.js +2586 -234
- package/flow-report/src/i18n/i18n.d.ts +2 -2
- package/package.json +17 -24
- package/readme.md +3 -1
- package/report/assets/templates.html +3 -1
- package/report/renderer/category-renderer.d.ts +3 -2
- package/report/renderer/category-renderer.js +8 -4
- package/report/renderer/components.js +11 -5
- package/report/renderer/pwa-category-renderer.js +1 -1
- package/report/renderer/report-ui-features.js +9 -6
- package/report/renderer/report-utils.d.ts +1 -1
- package/report/renderer/report-utils.js +2 -2
- package/report/renderer/topbar-features.js +3 -0
- package/shared/localization/locales/ar-XB.json +185 -44
- package/shared/localization/locales/ar.json +185 -44
- package/shared/localization/locales/bg.json +185 -44
- package/shared/localization/locales/ca.json +190 -49
- package/shared/localization/locales/cs.json +185 -44
- package/shared/localization/locales/da.json +185 -44
- package/shared/localization/locales/de.json +185 -44
- package/shared/localization/locales/el.json +185 -44
- package/shared/localization/locales/en-GB.json +185 -44
- package/shared/localization/locales/en-US.json +99 -45
- package/shared/localization/locales/en-XA.json +185 -44
- package/shared/localization/locales/en-XL.json +99 -45
- package/shared/localization/locales/es-419.json +185 -44
- package/shared/localization/locales/es.json +185 -44
- package/shared/localization/locales/fi.json +185 -44
- package/shared/localization/locales/fil.json +185 -44
- package/shared/localization/locales/fr.json +185 -44
- package/shared/localization/locales/he.json +186 -45
- package/shared/localization/locales/hi.json +185 -44
- package/shared/localization/locales/hr.json +185 -44
- package/shared/localization/locales/hu.json +185 -44
- package/shared/localization/locales/id.json +185 -44
- package/shared/localization/locales/it.json +185 -44
- package/shared/localization/locales/ja.json +185 -44
- package/shared/localization/locales/ko.json +185 -44
- package/shared/localization/locales/lt.json +185 -44
- package/shared/localization/locales/lv.json +185 -44
- package/shared/localization/locales/nl.json +185 -44
- package/shared/localization/locales/no.json +185 -44
- package/shared/localization/locales/pl.json +185 -44
- package/shared/localization/locales/pt-PT.json +185 -44
- package/shared/localization/locales/pt.json +190 -49
- package/shared/localization/locales/ro.json +185 -44
- package/shared/localization/locales/ru.json +185 -44
- package/shared/localization/locales/sk.json +185 -44
- package/shared/localization/locales/sl.json +185 -44
- package/shared/localization/locales/sr-Latn.json +185 -44
- package/shared/localization/locales/sr.json +185 -44
- package/shared/localization/locales/sv.json +185 -44
- package/shared/localization/locales/ta.json +185 -44
- package/shared/localization/locales/te.json +185 -44
- package/shared/localization/locales/th.json +185 -44
- package/shared/localization/locales/tr.json +185 -44
- package/shared/localization/locales/uk.json +185 -44
- package/shared/localization/locales/vi.json +185 -44
- package/shared/localization/locales/zh-HK.json +185 -44
- package/shared/localization/locales/zh-TW.json +185 -44
- package/shared/localization/locales/zh.json +185 -44
- package/third-party/esbuild-plugins-polyfills/LICENSE +3 -0
- package/third-party/esbuild-plugins-polyfills/README.md +7 -0
- package/third-party/esbuild-plugins-polyfills/esbuild-polyfills.d.ts +9 -0
- package/third-party/esbuild-plugins-polyfills/esbuild-polyfills.js +129 -0
- package/tsconfig.json +2 -1
- package/types/artifacts.d.ts +16 -45
- package/types/config.d.ts +10 -52
- package/types/externs.d.ts +0 -2
- package/types/gatherer.d.ts +24 -47
- package/types/internal/rxjs.d.ts +26 -0
- package/types/internal/smokehouse.d.ts +1 -3
- package/types/lh.d.ts +0 -2
- package/types/lhr/settings.d.ts +1 -1
- package/core/audits/metrics/first-contentful-paint-3g.d.ts +0 -15
- package/core/audits/metrics/first-contentful-paint-3g.js +0 -69
- package/core/audits/resource-summary.d.ts +0 -16
- package/core/audits/resource-summary.js +0 -104
- package/core/audits/service-worker.d.ts +0 -46
- package/core/audits/service-worker.js +0 -182
- package/core/gather/gatherers/gatherer.d.ts +0 -46
- package/core/gather/gatherers/gatherer.js +0 -58
- package/core/legacy/config/config.d.ts +0 -107
- package/core/legacy/config/config.js +0 -566
- package/core/legacy/config/legacy-default-config.d.ts +0 -4
- package/core/legacy/config/legacy-default-config.js +0 -87
- package/core/legacy/gather/connections/connection.d.ts +0 -77
- package/core/legacy/gather/connections/connection.js +0 -196
- package/core/legacy/gather/connections/cri.d.ts +0 -27
- package/core/legacy/gather/connections/cri.js +0 -162
- package/core/legacy/gather/connections/raw.d.ts +0 -20
- package/core/legacy/gather/connections/raw.js +0 -57
- package/core/legacy/gather/driver.d.ts +0 -216
- package/core/legacy/gather/driver.js +0 -480
- package/core/legacy/gather/gather-runner.d.ts +0 -166
- package/core/legacy/gather/gather-runner.js +0 -590
- package/types/internal/lighthouse-logger.d.ts +0 -34
|
@@ -1,244 +1,2596 @@
|
|
|
1
|
-
!
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
1
|
+
"use strict";(()=>{var D="\u2026",he="\xA0";var ue={PASS:{label:"pass",minScore:.9},AVERAGE:{label:"average",minScore:.5},FAIL:{label:"fail"},ERROR:{label:"error"}},ge=["com","co","gov","edu","ac","org","go","gob","or","net","in","ne","nic","gouv","web","spb","blog","jus","kiev","mil","wi","qc","ca","bel","on"],k=class o{static get RATINGS(){return ue}static get PASS_THRESHOLD(){return .9}static get MS_DISPLAY_VALUE(){return`%10d${he}ms`}static getFinalDisplayedUrl(e){if(e.finalDisplayedUrl)return e.finalDisplayedUrl;if(e.finalUrl)return e.finalUrl;throw new Error("Could not determine final displayed URL")}static getMainDocumentUrl(e){return e.mainDocumentUrl||e.finalUrl}static getFullPageScreenshot(e){return e.fullPageScreenshot?e.fullPageScreenshot:e.audits["full-page-screenshot"]?.details}static splitMarkdownCodeSpans(e){let t=[],n=e.split(/`(.*?)`/g);for(let r=0;r<n.length;r++){let i=n[r];if(!i)continue;let a=r%2!==0;t.push({isCode:a,text:i})}return t}static splitMarkdownLink(e){let t=[],n=e.split(/\[([^\]]+?)\]\((https?:\/\/.*?)\)/g);for(;n.length;){let[r,i,a]=n.splice(0,3);r&&t.push({isLink:!1,text:r}),i&&a&&t.push({isLink:!0,text:i,linkHref:a})}return t}static truncate(e,t,n="\u2026"){if(e.length<=t)return e;let i=new Intl.Segmenter(void 0,{granularity:"grapheme"}).segment(e)[Symbol.iterator](),a=0;for(let l=0;l<=t-n.length;l++){let s=i.next();if(s.done)return e;a=s.value.index}for(let l=0;l<n.length;l++)if(i.next().done)return e;return e.slice(0,a)+n}static getURLDisplayName(e,t){t=t||{numPathParts:void 0,preserveQuery:void 0,preserveHost:void 0};let n=t.numPathParts!==void 0?t.numPathParts:2,r=t.preserveQuery!==void 0?t.preserveQuery:!0,i=t.preserveHost||!1,a;if(e.protocol==="about:"||e.protocol==="data:")a=e.href;else{a=e.pathname;let s=a.split("/").filter(c=>c.length);n&&s.length>n&&(a=D+s.slice(-1*n).join("/")),i&&(a=`${e.host}/${a.replace(/^\//,"")}`),r&&(a=`${a}${e.search}`)}let l=64;if(e.protocol!=="data:"&&(a=a.slice(0,200),a=a.replace(/([a-f0-9]{7})[a-f0-9]{13}[a-f0-9]*/g,`$1${D}`),a=a.replace(/([a-zA-Z0-9-_]{9})(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])[a-zA-Z0-9-_]{10,}/g,`$1${D}`),a=a.replace(/(\d{3})\d{6,}/g,`$1${D}`),a=a.replace(/\u2026+/g,D),a.length>l&&a.includes("?")&&(a=a.replace(/\?([^=]*)(=)?.*/,`?$1$2${D}`),a.length>l&&(a=a.replace(/\?.*/,`?${D}`)))),a.length>l){let s=a.lastIndexOf(".");s>=0?a=a.slice(0,l-1-(a.length-s))+`${D}${a.slice(s)}`:a=a.slice(0,l-1)+D}return a}static getChromeExtensionOrigin(e){let t=new URL(e);return t.protocol+"//"+t.host}static parseURL(e){let t=new URL(e);return{file:o.getURLDisplayName(t),hostname:t.hostname,origin:t.protocol==="chrome-extension:"?o.getChromeExtensionOrigin(e):t.origin}}static createOrReturnURL(e){return e instanceof URL?e:new URL(e)}static getTld(e){let t=e.split(".").slice(-2);return ge.includes(t[0])?`.${t.join(".")}`:`.${t[t.length-1]}`}static getRootDomain(e){let t=o.createOrReturnURL(e).hostname,r=o.getTld(t).split(".");return t.split(".").slice(-r.length).join(".")}static filterRelevantLines(e,t,n){if(t.length===0)return e.slice(0,n*2+1);let r=3,i=new Set;return t=t.sort((a,l)=>(a.lineNumber||0)-(l.lineNumber||0)),t.forEach(({lineNumber:a})=>{let l=a-n,s=a+n;for(;l<1;)l++,s++;i.has(l-r-1)&&(l-=r);for(let c=l;c<=s;c++){let d=c;i.add(d)}}),e.filter(a=>i.has(a.lineNumber))}};function me(o){let e=o.createFragment(),t=o.createElement("style");t.append(`
|
|
2
|
+
.lh-3p-filter {
|
|
3
|
+
color: var(--color-gray-600);
|
|
4
|
+
float: right;
|
|
5
|
+
padding: 6px var(--stackpack-padding-horizontal);
|
|
6
|
+
}
|
|
7
|
+
.lh-3p-filter-label, .lh-3p-filter-input {
|
|
8
|
+
vertical-align: middle;
|
|
9
|
+
user-select: none;
|
|
10
|
+
}
|
|
11
|
+
.lh-3p-filter-input:disabled + .lh-3p-ui-string {
|
|
12
|
+
text-decoration: line-through;
|
|
13
|
+
}
|
|
14
|
+
`),e.append(t);let n=o.createElement("div","lh-3p-filter"),r=o.createElement("label","lh-3p-filter-label"),i=o.createElement("input","lh-3p-filter-input");i.setAttribute("type","checkbox"),i.setAttribute("checked","");let a=o.createElement("span","lh-3p-ui-string");a.append("Show 3rd party resources");let l=o.createElement("span","lh-3p-filter-count");return r.append(" ",i," ",a," (",l,") "),n.append(" ",r," "),e.append(n),e}function fe(o){let e=o.createFragment(),t=o.createElement("div","lh-audit"),n=o.createElement("details","lh-expandable-details"),r=o.createElement("summary"),i=o.createElement("div","lh-audit__header lh-expandable-details__summary"),a=o.createElement("span","lh-audit__score-icon"),l=o.createElement("span","lh-audit__title-and-text"),s=o.createElement("span","lh-audit__title"),c=o.createElement("span","lh-audit__display-text");l.append(" ",s," ",c," ");let d=o.createElement("div","lh-chevron-container");i.append(" ",a," ",l," ",d," "),r.append(" ",i," ");let p=o.createElement("div","lh-audit__description"),h=o.createElement("div","lh-audit__stackpacks");return n.append(" ",r," ",p," ",h," "),t.append(" ",n," "),e.append(t),e}function be(o){let e=o.createFragment(),t=o.createElement("div","lh-category-header"),n=o.createElement("div","lh-score__gauge");n.setAttribute("role","heading"),n.setAttribute("aria-level","2");let r=o.createElement("div","lh-category-header__description");return t.append(" ",n," ",r," "),e.append(t),e}function ve(o){let e=o.createFragment(),t=o.createElementNS("http://www.w3.org/2000/svg","svg","lh-chevron");t.setAttribute("viewBox","0 0 100 100");let n=o.createElementNS("http://www.w3.org/2000/svg","g","lh-chevron__lines"),r=o.createElementNS("http://www.w3.org/2000/svg","path","lh-chevron__line lh-chevron__line-left");r.setAttribute("d","M10 50h40");let i=o.createElementNS("http://www.w3.org/2000/svg","path","lh-chevron__line lh-chevron__line-right");return i.setAttribute("d","M90 50H50"),n.append(" ",r," ",i," "),t.append(" ",n," "),e.append(t),e}function _e(o){let e=o.createFragment(),t=o.createElement("div","lh-audit-group"),n=o.createElement("details","lh-clump"),r=o.createElement("summary"),i=o.createElement("div","lh-audit-group__summary"),a=o.createElement("div","lh-audit-group__header"),l=o.createElement("span","lh-audit-group__title"),s=o.createElement("span","lh-audit-group__itemcount");a.append(" ",l," ",s," "," "," ");let c=o.createElement("div","lh-clump-toggle"),d=o.createElement("span","lh-clump-toggletext--show"),p=o.createElement("span","lh-clump-toggletext--hide");return c.append(" ",d," ",p," "),i.append(" ",a," ",c," "),r.append(" ",i," "),n.append(" ",r," "),t.append(" "," ",n," "),e.append(t),e}function we(o){let e=o.createFragment(),t=o.createElement("div","lh-crc-container"),n=o.createElement("style");n.append(`
|
|
15
|
+
.lh-crc .lh-tree-marker {
|
|
16
|
+
width: 12px;
|
|
17
|
+
height: 26px;
|
|
18
|
+
display: block;
|
|
19
|
+
float: left;
|
|
20
|
+
background-position: top left;
|
|
21
|
+
}
|
|
22
|
+
.lh-crc .lh-horiz-down {
|
|
23
|
+
background: url('data:image/svg+xml;utf8,<svg width="16" height="26" viewBox="0 0 16 26" xmlns="http://www.w3.org/2000/svg"><g fill="%23D8D8D8" fill-rule="evenodd"><path d="M16 12v2H-2v-2z"/><path d="M9 12v14H7V12z"/></g></svg>');
|
|
24
|
+
}
|
|
25
|
+
.lh-crc .lh-right {
|
|
26
|
+
background: url('data:image/svg+xml;utf8,<svg width="16" height="26" viewBox="0 0 16 26" xmlns="http://www.w3.org/2000/svg"><path d="M16 12v2H0v-2z" fill="%23D8D8D8" fill-rule="evenodd"/></svg>');
|
|
27
|
+
}
|
|
28
|
+
.lh-crc .lh-up-right {
|
|
29
|
+
background: url('data:image/svg+xml;utf8,<svg width="16" height="26" viewBox="0 0 16 26" xmlns="http://www.w3.org/2000/svg"><path d="M7 0h2v14H7zm2 12h7v2H9z" fill="%23D8D8D8" fill-rule="evenodd"/></svg>');
|
|
30
|
+
}
|
|
31
|
+
.lh-crc .lh-vert-right {
|
|
32
|
+
background: url('data:image/svg+xml;utf8,<svg width="16" height="26" viewBox="0 0 16 26" xmlns="http://www.w3.org/2000/svg"><path d="M7 0h2v27H7zm2 12h7v2H9z" fill="%23D8D8D8" fill-rule="evenodd"/></svg>');
|
|
33
|
+
}
|
|
34
|
+
.lh-crc .lh-vert {
|
|
35
|
+
background: url('data:image/svg+xml;utf8,<svg width="16" height="26" viewBox="0 0 16 26" xmlns="http://www.w3.org/2000/svg"><path d="M7 0h2v26H7z" fill="%23D8D8D8" fill-rule="evenodd"/></svg>');
|
|
36
|
+
}
|
|
37
|
+
.lh-crc .lh-crc-tree {
|
|
38
|
+
font-size: 14px;
|
|
39
|
+
width: 100%;
|
|
40
|
+
overflow-x: auto;
|
|
41
|
+
}
|
|
42
|
+
.lh-crc .lh-crc-node {
|
|
43
|
+
height: 26px;
|
|
44
|
+
line-height: 26px;
|
|
45
|
+
white-space: nowrap;
|
|
46
|
+
}
|
|
47
|
+
.lh-crc .lh-crc-node__tree-value {
|
|
48
|
+
margin-left: 10px;
|
|
49
|
+
}
|
|
50
|
+
.lh-crc .lh-crc-node__tree-value div {
|
|
51
|
+
display: inline;
|
|
52
|
+
}
|
|
53
|
+
.lh-crc .lh-crc-node__chain-duration {
|
|
54
|
+
font-weight: 700;
|
|
55
|
+
}
|
|
56
|
+
.lh-crc .lh-crc-initial-nav {
|
|
57
|
+
color: #595959;
|
|
58
|
+
font-style: italic;
|
|
59
|
+
}
|
|
60
|
+
.lh-crc__summary-value {
|
|
61
|
+
margin-bottom: 10px;
|
|
62
|
+
}
|
|
63
|
+
`);let r=o.createElement("div"),i=o.createElement("div","lh-crc__summary-value"),a=o.createElement("span","lh-crc__longest_duration_label"),l=o.createElement("b","lh-crc__longest_duration");i.append(" ",a," ",l," "),r.append(" ",i," ");let s=o.createElement("div","lh-crc"),c=o.createElement("div","lh-crc-initial-nav");return s.append(" ",c," "," "),t.append(" ",n," ",r," ",s," "),e.append(t),e}function ye(o){let e=o.createFragment(),t=o.createElement("div","lh-crc-node"),n=o.createElement("span","lh-crc-node__tree-marker"),r=o.createElement("span","lh-crc-node__tree-value");return t.append(" ",n," ",r," "),e.append(t),e}function xe(o){let e=o.createFragment(),t=o.createElement("div","lh-element-screenshot"),n=o.createElement("div","lh-element-screenshot__content"),r=o.createElement("div","lh-element-screenshot__image"),i=o.createElement("div","lh-element-screenshot__mask"),a=o.createElementNS("http://www.w3.org/2000/svg","svg");a.setAttribute("height","0"),a.setAttribute("width","0");let l=o.createElementNS("http://www.w3.org/2000/svg","defs"),s=o.createElementNS("http://www.w3.org/2000/svg","clipPath");s.setAttribute("clipPathUnits","objectBoundingBox"),l.append(" ",s," "," "),a.append(" ",l," "),i.append(" ",a," ");let c=o.createElement("div","lh-element-screenshot__element-marker");return r.append(" ",i," ",c," "),n.append(" ",r," "),t.append(" ",n," "),e.append(t),e}function Ee(o){let e=o.createFragment(),t=o.createElement("style");t.append(`
|
|
64
|
+
.lh-footer {
|
|
65
|
+
padding: var(--footer-padding-vertical) calc(var(--default-padding) * 2);
|
|
66
|
+
max-width: var(--report-content-max-width);
|
|
67
|
+
margin: 0 auto;
|
|
68
|
+
}
|
|
69
|
+
.lh-footer .lh-generated {
|
|
70
|
+
text-align: center;
|
|
71
|
+
}
|
|
72
|
+
`),e.append(t);let n=o.createElement("footer","lh-footer"),r=o.createElement("ul","lh-meta__items");r.append(" ");let i=o.createElement("div","lh-generated"),a=o.createElement("b");a.append("Lighthouse");let l=o.createElement("span","lh-footer__version"),s=o.createElement("a","lh-footer__version_issue");return s.setAttribute("href","https://github.com/GoogleChrome/Lighthouse/issues"),s.setAttribute("target","_blank"),s.setAttribute("rel","noopener"),s.append("File an issue"),i.append(" "," Generated by ",a," ",l," | ",s," "),n.append(" ",r," ",i," "),e.append(n),e}function ke(o){let e=o.createFragment(),t=o.createElement("a","lh-fraction__wrapper"),n=o.createElement("div","lh-fraction__content-wrapper"),r=o.createElement("div","lh-fraction__content"),i=o.createElement("div","lh-fraction__background");r.append(" ",i," "),n.append(" ",r," ");let a=o.createElement("div","lh-fraction__label");return t.append(" ",n," ",a," "),e.append(t),e}function Ae(o){let e=o.createFragment(),t=o.createElement("a","lh-gauge__wrapper"),n=o.createElement("div","lh-gauge__svg-wrapper"),r=o.createElementNS("http://www.w3.org/2000/svg","svg","lh-gauge");r.setAttribute("viewBox","0 0 120 120");let i=o.createElementNS("http://www.w3.org/2000/svg","circle","lh-gauge-base");i.setAttribute("r","56"),i.setAttribute("cx","60"),i.setAttribute("cy","60"),i.setAttribute("stroke-width","8");let a=o.createElementNS("http://www.w3.org/2000/svg","circle","lh-gauge-arc");a.setAttribute("r","56"),a.setAttribute("cx","60"),a.setAttribute("cy","60"),a.setAttribute("stroke-width","8"),r.append(" ",i," ",a," "),n.append(" ",r," ");let l=o.createElement("div","lh-gauge__percentage"),s=o.createElement("div","lh-gauge__label");return t.append(" "," ",n," ",l," "," ",s," "),e.append(t),e}function Se(o){let e=o.createFragment(),t=o.createElement("style");t.append(`
|
|
73
|
+
.lh-gauge--pwa .lh-gauge--pwa__component {
|
|
74
|
+
display: none;
|
|
75
|
+
}
|
|
76
|
+
.lh-gauge--pwa__wrapper:not(.lh-badged--all) .lh-gauge--pwa__logo > path {
|
|
77
|
+
/* Gray logo unless everything is passing. */
|
|
78
|
+
fill: #B0B0B0;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.lh-gauge--pwa__disc {
|
|
82
|
+
fill: var(--color-gray-200);
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.lh-gauge--pwa__logo--primary-color {
|
|
86
|
+
fill: #304FFE;
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
.lh-gauge--pwa__logo--secondary-color {
|
|
90
|
+
fill: #3D3D3D;
|
|
91
|
+
}
|
|
92
|
+
.lh-dark .lh-gauge--pwa__logo--secondary-color {
|
|
93
|
+
fill: #D8B6B6;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
/* No passing groups. */
|
|
97
|
+
.lh-gauge--pwa__wrapper:not([class*='lh-badged--']) .lh-gauge--pwa__na-line {
|
|
98
|
+
display: inline;
|
|
99
|
+
}
|
|
100
|
+
/* Just optimized. Same n/a line as no passing groups. */
|
|
101
|
+
.lh-gauge--pwa__wrapper.lh-badged--pwa-optimized:not(.lh-badged--pwa-installable) .lh-gauge--pwa__na-line {
|
|
102
|
+
display: inline;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
/* Just installable. */
|
|
106
|
+
.lh-gauge--pwa__wrapper.lh-badged--pwa-installable .lh-gauge--pwa__installable-badge {
|
|
107
|
+
display: inline;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
/* All passing groups. */
|
|
111
|
+
.lh-gauge--pwa__wrapper.lh-badged--all .lh-gauge--pwa__check-circle {
|
|
112
|
+
display: inline;
|
|
113
|
+
}
|
|
114
|
+
`),e.append(t);let n=o.createElement("a","lh-gauge__wrapper lh-gauge--pwa__wrapper"),r=o.createElementNS("http://www.w3.org/2000/svg","svg","lh-gauge lh-gauge--pwa");r.setAttribute("viewBox","0 0 60 60");let i=o.createElementNS("http://www.w3.org/2000/svg","defs"),a=o.createElementNS("http://www.w3.org/2000/svg","linearGradient");a.setAttribute("id","lh-gauge--pwa__check-circle__gradient"),a.setAttribute("x1","50%"),a.setAttribute("y1","0%"),a.setAttribute("x2","50%"),a.setAttribute("y2","100%");let l=o.createElementNS("http://www.w3.org/2000/svg","stop");l.setAttribute("stop-color","#00C852"),l.setAttribute("offset","0%");let s=o.createElementNS("http://www.w3.org/2000/svg","stop");s.setAttribute("stop-color","#009688"),s.setAttribute("offset","100%"),a.append(" ",l," ",s," ");let c=o.createElementNS("http://www.w3.org/2000/svg","linearGradient");c.setAttribute("id","lh-gauge--pwa__installable__shadow-gradient"),c.setAttribute("x1","76.056%"),c.setAttribute("x2","24.111%"),c.setAttribute("y1","82.995%"),c.setAttribute("y2","24.735%");let d=o.createElementNS("http://www.w3.org/2000/svg","stop");d.setAttribute("stop-color","#A5D6A7"),d.setAttribute("offset","0%");let p=o.createElementNS("http://www.w3.org/2000/svg","stop");p.setAttribute("stop-color","#80CBC4"),p.setAttribute("offset","100%"),c.append(" ",d," ",p," ");let h=o.createElementNS("http://www.w3.org/2000/svg","g");h.setAttribute("id","lh-gauge--pwa__installable-badge");let u=o.createElementNS("http://www.w3.org/2000/svg","circle");u.setAttribute("fill","#FFFFFF"),u.setAttribute("cx","10"),u.setAttribute("cy","10"),u.setAttribute("r","10");let f=o.createElementNS("http://www.w3.org/2000/svg","path");f.setAttribute("fill","#009688"),f.setAttribute("d","M10 4.167A5.835 5.835 0 0 0 4.167 10 5.835 5.835 0 0 0 10 15.833 5.835 5.835 0 0 0 15.833 10 5.835 5.835 0 0 0 10 4.167zm2.917 6.416h-2.334v2.334H9.417v-2.334H7.083V9.417h2.334V7.083h1.166v2.334h2.334v1.166z"),h.append(" ",u," ",f," "),i.append(" ",a," ",c," ",h," ");let b=o.createElementNS("http://www.w3.org/2000/svg","g");b.setAttribute("stroke","none"),b.setAttribute("fill-rule","nonzero");let _=o.createElementNS("http://www.w3.org/2000/svg","circle","lh-gauge--pwa__disc");_.setAttribute("cx","30"),_.setAttribute("cy","30"),_.setAttribute("r","30");let m=o.createElementNS("http://www.w3.org/2000/svg","g","lh-gauge--pwa__logo"),w=o.createElementNS("http://www.w3.org/2000/svg","path","lh-gauge--pwa__logo--secondary-color");w.setAttribute("d","M35.66 19.39l.7-1.75h2L37.4 15 38.6 12l3.4 9h-2.51l-.58-1.61z");let v=o.createElementNS("http://www.w3.org/2000/svg","path","lh-gauge--pwa__logo--primary-color");v.setAttribute("d","M33.52 21l3.65-9h-2.42l-2.5 5.82L30.5 12h-1.86l-1.9 5.82-1.35-2.65-1.21 3.72L25.4 21h2.38l1.72-5.2 1.64 5.2z");let x=o.createElementNS("http://www.w3.org/2000/svg","path","lh-gauge--pwa__logo--secondary-color");x.setAttribute("fill-rule","nonzero"),x.setAttribute("d","M20.3 17.91h1.48c.45 0 .85-.05 1.2-.15l.39-1.18 1.07-3.3a2.64 2.64 0 0 0-.28-.37c-.55-.6-1.36-.91-2.42-.91H18v9h2.3V17.9zm1.96-3.84c.22.22.33.5.33.87 0 .36-.1.65-.29.87-.2.23-.59.35-1.15.35h-.86v-2.41h.87c.52 0 .89.1 1.1.32z"),m.append(" ",w," ",v," ",x," ");let E=o.createElementNS("http://www.w3.org/2000/svg","rect","lh-gauge--pwa__component lh-gauge--pwa__na-line");E.setAttribute("fill","#FFFFFF"),E.setAttribute("x","20"),E.setAttribute("y","32"),E.setAttribute("width","20"),E.setAttribute("height","4"),E.setAttribute("rx","2");let A=o.createElementNS("http://www.w3.org/2000/svg","g","lh-gauge--pwa__component lh-gauge--pwa__installable-badge");A.setAttribute("transform","translate(20, 29)");let C=o.createElementNS("http://www.w3.org/2000/svg","path");C.setAttribute("fill","url(#lh-gauge--pwa__installable__shadow-gradient)"),C.setAttribute("d","M33.629 19.487c-4.272 5.453-10.391 9.39-17.415 10.869L3 17.142 17.142 3 33.63 19.487z");let L=o.createElementNS("http://www.w3.org/2000/svg","use");L.setAttribute("href","#lh-gauge--pwa__installable-badge"),A.append(" ",C," ",L," ");let S=o.createElementNS("http://www.w3.org/2000/svg","g","lh-gauge--pwa__component lh-gauge--pwa__check-circle");S.setAttribute("transform","translate(18, 28)");let z=o.createElementNS("http://www.w3.org/2000/svg","circle");z.setAttribute("fill","#FFFFFF"),z.setAttribute("cx","12"),z.setAttribute("cy","12"),z.setAttribute("r","12");let M=o.createElementNS("http://www.w3.org/2000/svg","path");M.setAttribute("fill","url(#lh-gauge--pwa__check-circle__gradient)"),M.setAttribute("d","M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"),S.append(" ",z," ",M," "),b.append(" "," ",_," ",m," "," ",E," "," ",A," "," ",S," "),r.append(" ",i," ",b," ");let T=o.createElement("div","lh-gauge__label");return n.append(" ",r," ",T," "),e.append(n),e}function Ce(o){let e=o.createFragment(),t=o.createElement("style");t.append(`
|
|
115
|
+
/* CSS Fireworks. Originally by Eddie Lin
|
|
116
|
+
https://codepen.io/paulirish/pen/yEVMbP
|
|
117
|
+
*/
|
|
118
|
+
.lh-pyro {
|
|
119
|
+
display: none;
|
|
120
|
+
z-index: 1;
|
|
121
|
+
pointer-events: none;
|
|
122
|
+
}
|
|
123
|
+
.lh-score100 .lh-pyro {
|
|
124
|
+
display: block;
|
|
125
|
+
}
|
|
126
|
+
.lh-score100 .lh-lighthouse stop:first-child {
|
|
127
|
+
stop-color: hsla(200, 12%, 95%, 0);
|
|
128
|
+
}
|
|
129
|
+
.lh-score100 .lh-lighthouse stop:last-child {
|
|
130
|
+
stop-color: hsla(65, 81%, 76%, 1);
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
.lh-pyro > .lh-pyro-before, .lh-pyro > .lh-pyro-after {
|
|
134
|
+
position: absolute;
|
|
135
|
+
width: 5px;
|
|
136
|
+
height: 5px;
|
|
137
|
+
border-radius: 2.5px;
|
|
138
|
+
box-shadow: 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff;
|
|
139
|
+
animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
|
|
140
|
+
animation-delay: 1s, 1s, 1s;
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
.lh-pyro > .lh-pyro-after {
|
|
144
|
+
animation-delay: 2.25s, 2.25s, 2.25s;
|
|
145
|
+
animation-duration: 1.25s, 1.25s, 6.25s;
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
@keyframes bang {
|
|
149
|
+
to {
|
|
150
|
+
opacity: 1;
|
|
151
|
+
box-shadow: -70px -115.67px #47ebbc, -28px -99.67px #eb47a4, 58px -31.67px #7eeb47, 13px -141.67px #eb47c5, -19px 6.33px #7347eb, -2px -74.67px #ebd247, 24px -151.67px #eb47e0, 57px -138.67px #b4eb47, -51px -104.67px #479eeb, 62px 8.33px #ebcf47, -93px 0.33px #d547eb, -16px -118.67px #47bfeb, 53px -84.67px #47eb83, 66px -57.67px #eb47bf, -93px -65.67px #91eb47, 30px -13.67px #86eb47, -2px -59.67px #83eb47, -44px 1.33px #eb47eb, 61px -58.67px #47eb73, 5px -22.67px #47e8eb, -66px -28.67px #ebe247, 42px -123.67px #eb5547, -75px 26.33px #7beb47, 15px -52.67px #a147eb, 36px -51.67px #eb8347, -38px -12.67px #eb5547, -46px -59.67px #47eb81, 78px -114.67px #eb47ba, 15px -156.67px #eb47bf, -36px 1.33px #eb4783, -72px -86.67px #eba147, 31px -46.67px #ebe247, -68px 29.33px #47e2eb, -55px 19.33px #ebe047, -56px 27.33px #4776eb, -13px -91.67px #eb5547, -47px -138.67px #47ebc7, -18px -96.67px #eb47ac, 11px -88.67px #4783eb, -67px -28.67px #47baeb, 53px 10.33px #ba47eb, 11px 19.33px #5247eb, -5px -11.67px #eb4791, -68px -4.67px #47eba7, 95px -37.67px #eb478b, -67px -162.67px #eb5d47, -54px -120.67px #eb6847, 49px -12.67px #ebe047, 88px 8.33px #47ebda, 97px 33.33px #eb8147, 6px -71.67px #ebbc47;
|
|
152
|
+
}
|
|
153
|
+
}
|
|
154
|
+
@keyframes gravity {
|
|
155
|
+
from {
|
|
156
|
+
opacity: 1;
|
|
157
|
+
}
|
|
158
|
+
to {
|
|
159
|
+
transform: translateY(80px);
|
|
160
|
+
opacity: 0;
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
@keyframes position {
|
|
164
|
+
0%, 19.9% {
|
|
165
|
+
margin-top: 4%;
|
|
166
|
+
margin-left: 47%;
|
|
167
|
+
}
|
|
168
|
+
20%, 39.9% {
|
|
169
|
+
margin-top: 7%;
|
|
170
|
+
margin-left: 30%;
|
|
171
|
+
}
|
|
172
|
+
40%, 59.9% {
|
|
173
|
+
margin-top: 6%;
|
|
174
|
+
margin-left: 70%;
|
|
175
|
+
}
|
|
176
|
+
60%, 79.9% {
|
|
177
|
+
margin-top: 3%;
|
|
178
|
+
margin-left: 20%;
|
|
179
|
+
}
|
|
180
|
+
80%, 99.9% {
|
|
181
|
+
margin-top: 3%;
|
|
182
|
+
margin-left: 80%;
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
`),e.append(t);let n=o.createElement("div","lh-header-container"),r=o.createElement("div","lh-scores-wrapper-placeholder");return n.append(" ",r," "),e.append(n),e}function ze(o){let e=o.createFragment(),t=o.createElement("div","lh-metric"),n=o.createElement("div","lh-metric__innerwrap"),r=o.createElement("div","lh-metric__icon"),i=o.createElement("span","lh-metric__title"),a=o.createElement("div","lh-metric__value"),l=o.createElement("div","lh-metric__description");return n.append(" ",r," ",i," ",a," ",l," "),t.append(" ",n," "),e.append(t),e}function Le(o){let e=o.createFragment(),t=o.createElement("div","lh-audit lh-audit--load-opportunity"),n=o.createElement("details","lh-expandable-details"),r=o.createElement("summary"),i=o.createElement("div","lh-audit__header"),a=o.createElement("div","lh-load-opportunity__cols"),l=o.createElement("div","lh-load-opportunity__col lh-load-opportunity__col--one"),s=o.createElement("span","lh-audit__score-icon"),c=o.createElement("div","lh-audit__title");l.append(" ",s," ",c," ");let d=o.createElement("div","lh-load-opportunity__col lh-load-opportunity__col--two"),p=o.createElement("div","lh-load-opportunity__sparkline"),h=o.createElement("div","lh-sparkline"),u=o.createElement("div","lh-sparkline__bar");h.append(u),p.append(" ",h," ");let f=o.createElement("div","lh-audit__display-text"),b=o.createElement("div","lh-chevron-container");d.append(" ",p," ",f," ",b," "),a.append(" ",l," ",d," "),i.append(" ",a," "),r.append(" ",i," ");let _=o.createElement("div","lh-audit__description"),m=o.createElement("div","lh-audit__stackpacks");return n.append(" ",r," ",_," ",m," "),t.append(" ",n," "),e.append(t),e}function Me(o){let e=o.createFragment(),t=o.createElement("div","lh-load-opportunity__header lh-load-opportunity__cols"),n=o.createElement("div","lh-load-opportunity__col lh-load-opportunity__col--one"),r=o.createElement("div","lh-load-opportunity__col lh-load-opportunity__col--two");return t.append(" ",n," ",r," "),e.append(t),e}function Te(o){let e=o.createFragment(),t=o.createElement("div","lh-scorescale"),n=o.createElement("span","lh-scorescale-range lh-scorescale-range--fail");n.append("0\u201349");let r=o.createElement("span","lh-scorescale-range lh-scorescale-range--average");r.append("50\u201389");let i=o.createElement("span","lh-scorescale-range lh-scorescale-range--pass");return i.append("90\u2013100"),t.append(" ",n," ",r," ",i," "),e.append(t),e}function Fe(o){let e=o.createFragment(),t=o.createElement("style");t.append(`
|
|
186
|
+
.lh-scores-container {
|
|
187
|
+
display: flex;
|
|
188
|
+
flex-direction: column;
|
|
189
|
+
padding: var(--default-padding) 0;
|
|
190
|
+
position: relative;
|
|
191
|
+
width: 100%;
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
.lh-sticky-header {
|
|
195
|
+
--gauge-circle-size: var(--gauge-circle-size-sm);
|
|
196
|
+
--plugin-badge-size: 16px;
|
|
197
|
+
--plugin-icon-size: 75%;
|
|
198
|
+
--gauge-wrapper-width: 60px;
|
|
199
|
+
--gauge-percentage-font-size: 13px;
|
|
200
|
+
position: fixed;
|
|
201
|
+
left: 0;
|
|
202
|
+
right: 0;
|
|
203
|
+
top: var(--topbar-height);
|
|
204
|
+
font-weight: 500;
|
|
205
|
+
display: none;
|
|
206
|
+
justify-content: center;
|
|
207
|
+
background-color: var(--sticky-header-background-color);
|
|
208
|
+
border-bottom: 1px solid var(--color-gray-200);
|
|
209
|
+
padding-top: var(--score-container-padding);
|
|
210
|
+
padding-bottom: 4px;
|
|
211
|
+
z-index: 1;
|
|
212
|
+
pointer-events: none;
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
.lh-devtools .lh-sticky-header {
|
|
216
|
+
/* The report within DevTools is placed in a container with overflow, which changes the placement of this header unless we change \`position\` to \`sticky.\` */
|
|
217
|
+
position: sticky;
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
.lh-sticky-header--visible {
|
|
221
|
+
display: grid;
|
|
222
|
+
grid-auto-flow: column;
|
|
223
|
+
pointer-events: auto;
|
|
224
|
+
}
|
|
225
|
+
|
|
226
|
+
/* Disable the gauge arc animation for the sticky header, so toggling display: none
|
|
227
|
+
does not play the animation. */
|
|
228
|
+
.lh-sticky-header .lh-gauge-arc {
|
|
229
|
+
animation: none;
|
|
230
|
+
}
|
|
231
|
+
|
|
232
|
+
.lh-sticky-header .lh-gauge__label,
|
|
233
|
+
.lh-sticky-header .lh-fraction__label {
|
|
234
|
+
display: none;
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
.lh-highlighter {
|
|
238
|
+
width: var(--gauge-wrapper-width);
|
|
239
|
+
height: 1px;
|
|
240
|
+
background-color: var(--highlighter-background-color);
|
|
241
|
+
/* Position at bottom of first gauge in sticky header. */
|
|
242
|
+
position: absolute;
|
|
243
|
+
grid-column: 1;
|
|
244
|
+
bottom: -1px;
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
.lh-gauge__wrapper:first-of-type {
|
|
248
|
+
contain: none;
|
|
249
|
+
}
|
|
250
|
+
`),e.append(t);let n=o.createElement("div","lh-scores-wrapper"),r=o.createElement("div","lh-scores-container"),i=o.createElement("div","lh-pyro"),a=o.createElement("div","lh-pyro-before"),l=o.createElement("div","lh-pyro-after");return i.append(" ",a," ",l," "),r.append(" ",i," "),n.append(" ",r," "),e.append(n),e}function De(o){let e=o.createFragment(),t=o.createElement("div","lh-snippet"),n=o.createElement("style");return n.append(`
|
|
251
|
+
:root {
|
|
252
|
+
--snippet-highlight-light: #fbf1f2;
|
|
253
|
+
--snippet-highlight-dark: #ffd6d8;
|
|
254
|
+
}
|
|
255
|
+
|
|
256
|
+
.lh-snippet__header {
|
|
257
|
+
position: relative;
|
|
258
|
+
overflow: hidden;
|
|
259
|
+
padding: 10px;
|
|
260
|
+
border-bottom: none;
|
|
261
|
+
color: var(--snippet-color);
|
|
262
|
+
background-color: var(--snippet-background-color);
|
|
263
|
+
border: 1px solid var(--report-border-color-secondary);
|
|
264
|
+
}
|
|
265
|
+
.lh-snippet__title {
|
|
266
|
+
font-weight: bold;
|
|
267
|
+
float: left;
|
|
268
|
+
}
|
|
269
|
+
.lh-snippet__node {
|
|
270
|
+
float: left;
|
|
271
|
+
margin-left: 4px;
|
|
272
|
+
}
|
|
273
|
+
.lh-snippet__toggle-expand {
|
|
274
|
+
padding: 1px 7px;
|
|
275
|
+
margin-top: -1px;
|
|
276
|
+
margin-right: -7px;
|
|
277
|
+
float: right;
|
|
278
|
+
background: transparent;
|
|
279
|
+
border: none;
|
|
280
|
+
cursor: pointer;
|
|
281
|
+
font-size: 14px;
|
|
282
|
+
color: #0c50c7;
|
|
283
|
+
}
|
|
284
|
+
|
|
285
|
+
.lh-snippet__snippet {
|
|
286
|
+
overflow: auto;
|
|
287
|
+
border: 1px solid var(--report-border-color-secondary);
|
|
288
|
+
}
|
|
289
|
+
/* Container needed so that all children grow to the width of the scroll container */
|
|
290
|
+
.lh-snippet__snippet-inner {
|
|
291
|
+
display: inline-block;
|
|
292
|
+
min-width: 100%;
|
|
293
|
+
}
|
|
294
|
+
|
|
295
|
+
.lh-snippet:not(.lh-snippet--expanded) .lh-snippet__show-if-expanded {
|
|
296
|
+
display: none;
|
|
297
|
+
}
|
|
298
|
+
.lh-snippet.lh-snippet--expanded .lh-snippet__show-if-collapsed {
|
|
299
|
+
display: none;
|
|
300
|
+
}
|
|
301
|
+
|
|
302
|
+
.lh-snippet__line {
|
|
303
|
+
background: white;
|
|
304
|
+
white-space: pre;
|
|
305
|
+
display: flex;
|
|
306
|
+
}
|
|
307
|
+
.lh-snippet__line:not(.lh-snippet__line--message):first-child {
|
|
308
|
+
padding-top: 4px;
|
|
309
|
+
}
|
|
310
|
+
.lh-snippet__line:not(.lh-snippet__line--message):last-child {
|
|
311
|
+
padding-bottom: 4px;
|
|
312
|
+
}
|
|
313
|
+
.lh-snippet__line--content-highlighted {
|
|
314
|
+
background: var(--snippet-highlight-dark);
|
|
315
|
+
}
|
|
316
|
+
.lh-snippet__line--message {
|
|
317
|
+
background: var(--snippet-highlight-light);
|
|
318
|
+
}
|
|
319
|
+
.lh-snippet__line--message .lh-snippet__line-number {
|
|
320
|
+
padding-top: 10px;
|
|
321
|
+
padding-bottom: 10px;
|
|
322
|
+
}
|
|
323
|
+
.lh-snippet__line--message code {
|
|
324
|
+
padding: 10px;
|
|
325
|
+
padding-left: 5px;
|
|
326
|
+
color: var(--color-fail);
|
|
327
|
+
font-family: var(--report-font-family);
|
|
328
|
+
}
|
|
329
|
+
.lh-snippet__line--message code {
|
|
330
|
+
white-space: normal;
|
|
331
|
+
}
|
|
332
|
+
.lh-snippet__line-icon {
|
|
333
|
+
padding-top: 10px;
|
|
334
|
+
display: none;
|
|
335
|
+
}
|
|
336
|
+
.lh-snippet__line--message .lh-snippet__line-icon {
|
|
337
|
+
display: block;
|
|
338
|
+
}
|
|
339
|
+
.lh-snippet__line-icon:before {
|
|
340
|
+
content: "";
|
|
341
|
+
display: inline-block;
|
|
342
|
+
vertical-align: middle;
|
|
343
|
+
margin-right: 4px;
|
|
344
|
+
width: var(--score-icon-size);
|
|
345
|
+
height: var(--score-icon-size);
|
|
346
|
+
background-image: var(--fail-icon-url);
|
|
347
|
+
}
|
|
348
|
+
.lh-snippet__line-number {
|
|
349
|
+
flex-shrink: 0;
|
|
350
|
+
width: 40px;
|
|
351
|
+
text-align: right;
|
|
352
|
+
font-family: monospace;
|
|
353
|
+
padding-right: 5px;
|
|
354
|
+
margin-right: 5px;
|
|
355
|
+
color: var(--color-gray-600);
|
|
356
|
+
user-select: none;
|
|
357
|
+
}
|
|
358
|
+
`),t.append(" ",n," "),e.append(t),e}function Ne(o){let e=o.createFragment(),t=o.createElement("div","lh-snippet__snippet"),n=o.createElement("div","lh-snippet__snippet-inner");return t.append(" ",n," "),e.append(t),e}function Re(o){let e=o.createFragment(),t=o.createElement("div","lh-snippet__header"),n=o.createElement("div","lh-snippet__title"),r=o.createElement("div","lh-snippet__node"),i=o.createElement("button","lh-snippet__toggle-expand"),a=o.createElement("span","lh-snippet__btn-label-collapse lh-snippet__show-if-expanded"),l=o.createElement("span","lh-snippet__btn-label-expand lh-snippet__show-if-collapsed");return i.append(" ",a," ",l," "),t.append(" ",n," ",r," ",i," "),e.append(t),e}function Pe(o){let e=o.createFragment(),t=o.createElement("div","lh-snippet__line"),n=o.createElement("div","lh-snippet__line-number"),r=o.createElement("div","lh-snippet__line-icon"),i=o.createElement("code");return t.append(" ",n," ",r," ",i," "),e.append(t),e}function He(o){let e=o.createFragment(),t=o.createElement("style");return t.append(`/**
|
|
359
|
+
* @license
|
|
360
|
+
* Copyright 2017 The Lighthouse Authors. All Rights Reserved.
|
|
361
|
+
*
|
|
362
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
363
|
+
* you may not use this file except in compliance with the License.
|
|
364
|
+
* You may obtain a copy of the License at
|
|
365
|
+
*
|
|
366
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
367
|
+
*
|
|
368
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
369
|
+
* distributed under the License is distributed on an "AS-IS" BASIS,
|
|
370
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
371
|
+
* See the License for the specific language governing permissions and
|
|
372
|
+
* limitations under the License.
|
|
373
|
+
*/
|
|
374
|
+
|
|
375
|
+
/*
|
|
376
|
+
Naming convention:
|
|
377
|
+
|
|
378
|
+
If a variable is used for a specific component: --{component}-{property name}-{modifier}
|
|
379
|
+
|
|
380
|
+
Both {component} and {property name} should be kebab-case. If the target is the entire page,
|
|
381
|
+
use 'report' for the component. The property name should not be abbreviated. Use the
|
|
382
|
+
property name the variable is intended for - if it's used for multiple, a common descriptor
|
|
383
|
+
is fine (ex: 'size' for a variable applied to 'width' and 'height'). If a variable is shared
|
|
384
|
+
across multiple components, either create more variables or just drop the "{component}-"
|
|
385
|
+
part of the name. Append any modifiers at the end (ex: 'big', 'dark').
|
|
386
|
+
|
|
387
|
+
For colors: --color-{hue}-{intensity}
|
|
388
|
+
|
|
389
|
+
{intensity} is the Material Design tag - 700, A700, etc.
|
|
390
|
+
*/
|
|
391
|
+
.lh-vars {
|
|
392
|
+
/* Palette using Material Design Colors
|
|
393
|
+
* https://www.materialui.co/colors */
|
|
394
|
+
--color-amber-50: #FFF8E1;
|
|
395
|
+
--color-blue-200: #90CAF9;
|
|
396
|
+
--color-blue-900: #0D47A1;
|
|
397
|
+
--color-blue-A700: #2962FF;
|
|
398
|
+
--color-blue-primary: #06f;
|
|
399
|
+
--color-cyan-500: #00BCD4;
|
|
400
|
+
--color-gray-100: #F5F5F5;
|
|
401
|
+
--color-gray-300: #CFCFCF;
|
|
402
|
+
--color-gray-200: #E0E0E0;
|
|
403
|
+
--color-gray-400: #BDBDBD;
|
|
404
|
+
--color-gray-50: #FAFAFA;
|
|
405
|
+
--color-gray-500: #9E9E9E;
|
|
406
|
+
--color-gray-600: #757575;
|
|
407
|
+
--color-gray-700: #616161;
|
|
408
|
+
--color-gray-800: #424242;
|
|
409
|
+
--color-gray-900: #212121;
|
|
410
|
+
--color-gray: #000000;
|
|
411
|
+
--color-green-700: #080;
|
|
412
|
+
--color-green: #0c6;
|
|
413
|
+
--color-lime-400: #D3E156;
|
|
414
|
+
--color-orange-50: #FFF3E0;
|
|
415
|
+
--color-orange-700: #C33300;
|
|
416
|
+
--color-orange: #fa3;
|
|
417
|
+
--color-red-700: #c00;
|
|
418
|
+
--color-red: #f33;
|
|
419
|
+
--color-teal-600: #00897B;
|
|
420
|
+
--color-white: #FFFFFF;
|
|
421
|
+
|
|
422
|
+
/* Context-specific colors */
|
|
423
|
+
--color-average-secondary: var(--color-orange-700);
|
|
424
|
+
--color-average: var(--color-orange);
|
|
425
|
+
--color-fail-secondary: var(--color-red-700);
|
|
426
|
+
--color-fail: var(--color-red);
|
|
427
|
+
--color-hover: var(--color-gray-50);
|
|
428
|
+
--color-informative: var(--color-blue-900);
|
|
429
|
+
--color-pass-secondary: var(--color-green-700);
|
|
430
|
+
--color-pass: var(--color-green);
|
|
431
|
+
--color-not-applicable: var(--color-gray-600);
|
|
432
|
+
|
|
433
|
+
/* Component variables */
|
|
434
|
+
--audit-description-padding-left: calc(var(--score-icon-size) + var(--score-icon-margin-left) + var(--score-icon-margin-right));
|
|
435
|
+
--audit-explanation-line-height: 16px;
|
|
436
|
+
--audit-group-margin-bottom: calc(var(--default-padding) * 6);
|
|
437
|
+
--audit-group-padding-vertical: 8px;
|
|
438
|
+
--audit-margin-horizontal: 5px;
|
|
439
|
+
--audit-padding-vertical: 8px;
|
|
440
|
+
--category-padding: calc(var(--default-padding) * 6) var(--edge-gap-padding) calc(var(--default-padding) * 4);
|
|
441
|
+
--chevron-line-stroke: var(--color-gray-600);
|
|
442
|
+
--chevron-size: 12px;
|
|
443
|
+
--default-padding: 8px;
|
|
444
|
+
--edge-gap-padding: calc(var(--default-padding) * 4);
|
|
445
|
+
--env-item-background-color: var(--color-gray-100);
|
|
446
|
+
--env-item-font-size: 28px;
|
|
447
|
+
--env-item-line-height: 36px;
|
|
448
|
+
--env-item-padding: 10px 0px;
|
|
449
|
+
--env-name-min-width: 220px;
|
|
450
|
+
--footer-padding-vertical: 16px;
|
|
451
|
+
--gauge-circle-size-big: 96px;
|
|
452
|
+
--gauge-circle-size: 48px;
|
|
453
|
+
--gauge-circle-size-sm: 32px;
|
|
454
|
+
--gauge-label-font-size-big: 18px;
|
|
455
|
+
--gauge-label-font-size: var(--report-font-size-secondary);
|
|
456
|
+
--gauge-label-line-height-big: 24px;
|
|
457
|
+
--gauge-label-line-height: var(--report-line-height-secondary);
|
|
458
|
+
--gauge-percentage-font-size-big: 38px;
|
|
459
|
+
--gauge-percentage-font-size: var(--report-font-size-secondary);
|
|
460
|
+
--gauge-wrapper-width: 120px;
|
|
461
|
+
--header-line-height: 24px;
|
|
462
|
+
--highlighter-background-color: var(--report-text-color);
|
|
463
|
+
--icon-square-size: calc(var(--score-icon-size) * 0.88);
|
|
464
|
+
--image-preview-size: 48px;
|
|
465
|
+
--link-color: var(--color-blue-primary);
|
|
466
|
+
--locale-selector-background-color: var(--color-white);
|
|
467
|
+
--metric-toggle-lines-fill: #7F7F7F;
|
|
468
|
+
--metric-value-font-size: calc(var(--report-font-size) * 1.8);
|
|
469
|
+
--metrics-toggle-background-color: var(--color-gray-200);
|
|
470
|
+
--plugin-badge-background-color: var(--color-white);
|
|
471
|
+
--plugin-badge-size-big: calc(var(--gauge-circle-size-big) / 2.7);
|
|
472
|
+
--plugin-badge-size: calc(var(--gauge-circle-size) / 2.7);
|
|
473
|
+
--plugin-icon-size: 65%;
|
|
474
|
+
--pwa-icon-margin: 0 var(--default-padding);
|
|
475
|
+
--pwa-icon-size: var(--topbar-logo-size);
|
|
476
|
+
--report-background-color: #fff;
|
|
477
|
+
--report-border-color-secondary: #ebebeb;
|
|
478
|
+
--report-font-family-monospace: 'Roboto Mono', 'Menlo', 'dejavu sans mono', 'Consolas', 'Lucida Console', monospace;
|
|
479
|
+
--report-font-family: Roboto, Helvetica, Arial, sans-serif;
|
|
480
|
+
--report-font-size: 14px;
|
|
481
|
+
--report-font-size-secondary: 12px;
|
|
482
|
+
--report-icon-size: var(--score-icon-background-size);
|
|
483
|
+
--report-line-height: 24px;
|
|
484
|
+
--report-line-height-secondary: 20px;
|
|
485
|
+
--report-monospace-font-size: calc(var(--report-font-size) * 0.85);
|
|
486
|
+
--report-text-color-secondary: var(--color-gray-800);
|
|
487
|
+
--report-text-color: var(--color-gray-900);
|
|
488
|
+
--report-content-max-width: calc(60 * var(--report-font-size)); /* defaults to 840px */
|
|
489
|
+
--report-content-min-width: 360px;
|
|
490
|
+
--report-content-max-width-minus-edge-gap: calc(var(--report-content-max-width) - var(--edge-gap-padding) * 2);
|
|
491
|
+
--score-container-padding: 8px;
|
|
492
|
+
--score-icon-background-size: 24px;
|
|
493
|
+
--score-icon-margin-left: 6px;
|
|
494
|
+
--score-icon-margin-right: 14px;
|
|
495
|
+
--score-icon-margin: 0 var(--score-icon-margin-right) 0 var(--score-icon-margin-left);
|
|
496
|
+
--score-icon-size: 12px;
|
|
497
|
+
--score-icon-size-big: 16px;
|
|
498
|
+
--screenshot-overlay-background: rgba(0, 0, 0, 0.3);
|
|
499
|
+
--section-padding-vertical: calc(var(--default-padding) * 6);
|
|
500
|
+
--snippet-background-color: var(--color-gray-50);
|
|
501
|
+
--snippet-color: #0938C2;
|
|
502
|
+
--sparkline-height: 5px;
|
|
503
|
+
--stackpack-padding-horizontal: 10px;
|
|
504
|
+
--sticky-header-background-color: var(--report-background-color);
|
|
505
|
+
--sticky-header-buffer: calc(var(--topbar-height) + var(--sticky-header-height));
|
|
506
|
+
--sticky-header-height: calc(var(--gauge-circle-size-sm) + var(--score-container-padding) * 2);
|
|
507
|
+
--table-group-header-background-color: #EEF1F4;
|
|
508
|
+
--table-group-header-text-color: var(--color-gray-700);
|
|
509
|
+
--table-higlight-background-color: #F5F7FA;
|
|
510
|
+
--tools-icon-color: var(--color-gray-600);
|
|
511
|
+
--topbar-background-color: var(--color-white);
|
|
512
|
+
--topbar-height: 32px;
|
|
513
|
+
--topbar-logo-size: 24px;
|
|
514
|
+
--topbar-padding: 0 8px;
|
|
515
|
+
--toplevel-warning-background-color: hsla(30, 100%, 75%, 10%);
|
|
516
|
+
--toplevel-warning-message-text-color: var(--color-average-secondary);
|
|
517
|
+
--toplevel-warning-padding: 18px;
|
|
518
|
+
--toplevel-warning-text-color: var(--report-text-color);
|
|
519
|
+
|
|
520
|
+
/* SVGs */
|
|
521
|
+
--plugin-icon-url-dark: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24" fill="%23FFFFFF"><path d="M0 0h24v24H0z" fill="none"/><path d="M20.5 11H19V7c0-1.1-.9-2-2-2h-4V3.5C13 2.12 11.88 1 10.5 1S8 2.12 8 3.5V5H4c-1.1 0-1.99.9-1.99 2v3.8H3.5c1.49 0 2.7 1.21 2.7 2.7s-1.21 2.7-2.7 2.7H2V20c0 1.1.9 2 2 2h3.8v-1.5c0-1.49 1.21-2.7 2.7-2.7 1.49 0 2.7 1.21 2.7 2.7V22H17c1.1 0 2-.9 2-2v-4h1.5c1.38 0 2.5-1.12 2.5-2.5S21.88 11 20.5 11z"/></svg>');
|
|
522
|
+
--plugin-icon-url: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24" fill="%23757575"><path d="M0 0h24v24H0z" fill="none"/><path d="M20.5 11H19V7c0-1.1-.9-2-2-2h-4V3.5C13 2.12 11.88 1 10.5 1S8 2.12 8 3.5V5H4c-1.1 0-1.99.9-1.99 2v3.8H3.5c1.49 0 2.7 1.21 2.7 2.7s-1.21 2.7-2.7 2.7H2V20c0 1.1.9 2 2 2h3.8v-1.5c0-1.49 1.21-2.7 2.7-2.7 1.49 0 2.7 1.21 2.7 2.7V22H17c1.1 0 2-.9 2-2v-4h1.5c1.38 0 2.5-1.12 2.5-2.5S21.88 11 20.5 11z"/></svg>');
|
|
523
|
+
|
|
524
|
+
--pass-icon-url: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><title>check</title><path fill="%23178239" d="M24 4C12.95 4 4 12.95 4 24c0 11.04 8.95 20 20 20 11.04 0 20-8.96 20-20 0-11.05-8.96-20-20-20zm-4 30L10 24l2.83-2.83L20 28.34l15.17-15.17L38 16 20 34z"/></svg>');
|
|
525
|
+
--average-icon-url: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><title>info</title><path fill="%23E67700" d="M24 4C12.95 4 4 12.95 4 24s8.95 20 20 20 20-8.95 20-20S35.05 4 24 4zm2 30h-4V22h4v12zm0-16h-4v-4h4v4z"/></svg>');
|
|
526
|
+
--fail-icon-url: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><title>warn</title><path fill="%23C7221F" d="M2 42h44L24 4 2 42zm24-6h-4v-4h4v4zm0-8h-4v-8h4v8z"/></svg>');
|
|
527
|
+
--error-icon-url: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 3 15"><title>error</title><path d="M0 15H 3V 12H 0V" fill="%23FF4E42"/><path d="M0 9H 3V 0H 0V" fill="%23FF4E42"/></svg>');
|
|
528
|
+
|
|
529
|
+
--pwa-installable-gray-url: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="nonzero"><circle fill="%23DAE0E3" cx="12" cy="12" r="12"/><path d="M12 5a7 7 0 1 0 0 14 7 7 0 0 0 0-14zm3.5 7.7h-2.8v2.8h-1.4v-2.8H8.5v-1.4h2.8V8.5h1.4v2.8h2.8v1.4z" fill="%23FFF"/></g></svg>');
|
|
530
|
+
--pwa-optimized-gray-url: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><rect fill="%23DAE0E3" width="24" height="24" rx="12"/><path fill="%23FFF" d="M12 15.07l3.6 2.18-.95-4.1 3.18-2.76-4.2-.36L12 6.17l-1.64 3.86-4.2.36 3.2 2.76-.96 4.1z"/><path d="M5 5h14v14H5z"/></g></svg>');
|
|
531
|
+
|
|
532
|
+
--pwa-installable-gray-url-dark: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="nonzero"><circle fill="%23424242" cx="12" cy="12" r="12"/><path d="M12 5a7 7 0 1 0 0 14 7 7 0 0 0 0-14zm3.5 7.7h-2.8v2.8h-1.4v-2.8H8.5v-1.4h2.8V8.5h1.4v2.8h2.8v1.4z" fill="%23FFF"/></g></svg>');
|
|
533
|
+
--pwa-optimized-gray-url-dark: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><rect fill="%23424242" width="24" height="24" rx="12"/><path fill="%23FFF" d="M12 15.07l3.6 2.18-.95-4.1 3.18-2.76-4.2-.36L12 6.17l-1.64 3.86-4.2.36 3.2 2.76-.96 4.1z"/><path d="M5 5h14v14H5z"/></g></svg>');
|
|
534
|
+
|
|
535
|
+
--pwa-installable-color-url: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><g fill-rule="nonzero" fill="none"><circle fill="%230CCE6B" cx="12" cy="12" r="12"/><path d="M12 5a7 7 0 1 0 0 14 7 7 0 0 0 0-14zm3.5 7.7h-2.8v2.8h-1.4v-2.8H8.5v-1.4h2.8V8.5h1.4v2.8h2.8v1.4z" fill="%23FFF"/></g></svg>');
|
|
536
|
+
--pwa-optimized-color-url: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><rect fill="%230CCE6B" width="24" height="24" rx="12"/><path d="M5 5h14v14H5z"/><path fill="%23FFF" d="M12 15.07l3.6 2.18-.95-4.1 3.18-2.76-4.2-.36L12 6.17l-1.64 3.86-4.2.36 3.2 2.76-.96 4.1z"/></g></svg>');
|
|
537
|
+
|
|
538
|
+
--swap-locale-icon-url: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M12.87 15.07l-2.54-2.51.03-.03c1.74-1.94 2.98-4.17 3.71-6.53H17V4h-7V2H8v2H1v1.99h11.17C11.5 7.92 10.44 9.75 9 11.35 8.07 10.32 7.3 9.19 6.69 8h-2c.73 1.63 1.73 3.17 2.98 4.56l-5.09 5.02L4 19l5-5 3.11 3.11.76-2.04zM18.5 10h-2L12 22h2l1.12-3h4.75L21 22h2l-4.5-12zm-2.62 7l1.62-4.33L19.12 17h-3.24z"/></svg>');
|
|
539
|
+
}
|
|
540
|
+
|
|
541
|
+
@media not print {
|
|
542
|
+
.lh-dark {
|
|
543
|
+
/* Pallete */
|
|
544
|
+
--color-gray-200: var(--color-gray-800);
|
|
545
|
+
--color-gray-300: #616161;
|
|
546
|
+
--color-gray-400: var(--color-gray-600);
|
|
547
|
+
--color-gray-700: var(--color-gray-400);
|
|
548
|
+
--color-gray-50: #757575;
|
|
549
|
+
--color-gray-600: var(--color-gray-500);
|
|
550
|
+
--color-green-700: var(--color-green);
|
|
551
|
+
--color-orange-700: var(--color-orange);
|
|
552
|
+
--color-red-700: var(--color-red);
|
|
553
|
+
--color-teal-600: var(--color-cyan-500);
|
|
554
|
+
|
|
555
|
+
/* Context-specific colors */
|
|
556
|
+
--color-hover: rgba(0, 0, 0, 0.2);
|
|
557
|
+
--color-informative: var(--color-blue-200);
|
|
558
|
+
|
|
559
|
+
/* Component variables */
|
|
560
|
+
--env-item-background-color: #393535;
|
|
561
|
+
--link-color: var(--color-blue-200);
|
|
562
|
+
--locale-selector-background-color: var(--color-gray-200);
|
|
563
|
+
--plugin-badge-background-color: var(--color-gray-800);
|
|
564
|
+
--report-background-color: var(--color-gray-900);
|
|
565
|
+
--report-border-color-secondary: var(--color-gray-200);
|
|
566
|
+
--report-text-color-secondary: var(--color-gray-400);
|
|
567
|
+
--report-text-color: var(--color-gray-100);
|
|
568
|
+
--snippet-color: var(--color-cyan-500);
|
|
569
|
+
--topbar-background-color: var(--color-gray);
|
|
570
|
+
--toplevel-warning-background-color: hsl(33deg 14% 18%);
|
|
571
|
+
--toplevel-warning-message-text-color: var(--color-orange-700);
|
|
572
|
+
--toplevel-warning-text-color: var(--color-gray-100);
|
|
573
|
+
--table-group-header-background-color: rgba(186, 196, 206, 0.15);
|
|
574
|
+
--table-group-header-text-color: var(--color-gray-100);
|
|
575
|
+
--table-higlight-background-color: rgba(186, 196, 206, 0.09);
|
|
576
|
+
|
|
577
|
+
/* SVGs */
|
|
578
|
+
--plugin-icon-url: var(--plugin-icon-url-dark);
|
|
579
|
+
--pwa-installable-gray-url: var(--pwa-installable-gray-url-dark);
|
|
580
|
+
--pwa-optimized-gray-url: var(--pwa-optimized-gray-url-dark);
|
|
581
|
+
}
|
|
582
|
+
}
|
|
583
|
+
|
|
584
|
+
@media only screen and (max-width: 480px) {
|
|
585
|
+
.lh-vars {
|
|
586
|
+
--audit-group-margin-bottom: 20px;
|
|
587
|
+
--edge-gap-padding: var(--default-padding);
|
|
588
|
+
--env-name-min-width: 120px;
|
|
589
|
+
--gauge-circle-size-big: 96px;
|
|
590
|
+
--gauge-circle-size: 72px;
|
|
591
|
+
--gauge-label-font-size-big: 22px;
|
|
592
|
+
--gauge-label-font-size: 14px;
|
|
593
|
+
--gauge-label-line-height-big: 26px;
|
|
594
|
+
--gauge-label-line-height: 20px;
|
|
595
|
+
--gauge-percentage-font-size-big: 34px;
|
|
596
|
+
--gauge-percentage-font-size: 26px;
|
|
597
|
+
--gauge-wrapper-width: 112px;
|
|
598
|
+
--header-padding: 16px 0 16px 0;
|
|
599
|
+
--image-preview-size: 24px;
|
|
600
|
+
--plugin-icon-size: 75%;
|
|
601
|
+
--pwa-icon-margin: 0 7px 0 -3px;
|
|
602
|
+
--report-font-size: 14px;
|
|
603
|
+
--report-line-height: 20px;
|
|
604
|
+
--score-icon-margin-left: 2px;
|
|
605
|
+
--score-icon-size: 10px;
|
|
606
|
+
--topbar-height: 28px;
|
|
607
|
+
--topbar-logo-size: 20px;
|
|
608
|
+
}
|
|
609
|
+
|
|
610
|
+
/* Not enough space to adequately show the relative savings bars. */
|
|
611
|
+
.lh-sparkline {
|
|
612
|
+
display: none;
|
|
613
|
+
}
|
|
614
|
+
}
|
|
615
|
+
|
|
616
|
+
.lh-vars.lh-devtools {
|
|
617
|
+
--audit-explanation-line-height: 14px;
|
|
618
|
+
--audit-group-margin-bottom: 20px;
|
|
619
|
+
--audit-group-padding-vertical: 12px;
|
|
620
|
+
--audit-padding-vertical: 4px;
|
|
621
|
+
--category-padding: 12px;
|
|
622
|
+
--default-padding: 12px;
|
|
623
|
+
--env-name-min-width: 120px;
|
|
624
|
+
--footer-padding-vertical: 8px;
|
|
625
|
+
--gauge-circle-size-big: 72px;
|
|
626
|
+
--gauge-circle-size: 64px;
|
|
627
|
+
--gauge-label-font-size-big: 22px;
|
|
628
|
+
--gauge-label-font-size: 14px;
|
|
629
|
+
--gauge-label-line-height-big: 26px;
|
|
630
|
+
--gauge-label-line-height: 20px;
|
|
631
|
+
--gauge-percentage-font-size-big: 34px;
|
|
632
|
+
--gauge-percentage-font-size: 26px;
|
|
633
|
+
--gauge-wrapper-width: 97px;
|
|
634
|
+
--header-line-height: 20px;
|
|
635
|
+
--header-padding: 16px 0 16px 0;
|
|
636
|
+
--screenshot-overlay-background: transparent;
|
|
637
|
+
--plugin-icon-size: 75%;
|
|
638
|
+
--pwa-icon-margin: 0 7px 0 -3px;
|
|
639
|
+
--report-font-family-monospace: 'Menlo', 'dejavu sans mono', 'Consolas', 'Lucida Console', monospace;
|
|
640
|
+
--report-font-family: '.SFNSDisplay-Regular', 'Helvetica Neue', 'Lucida Grande', sans-serif;
|
|
641
|
+
--report-font-size: 12px;
|
|
642
|
+
--report-line-height: 20px;
|
|
643
|
+
--score-icon-margin-left: 2px;
|
|
644
|
+
--score-icon-size: 10px;
|
|
645
|
+
--section-padding-vertical: 8px;
|
|
646
|
+
}
|
|
647
|
+
|
|
648
|
+
.lh-container:not(.lh-topbar + .lh-container) {
|
|
649
|
+
--topbar-height: 0;
|
|
650
|
+
--sticky-header-height: 0;
|
|
651
|
+
--sticky-header-buffer: 0;
|
|
652
|
+
}
|
|
653
|
+
|
|
654
|
+
.lh-devtools.lh-root {
|
|
655
|
+
height: 100%;
|
|
656
|
+
}
|
|
657
|
+
.lh-devtools.lh-root img {
|
|
658
|
+
/* Override devtools default 'min-width: 0' so svg without size in a flexbox isn't collapsed. */
|
|
659
|
+
min-width: auto;
|
|
660
|
+
}
|
|
661
|
+
.lh-devtools .lh-container {
|
|
662
|
+
overflow-y: scroll;
|
|
663
|
+
height: calc(100% - var(--topbar-height));
|
|
664
|
+
/** The .lh-container is the scroll parent in DevTools so we exclude the topbar from the sticky header buffer. */
|
|
665
|
+
--sticky-header-buffer: calc(var(--sticky-header-height));
|
|
666
|
+
}
|
|
667
|
+
@media print {
|
|
668
|
+
.lh-devtools .lh-container {
|
|
669
|
+
overflow: unset;
|
|
670
|
+
}
|
|
671
|
+
}
|
|
672
|
+
.lh-devtools .lh-sticky-header {
|
|
673
|
+
/* This is normally the height of the topbar, but we want it to stick to the top of our scroll container .lh-container\` */
|
|
674
|
+
top: 0;
|
|
675
|
+
}
|
|
676
|
+
.lh-devtools .lh-element-screenshot__overlay {
|
|
677
|
+
position: absolute;
|
|
678
|
+
}
|
|
679
|
+
|
|
680
|
+
@keyframes fadeIn {
|
|
681
|
+
0% { opacity: 0;}
|
|
682
|
+
100% { opacity: 0.6;}
|
|
683
|
+
}
|
|
684
|
+
|
|
685
|
+
.lh-root *, .lh-root *::before, .lh-root *::after {
|
|
686
|
+
box-sizing: border-box;
|
|
687
|
+
}
|
|
688
|
+
|
|
689
|
+
.lh-root {
|
|
690
|
+
font-family: var(--report-font-family);
|
|
691
|
+
font-size: var(--report-font-size);
|
|
692
|
+
margin: 0;
|
|
693
|
+
line-height: var(--report-line-height);
|
|
694
|
+
background: var(--report-background-color);
|
|
695
|
+
color: var(--report-text-color);
|
|
696
|
+
}
|
|
697
|
+
|
|
698
|
+
.lh-root :focus-visible {
|
|
699
|
+
outline: -webkit-focus-ring-color auto 3px;
|
|
700
|
+
}
|
|
701
|
+
.lh-root summary:focus {
|
|
702
|
+
outline: none;
|
|
703
|
+
box-shadow: 0 0 0 1px hsl(217, 89%, 61%);
|
|
704
|
+
}
|
|
705
|
+
|
|
706
|
+
.lh-root [hidden] {
|
|
707
|
+
display: none !important;
|
|
708
|
+
}
|
|
709
|
+
|
|
710
|
+
.lh-root pre {
|
|
711
|
+
margin: 0;
|
|
712
|
+
}
|
|
713
|
+
|
|
714
|
+
.lh-root pre,
|
|
715
|
+
.lh-root code {
|
|
716
|
+
font-family: var(--report-font-family-monospace);
|
|
717
|
+
}
|
|
718
|
+
|
|
719
|
+
.lh-root details > summary {
|
|
720
|
+
cursor: pointer;
|
|
721
|
+
}
|
|
722
|
+
|
|
723
|
+
.lh-hidden {
|
|
724
|
+
display: none !important;
|
|
725
|
+
}
|
|
726
|
+
|
|
727
|
+
.lh-container {
|
|
728
|
+
/*
|
|
729
|
+
Text wrapping in the report is so much FUN!
|
|
730
|
+
We have a \`word-break: break-word;\` globally here to prevent a few common scenarios, namely
|
|
731
|
+
long non-breakable text (usually URLs) found in:
|
|
732
|
+
1. The footer
|
|
733
|
+
2. .lh-node (outerHTML)
|
|
734
|
+
3. .lh-code
|
|
735
|
+
|
|
736
|
+
With that sorted, the next challenge is appropriate column sizing and text wrapping inside our
|
|
737
|
+
.lh-details tables. Even more fun.
|
|
738
|
+
* We don't want table headers ("Potential Savings (ms)") to wrap or their column values, but
|
|
739
|
+
we'd be happy for the URL column to wrap if the URLs are particularly long.
|
|
740
|
+
* We want the narrow columns to remain narrow, providing the most column width for URL
|
|
741
|
+
* We don't want the table to extend past 100% width.
|
|
742
|
+
* Long URLs in the URL column can wrap. Util.getURLDisplayName maxes them out at 64 characters,
|
|
743
|
+
but they do not get any overflow:ellipsis treatment.
|
|
744
|
+
*/
|
|
745
|
+
word-break: break-word;
|
|
746
|
+
}
|
|
747
|
+
|
|
748
|
+
.lh-audit-group a,
|
|
749
|
+
.lh-category-header__description a,
|
|
750
|
+
.lh-audit__description a,
|
|
751
|
+
.lh-warnings a,
|
|
752
|
+
.lh-footer a,
|
|
753
|
+
.lh-table-column--link a {
|
|
754
|
+
color: var(--link-color);
|
|
755
|
+
}
|
|
756
|
+
|
|
757
|
+
.lh-audit__description, .lh-audit__stackpack {
|
|
758
|
+
--inner-audit-padding-right: var(--stackpack-padding-horizontal);
|
|
759
|
+
padding-left: var(--audit-description-padding-left);
|
|
760
|
+
padding-right: var(--inner-audit-padding-right);
|
|
761
|
+
padding-top: 8px;
|
|
762
|
+
padding-bottom: 8px;
|
|
763
|
+
}
|
|
764
|
+
|
|
765
|
+
.lh-details {
|
|
766
|
+
margin-top: var(--default-padding);
|
|
767
|
+
margin-bottom: var(--default-padding);
|
|
768
|
+
margin-left: var(--audit-description-padding-left);
|
|
769
|
+
/* whatever the .lh-details side margins are */
|
|
770
|
+
width: 100%;
|
|
771
|
+
}
|
|
772
|
+
|
|
773
|
+
.lh-audit__stackpack {
|
|
774
|
+
display: flex;
|
|
775
|
+
align-items: center;
|
|
776
|
+
}
|
|
777
|
+
|
|
778
|
+
.lh-audit__stackpack__img {
|
|
779
|
+
max-width: 30px;
|
|
780
|
+
margin-right: var(--default-padding)
|
|
781
|
+
}
|
|
782
|
+
|
|
783
|
+
/* Report header */
|
|
784
|
+
|
|
785
|
+
.lh-report-icon {
|
|
786
|
+
display: flex;
|
|
787
|
+
align-items: center;
|
|
788
|
+
padding: 10px 12px;
|
|
789
|
+
cursor: pointer;
|
|
790
|
+
}
|
|
791
|
+
.lh-report-icon[disabled] {
|
|
792
|
+
opacity: 0.3;
|
|
793
|
+
pointer-events: none;
|
|
794
|
+
}
|
|
795
|
+
|
|
796
|
+
.lh-report-icon::before {
|
|
797
|
+
content: "";
|
|
798
|
+
margin: 4px;
|
|
799
|
+
background-repeat: no-repeat;
|
|
800
|
+
width: var(--report-icon-size);
|
|
801
|
+
height: var(--report-icon-size);
|
|
802
|
+
opacity: 0.7;
|
|
803
|
+
display: inline-block;
|
|
804
|
+
vertical-align: middle;
|
|
805
|
+
}
|
|
806
|
+
.lh-report-icon:hover::before {
|
|
807
|
+
opacity: 1;
|
|
808
|
+
}
|
|
809
|
+
.lh-dark .lh-report-icon::before {
|
|
810
|
+
filter: invert(1);
|
|
811
|
+
}
|
|
812
|
+
.lh-report-icon--print::before {
|
|
813
|
+
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 8H5c-1.66 0-3 1.34-3 3v6h4v4h12v-4h4v-6c0-1.66-1.34-3-3-3zm-3 11H8v-5h8v5zm3-7c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zm-1-9H6v4h12V3z"/><path fill="none" d="M0 0h24v24H0z"/></svg>');
|
|
814
|
+
}
|
|
815
|
+
.lh-report-icon--copy::before {
|
|
816
|
+
background-image: url('data:image/svg+xml;utf8,<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M0 0h24v24H0z" fill="none"/><path d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"/></svg>');
|
|
817
|
+
}
|
|
818
|
+
.lh-report-icon--open::before {
|
|
819
|
+
background-image: url('data:image/svg+xml;utf8,<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 4H5c-1.11 0-2 .9-2 2v12c0 1.1.89 2 2 2h4v-2H5V8h14v10h-4v2h4c1.1 0 2-.9 2-2V6c0-1.1-.89-2-2-2zm-7 6l-4 4h3v6h2v-6h3l-4-4z"/></svg>');
|
|
820
|
+
}
|
|
821
|
+
.lh-report-icon--download::before {
|
|
822
|
+
background-image: url('data:image/svg+xml;utf8,<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"/><path d="M0 0h24v24H0z" fill="none"/></svg>');
|
|
823
|
+
}
|
|
824
|
+
.lh-report-icon--dark::before {
|
|
825
|
+
background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 100 125"><path d="M50 23.587c-16.27 0-22.799 12.574-22.799 21.417 0 12.917 10.117 22.451 12.436 32.471h20.726c2.32-10.02 12.436-19.554 12.436-32.471 0-8.843-6.528-21.417-22.799-21.417zM39.637 87.161c0 3.001 1.18 4.181 4.181 4.181h.426l.41 1.231C45.278 94.449 46.042 95 48.019 95h3.963c1.978 0 2.74-.551 3.365-2.427l.409-1.231h.427c3.002 0 4.18-1.18 4.18-4.181V80.91H39.637v6.251zM50 18.265c1.26 0 2.072-.814 2.072-2.073v-9.12C52.072 5.813 51.26 5 50 5c-1.259 0-2.072.813-2.072 2.073v9.12c0 1.259.813 2.072 2.072 2.072zM68.313 23.727c.994.774 2.135.634 2.91-.357l5.614-7.187c.776-.992.636-2.135-.356-2.909-.992-.776-2.135-.636-2.91.357l-5.613 7.186c-.778.993-.636 2.135.355 2.91zM91.157 36.373c-.306-1.222-1.291-1.815-2.513-1.51l-8.85 2.207c-1.222.305-1.814 1.29-1.51 2.512.305 1.223 1.291 1.814 2.513 1.51l8.849-2.206c1.223-.305 1.816-1.291 1.511-2.513zM86.757 60.48l-8.331-3.709c-1.15-.512-2.225-.099-2.736 1.052-.512 1.151-.1 2.224 1.051 2.737l8.33 3.707c1.15.514 2.225.101 2.736-1.05.513-1.149.1-2.223-1.05-2.737zM28.779 23.37c.775.992 1.917 1.131 2.909.357.992-.776 1.132-1.917.357-2.91l-5.615-7.186c-.775-.992-1.917-1.132-2.909-.357s-1.131 1.917-.356 2.909l5.614 7.187zM21.715 39.583c.305-1.223-.288-2.208-1.51-2.513l-8.849-2.207c-1.222-.303-2.208.289-2.513 1.511-.303 1.222.288 2.207 1.511 2.512l8.848 2.206c1.222.304 2.208-.287 2.513-1.509zM21.575 56.771l-8.331 3.711c-1.151.511-1.563 1.586-1.05 2.735.511 1.151 1.586 1.563 2.736 1.052l8.331-3.711c1.151-.511 1.563-1.586 1.05-2.735-.512-1.15-1.585-1.562-2.736-1.052z"/></svg>');
|
|
826
|
+
}
|
|
827
|
+
.lh-report-icon--treemap::before {
|
|
828
|
+
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="black"><path d="M3 5v14h19V5H3zm2 2h15v4H5V7zm0 10v-4h4v4H5zm6 0v-4h9v4h-9z"/></svg>');
|
|
829
|
+
}
|
|
830
|
+
.lh-report-icon--date::before {
|
|
831
|
+
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 11h2v2H7v-2zm14-5v14a2 2 0 01-2 2H5a2 2 0 01-2-2V6c0-1.1.9-2 2-2h1V2h2v2h8V2h2v2h1a2 2 0 012 2zM5 8h14V6H5v2zm14 12V10H5v10h14zm-4-7h2v-2h-2v2zm-4 0h2v-2h-2v2z"/></svg>');
|
|
832
|
+
}
|
|
833
|
+
.lh-report-icon--devices::before {
|
|
834
|
+
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 6h18V4H4a2 2 0 00-2 2v11H0v3h14v-3H4V6zm19 2h-6a1 1 0 00-1 1v10c0 .6.5 1 1 1h6c.6 0 1-.5 1-1V9c0-.6-.5-1-1-1zm-1 9h-4v-7h4v7z"/></svg>');
|
|
835
|
+
}
|
|
836
|
+
.lh-report-icon--world::before {
|
|
837
|
+
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm7 6h-3c-.3-1.3-.8-2.5-1.4-3.6A8 8 0 0 1 18.9 8zm-7-4a14 14 0 0 1 2 4h-4a14 14 0 0 1 2-4zM4.3 14a8.2 8.2 0 0 1 0-4h3.3a16.5 16.5 0 0 0 0 4H4.3zm.8 2h3a14 14 0 0 0 1.3 3.6A8 8 0 0 1 5.1 16zm3-8H5a8 8 0 0 1 4.3-3.6L8 8zM12 20a14 14 0 0 1-2-4h4a14 14 0 0 1-2 4zm2.3-6H9.7a14.7 14.7 0 0 1 0-4h4.6a14.6 14.6 0 0 1 0 4zm.3 5.6c.6-1.2 1-2.4 1.4-3.6h3a8 8 0 0 1-4.4 3.6zm1.8-5.6a16.5 16.5 0 0 0 0-4h3.3a8.2 8.2 0 0 1 0 4h-3.3z"/></svg>');
|
|
838
|
+
}
|
|
839
|
+
.lh-report-icon--stopwatch::before {
|
|
840
|
+
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15 1H9v2h6V1zm-4 13h2V8h-2v6zm8.1-6.6L20.5 6l-1.4-1.4L17.7 6A9 9 0 0 0 3 13a9 9 0 1 0 16-5.6zm-7 12.6a7 7 0 1 1 0-14 7 7 0 0 1 0 14z"/></svg>');
|
|
841
|
+
}
|
|
842
|
+
.lh-report-icon--networkspeed::before {
|
|
843
|
+
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15.9 5c-.2 0-.3 0-.4.2v.2L10.1 17a2 2 0 0 0-.2 1 2 2 0 0 0 4 .4l2.4-12.9c0-.3-.2-.5-.5-.5zM1 9l2 2c2.9-2.9 6.8-4 10.5-3.6l1.2-2.7C10 3.8 4.7 5.3 1 9zm20 2 2-2a15.4 15.4 0 0 0-5.6-3.6L17 8.2c1.5.7 2.9 1.6 4.1 2.8zm-4 4 2-2a9.9 9.9 0 0 0-2.7-1.9l-.5 3 1.2.9zM5 13l2 2a7.1 7.1 0 0 1 4-2l1.3-2.9C9.7 10.1 7 11 5 13z"/></svg>');
|
|
844
|
+
}
|
|
845
|
+
.lh-report-icon--samples-one::before {
|
|
846
|
+
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="7" cy="14" r="3"/><path d="M7 18a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm4-2a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm5.6 17.6a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/></svg>');
|
|
847
|
+
}
|
|
848
|
+
.lh-report-icon--samples-many::before {
|
|
849
|
+
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 18a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm4-2a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm5.6 17.6a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/><circle cx="7" cy="14" r="3"/><circle cx="11" cy="6" r="3"/></svg>');
|
|
850
|
+
}
|
|
851
|
+
.lh-report-icon--chrome::before {
|
|
852
|
+
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-50 -50 562 562"><path d="M256 25.6v25.6a204 204 0 0 1 144.8 60 204 204 0 0 1 60 144.8 204 204 0 0 1-60 144.8 204 204 0 0 1-144.8 60 204 204 0 0 1-144.8-60 204 204 0 0 1-60-144.8 204 204 0 0 1 60-144.8 204 204 0 0 1 144.8-60V0a256 256 0 1 0 0 512 256 256 0 0 0 0-512v25.6z"/><path d="M256 179.2v25.6a51.3 51.3 0 0 1 0 102.4 51.3 51.3 0 0 1 0-102.4v-51.2a102.3 102.3 0 1 0-.1 204.7 102.3 102.3 0 0 0 .1-204.7v25.6z"/><path d="M256 204.8h217.6a25.6 25.6 0 0 0 0-51.2H256a25.6 25.6 0 0 0 0 51.2m44.3 76.8L191.5 470.1a25.6 25.6 0 1 0 44.4 25.6l108.8-188.5a25.6 25.6 0 1 0-44.4-25.6m-88.6 0L102.9 93.2a25.7 25.7 0 0 0-35-9.4 25.7 25.7 0 0 0-9.4 35l108.8 188.5a25.7 25.7 0 0 0 35 9.4 25.9 25.9 0 0 0 9.4-35.1"/></svg>');
|
|
853
|
+
}
|
|
854
|
+
.lh-report-icon--external::before {
|
|
855
|
+
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><path d="M3.15 11.9a1.01 1.01 0 0 1-.743-.307 1.01 1.01 0 0 1-.306-.743v-7.7c0-.292.102-.54.306-.744a1.01 1.01 0 0 1 .744-.306H7v1.05H3.15v7.7h7.7V7h1.05v3.85c0 .291-.103.54-.307.743a1.01 1.01 0 0 1-.743.307h-7.7Zm2.494-2.8-.743-.744 5.206-5.206H8.401V2.1h3.5v3.5h-1.05V3.893L5.644 9.1Z"/></svg>');
|
|
856
|
+
}
|
|
857
|
+
|
|
858
|
+
.lh-buttons {
|
|
859
|
+
display: flex;
|
|
860
|
+
flex-wrap: wrap;
|
|
861
|
+
margin: var(--default-padding) 0;
|
|
862
|
+
}
|
|
863
|
+
.lh-button {
|
|
864
|
+
height: 32px;
|
|
865
|
+
border: 1px solid var(--report-border-color-secondary);
|
|
866
|
+
border-radius: 3px;
|
|
867
|
+
color: var(--link-color);
|
|
868
|
+
background-color: var(--report-background-color);
|
|
869
|
+
margin: 5px;
|
|
870
|
+
}
|
|
871
|
+
|
|
872
|
+
.lh-button:first-of-type {
|
|
873
|
+
margin-left: 0;
|
|
874
|
+
}
|
|
875
|
+
|
|
876
|
+
/* Node */
|
|
877
|
+
.lh-node__snippet {
|
|
878
|
+
font-family: var(--report-font-family-monospace);
|
|
879
|
+
color: var(--snippet-color);
|
|
880
|
+
font-size: var(--report-monospace-font-size);
|
|
881
|
+
line-height: 20px;
|
|
882
|
+
}
|
|
883
|
+
|
|
884
|
+
/* Score */
|
|
885
|
+
|
|
886
|
+
.lh-audit__score-icon {
|
|
887
|
+
width: var(--score-icon-size);
|
|
888
|
+
height: var(--score-icon-size);
|
|
889
|
+
margin: var(--score-icon-margin);
|
|
890
|
+
}
|
|
891
|
+
|
|
892
|
+
.lh-audit--pass .lh-audit__display-text {
|
|
893
|
+
color: var(--color-pass-secondary);
|
|
894
|
+
}
|
|
895
|
+
.lh-audit--pass .lh-audit__score-icon,
|
|
896
|
+
.lh-scorescale-range--pass::before {
|
|
897
|
+
border-radius: 100%;
|
|
898
|
+
background: var(--color-pass);
|
|
899
|
+
}
|
|
900
|
+
|
|
901
|
+
.lh-audit--average .lh-audit__display-text {
|
|
902
|
+
color: var(--color-average-secondary);
|
|
903
|
+
}
|
|
904
|
+
.lh-audit--average .lh-audit__score-icon,
|
|
905
|
+
.lh-scorescale-range--average::before {
|
|
906
|
+
background: var(--color-average);
|
|
907
|
+
width: var(--icon-square-size);
|
|
908
|
+
height: var(--icon-square-size);
|
|
909
|
+
}
|
|
910
|
+
|
|
911
|
+
.lh-audit--fail .lh-audit__display-text {
|
|
912
|
+
color: var(--color-fail-secondary);
|
|
913
|
+
}
|
|
914
|
+
.lh-audit--fail .lh-audit__score-icon,
|
|
915
|
+
.lh-audit--error .lh-audit__score-icon,
|
|
916
|
+
.lh-scorescale-range--fail::before {
|
|
917
|
+
border-left: calc(var(--score-icon-size) / 2) solid transparent;
|
|
918
|
+
border-right: calc(var(--score-icon-size) / 2) solid transparent;
|
|
919
|
+
border-bottom: var(--score-icon-size) solid var(--color-fail);
|
|
920
|
+
}
|
|
921
|
+
|
|
922
|
+
.lh-audit--error .lh-audit__score-icon,
|
|
923
|
+
.lh-metric--error .lh-metric__icon {
|
|
924
|
+
background-image: var(--error-icon-url);
|
|
925
|
+
background-repeat: no-repeat;
|
|
926
|
+
background-position: center;
|
|
927
|
+
border: none;
|
|
928
|
+
}
|
|
929
|
+
|
|
930
|
+
.lh-gauge__wrapper--fail .lh-gauge--error {
|
|
931
|
+
background-image: var(--error-icon-url);
|
|
932
|
+
background-repeat: no-repeat;
|
|
933
|
+
background-position: center;
|
|
934
|
+
transform: scale(0.5);
|
|
935
|
+
top: var(--score-container-padding);
|
|
936
|
+
}
|
|
937
|
+
|
|
938
|
+
.lh-audit--manual .lh-audit__display-text,
|
|
939
|
+
.lh-audit--notapplicable .lh-audit__display-text {
|
|
940
|
+
color: var(--color-gray-600);
|
|
941
|
+
}
|
|
942
|
+
.lh-audit--manual .lh-audit__score-icon,
|
|
943
|
+
.lh-audit--notapplicable .lh-audit__score-icon {
|
|
944
|
+
border: calc(0.2 * var(--score-icon-size)) solid var(--color-gray-400);
|
|
945
|
+
border-radius: 100%;
|
|
946
|
+
background: none;
|
|
947
|
+
}
|
|
948
|
+
|
|
949
|
+
.lh-audit--informative .lh-audit__display-text {
|
|
950
|
+
color: var(--color-gray-600);
|
|
951
|
+
}
|
|
952
|
+
|
|
953
|
+
.lh-audit--informative .lh-audit__score-icon {
|
|
954
|
+
border: calc(0.2 * var(--score-icon-size)) solid var(--color-gray-400);
|
|
955
|
+
border-radius: 100%;
|
|
956
|
+
}
|
|
957
|
+
|
|
958
|
+
.lh-audit__description,
|
|
959
|
+
.lh-audit__stackpack {
|
|
960
|
+
color: var(--report-text-color-secondary);
|
|
961
|
+
}
|
|
962
|
+
.lh-audit__adorn {
|
|
963
|
+
border: 1px solid var(--color-gray-500);
|
|
964
|
+
border-radius: 3px;
|
|
965
|
+
margin: 0 3px;
|
|
966
|
+
padding: 0 2px;
|
|
967
|
+
line-height: 1.1;
|
|
968
|
+
display: inline-block;
|
|
969
|
+
font-size: 90%;
|
|
970
|
+
color: var(--report-text-color-secondary);
|
|
971
|
+
}
|
|
972
|
+
|
|
973
|
+
.lh-category-header__description {
|
|
974
|
+
text-align: center;
|
|
975
|
+
color: var(--color-gray-700);
|
|
976
|
+
margin: 0px auto;
|
|
977
|
+
max-width: 400px;
|
|
978
|
+
}
|
|
979
|
+
|
|
980
|
+
|
|
981
|
+
.lh-audit__display-text,
|
|
982
|
+
.lh-load-opportunity__sparkline,
|
|
983
|
+
.lh-chevron-container {
|
|
984
|
+
margin: 0 var(--audit-margin-horizontal);
|
|
985
|
+
}
|
|
986
|
+
.lh-chevron-container {
|
|
987
|
+
margin-right: 0;
|
|
988
|
+
}
|
|
989
|
+
|
|
990
|
+
.lh-audit__title-and-text {
|
|
991
|
+
flex: 1;
|
|
992
|
+
}
|
|
993
|
+
|
|
994
|
+
.lh-audit__title-and-text code {
|
|
995
|
+
color: var(--snippet-color);
|
|
996
|
+
font-size: var(--report-monospace-font-size);
|
|
997
|
+
}
|
|
998
|
+
|
|
999
|
+
/* Prepend display text with em dash separator. But not in Opportunities. */
|
|
1000
|
+
.lh-audit__display-text:not(:empty):before {
|
|
1001
|
+
content: '\u2014';
|
|
1002
|
+
margin-right: var(--audit-margin-horizontal);
|
|
1003
|
+
}
|
|
1004
|
+
.lh-audit-group.lh-audit-group--load-opportunities .lh-audit__display-text:not(:empty):before {
|
|
1005
|
+
display: none;
|
|
1006
|
+
}
|
|
1007
|
+
|
|
1008
|
+
/* Expandable Details (Audit Groups, Audits) */
|
|
1009
|
+
.lh-audit__header {
|
|
1010
|
+
display: flex;
|
|
1011
|
+
align-items: center;
|
|
1012
|
+
padding: var(--default-padding);
|
|
1013
|
+
}
|
|
1014
|
+
|
|
1015
|
+
.lh-audit--load-opportunity .lh-audit__header {
|
|
1016
|
+
display: block;
|
|
1017
|
+
}
|
|
1018
|
+
|
|
1019
|
+
|
|
1020
|
+
.lh-metricfilter {
|
|
1021
|
+
display: grid;
|
|
1022
|
+
justify-content: end;
|
|
1023
|
+
align-items: center;
|
|
1024
|
+
grid-auto-flow: column;
|
|
1025
|
+
gap: 4px;
|
|
1026
|
+
color: var(--color-gray-700);
|
|
1027
|
+
}
|
|
1028
|
+
|
|
1029
|
+
.lh-metricfilter__radio {
|
|
1030
|
+
/*
|
|
1031
|
+
* Instead of hiding, position offscreen so it's still accessible to screen readers
|
|
1032
|
+
* https://bugs.chromium.org/p/chromium/issues/detail?id=1439785
|
|
33
1033
|
*/
|
|
34
|
-
class o{constructor(e,t){this._document=e,this._lighthouseChannel="unknown",this._componentCache=new Map,this.rootEl=t}createElement(e,t){const n=this._document.createElement(e);if(t)for(const e of t.split(/\s+/))e&&n.classList.add(e);return n}createElementNS(e,t,n){const r=this._document.createElementNS(e,t);if(n)for(const e of n.split(/\s+/))e&&r.classList.add(e);return r}createFragment(){return this._document.createDocumentFragment()}createTextNode(e){return this._document.createTextNode(e)}createChildOf(e,t,n){const r=this.createElement(t,n);return e.append(r),r}createComponent(e){let t=this._componentCache.get(e);if(t){const e=t.cloneNode(!0);return this.findAll("style",e).forEach((e=>e.remove())),e}t=function(e,t){switch(t){case"3pFilter":return function(e){const t=e.createFragment(),n=e.createElement("style");n.append("\n .lh-3p-filter {\n color: var(--color-gray-600);\n float: right;\n padding: 6px var(--stackpack-padding-horizontal);\n }\n .lh-3p-filter-label, .lh-3p-filter-input {\n vertical-align: middle;\n user-select: none;\n }\n .lh-3p-filter-input:disabled + .lh-3p-ui-string {\n text-decoration: line-through;\n }\n "),t.append(n);const r=e.createElement("div","lh-3p-filter"),o=e.createElement("label","lh-3p-filter-label"),i=e.createElement("input","lh-3p-filter-input");i.setAttribute("type","checkbox"),i.setAttribute("checked","");const a=e.createElement("span","lh-3p-ui-string");a.append("Show 3rd party resources");const l=e.createElement("span","lh-3p-filter-count");return o.append(" ",i," ",a," (",l,") "),r.append(" ",o," "),t.append(r),t}(e);case"audit":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-audit"),r=e.createElement("details","lh-expandable-details"),o=e.createElement("summary"),i=e.createElement("div","lh-audit__header lh-expandable-details__summary"),a=e.createElement("span","lh-audit__score-icon"),l=e.createElement("span","lh-audit__title-and-text"),s=e.createElement("span","lh-audit__title"),c=e.createElement("span","lh-audit__display-text");l.append(" ",s," ",c," ");const d=e.createElement("div","lh-chevron-container");i.append(" ",a," ",l," ",d," "),o.append(" ",i," ");const h=e.createElement("div","lh-audit__description"),p=e.createElement("div","lh-audit__stackpacks");return r.append(" ",o," ",h," ",p," "),n.append(" ",r," "),t.append(n),t}(e);case"categoryHeader":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-category-header"),r=e.createElement("div","lh-score__gauge");r.setAttribute("role","heading"),r.setAttribute("aria-level","2");const o=e.createElement("div","lh-category-header__description");return n.append(" ",r," ",o," "),t.append(n),t}(e);case"chevron":return function(e){const t=e.createFragment(),n=e.createElementNS("http://www.w3.org/2000/svg","svg","lh-chevron");n.setAttribute("viewBox","0 0 100 100");const r=e.createElementNS("http://www.w3.org/2000/svg","g","lh-chevron__lines"),o=e.createElementNS("http://www.w3.org/2000/svg","path","lh-chevron__line lh-chevron__line-left");o.setAttribute("d","M10 50h40");const i=e.createElementNS("http://www.w3.org/2000/svg","path","lh-chevron__line lh-chevron__line-right");return i.setAttribute("d","M90 50H50"),r.append(" ",o," ",i," "),n.append(" ",r," "),t.append(n),t}(e);case"clump":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-audit-group"),r=e.createElement("details","lh-clump"),o=e.createElement("summary"),i=e.createElement("div","lh-audit-group__summary"),a=e.createElement("div","lh-audit-group__header"),l=e.createElement("span","lh-audit-group__title"),s=e.createElement("span","lh-audit-group__itemcount");a.append(" ",l," ",s," "," "," ");const c=e.createElement("div","lh-clump-toggle"),d=e.createElement("span","lh-clump-toggletext--show"),h=e.createElement("span","lh-clump-toggletext--hide");return c.append(" ",d," ",h," "),i.append(" ",a," ",c," "),o.append(" ",i," "),r.append(" ",o," "),n.append(" "," ",r," "),t.append(n),t}(e);case"crc":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-crc-container"),r=e.createElement("style");r.append('\n .lh-crc .lh-tree-marker {\n width: 12px;\n height: 26px;\n display: block;\n float: left;\n background-position: top left;\n }\n .lh-crc .lh-horiz-down {\n background: url(\'data:image/svg+xml;utf8,<svg width="16" height="26" viewBox="0 0 16 26" xmlns="http://www.w3.org/2000/svg"><g fill="%23D8D8D8" fill-rule="evenodd"><path d="M16 12v2H-2v-2z"/><path d="M9 12v14H7V12z"/></g></svg>\');\n }\n .lh-crc .lh-right {\n background: url(\'data:image/svg+xml;utf8,<svg width="16" height="26" viewBox="0 0 16 26" xmlns="http://www.w3.org/2000/svg"><path d="M16 12v2H0v-2z" fill="%23D8D8D8" fill-rule="evenodd"/></svg>\');\n }\n .lh-crc .lh-up-right {\n background: url(\'data:image/svg+xml;utf8,<svg width="16" height="26" viewBox="0 0 16 26" xmlns="http://www.w3.org/2000/svg"><path d="M7 0h2v14H7zm2 12h7v2H9z" fill="%23D8D8D8" fill-rule="evenodd"/></svg>\');\n }\n .lh-crc .lh-vert-right {\n background: url(\'data:image/svg+xml;utf8,<svg width="16" height="26" viewBox="0 0 16 26" xmlns="http://www.w3.org/2000/svg"><path d="M7 0h2v27H7zm2 12h7v2H9z" fill="%23D8D8D8" fill-rule="evenodd"/></svg>\');\n }\n .lh-crc .lh-vert {\n background: url(\'data:image/svg+xml;utf8,<svg width="16" height="26" viewBox="0 0 16 26" xmlns="http://www.w3.org/2000/svg"><path d="M7 0h2v26H7z" fill="%23D8D8D8" fill-rule="evenodd"/></svg>\');\n }\n .lh-crc .lh-crc-tree {\n font-size: 14px;\n width: 100%;\n overflow-x: auto;\n }\n .lh-crc .lh-crc-node {\n height: 26px;\n line-height: 26px;\n white-space: nowrap;\n }\n .lh-crc .lh-crc-node__tree-value {\n margin-left: 10px;\n }\n .lh-crc .lh-crc-node__tree-value div {\n display: inline;\n }\n .lh-crc .lh-crc-node__chain-duration {\n font-weight: 700;\n }\n .lh-crc .lh-crc-initial-nav {\n color: #595959;\n font-style: italic;\n }\n .lh-crc__summary-value {\n margin-bottom: 10px;\n }\n ');const o=e.createElement("div"),i=e.createElement("div","lh-crc__summary-value"),a=e.createElement("span","lh-crc__longest_duration_label"),l=e.createElement("b","lh-crc__longest_duration");i.append(" ",a," ",l," "),o.append(" ",i," ");const s=e.createElement("div","lh-crc"),c=e.createElement("div","lh-crc-initial-nav");return s.append(" ",c," "," "),n.append(" ",r," ",o," ",s," "),t.append(n),t}(e);case"crcChain":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-crc-node"),r=e.createElement("span","lh-crc-node__tree-marker"),o=e.createElement("span","lh-crc-node__tree-value");return n.append(" ",r," ",o," "),t.append(n),t}(e);case"elementScreenshot":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-element-screenshot"),r=e.createElement("div","lh-element-screenshot__content"),o=e.createElement("div","lh-element-screenshot__image"),i=e.createElement("div","lh-element-screenshot__mask"),a=e.createElementNS("http://www.w3.org/2000/svg","svg");a.setAttribute("height","0"),a.setAttribute("width","0");const l=e.createElementNS("http://www.w3.org/2000/svg","defs"),s=e.createElementNS("http://www.w3.org/2000/svg","clipPath");s.setAttribute("clipPathUnits","objectBoundingBox"),l.append(" ",s," "," "),a.append(" ",l," "),i.append(" ",a," ");const c=e.createElement("div","lh-element-screenshot__element-marker");return o.append(" ",i," ",c," "),r.append(" ",o," "),n.append(" ",r," "),t.append(n),t}(e);case"footer":return function(e){const t=e.createFragment(),n=e.createElement("style");n.append("\n .lh-footer {\n padding: var(--footer-padding-vertical) calc(var(--default-padding) * 2);\n max-width: var(--report-content-max-width);\n margin: 0 auto;\n }\n .lh-footer .lh-generated {\n text-align: center;\n }\n "),t.append(n);const r=e.createElement("footer","lh-footer"),o=e.createElement("ul","lh-meta__items");o.append(" ");const i=e.createElement("div","lh-generated"),a=e.createElement("b");a.append("Lighthouse");const l=e.createElement("span","lh-footer__version"),s=e.createElement("a","lh-footer__version_issue");return s.setAttribute("href","https://github.com/GoogleChrome/Lighthouse/issues"),s.setAttribute("target","_blank"),s.setAttribute("rel","noopener"),s.append("File an issue"),i.append(" "," Generated by ",a," ",l," | ",s," "),r.append(" ",o," ",i," "),t.append(r),t}(e);case"fraction":return function(e){const t=e.createFragment(),n=e.createElement("a","lh-fraction__wrapper"),r=e.createElement("div","lh-fraction__content-wrapper"),o=e.createElement("div","lh-fraction__content"),i=e.createElement("div","lh-fraction__background");o.append(" ",i," "),r.append(" ",o," ");const a=e.createElement("div","lh-fraction__label");return n.append(" ",r," ",a," "),t.append(n),t}(e);case"gauge":return function(e){const t=e.createFragment(),n=e.createElement("a","lh-gauge__wrapper"),r=e.createElement("div","lh-gauge__svg-wrapper"),o=e.createElementNS("http://www.w3.org/2000/svg","svg","lh-gauge");o.setAttribute("viewBox","0 0 120 120");const i=e.createElementNS("http://www.w3.org/2000/svg","circle","lh-gauge-base");i.setAttribute("r","56"),i.setAttribute("cx","60"),i.setAttribute("cy","60"),i.setAttribute("stroke-width","8");const a=e.createElementNS("http://www.w3.org/2000/svg","circle","lh-gauge-arc");a.setAttribute("r","56"),a.setAttribute("cx","60"),a.setAttribute("cy","60"),a.setAttribute("stroke-width","8"),o.append(" ",i," ",a," "),r.append(" ",o," ");const l=e.createElement("div","lh-gauge__percentage"),s=e.createElement("div","lh-gauge__label");return n.append(" "," ",r," ",l," "," ",s," "),t.append(n),t}(e);case"gaugePwa":return function(e){const t=e.createFragment(),n=e.createElement("style");n.append("\n .lh-gauge--pwa .lh-gauge--pwa__component {\n display: none;\n }\n .lh-gauge--pwa__wrapper:not(.lh-badged--all) .lh-gauge--pwa__logo > path {\n /* Gray logo unless everything is passing. */\n fill: #B0B0B0;\n }\n\n .lh-gauge--pwa__disc {\n fill: var(--color-gray-200);\n }\n\n .lh-gauge--pwa__logo--primary-color {\n fill: #304FFE;\n }\n\n .lh-gauge--pwa__logo--secondary-color {\n fill: #3D3D3D;\n }\n .lh-dark .lh-gauge--pwa__logo--secondary-color {\n fill: #D8B6B6;\n }\n\n /* No passing groups. */\n .lh-gauge--pwa__wrapper:not([class*='lh-badged--']) .lh-gauge--pwa__na-line {\n display: inline;\n }\n /* Just optimized. Same n/a line as no passing groups. */\n .lh-gauge--pwa__wrapper.lh-badged--pwa-optimized:not(.lh-badged--pwa-installable) .lh-gauge--pwa__na-line {\n display: inline;\n }\n\n /* Just installable. */\n .lh-gauge--pwa__wrapper.lh-badged--pwa-installable .lh-gauge--pwa__installable-badge {\n display: inline;\n }\n\n /* All passing groups. */\n .lh-gauge--pwa__wrapper.lh-badged--all .lh-gauge--pwa__check-circle {\n display: inline;\n }\n "),t.append(n);const r=e.createElement("a","lh-gauge__wrapper lh-gauge--pwa__wrapper"),o=e.createElementNS("http://www.w3.org/2000/svg","svg","lh-gauge lh-gauge--pwa");o.setAttribute("viewBox","0 0 60 60");const i=e.createElementNS("http://www.w3.org/2000/svg","defs"),a=e.createElementNS("http://www.w3.org/2000/svg","linearGradient");a.setAttribute("id","lh-gauge--pwa__check-circle__gradient"),a.setAttribute("x1","50%"),a.setAttribute("y1","0%"),a.setAttribute("x2","50%"),a.setAttribute("y2","100%");const l=e.createElementNS("http://www.w3.org/2000/svg","stop");l.setAttribute("stop-color","#00C852"),l.setAttribute("offset","0%");const s=e.createElementNS("http://www.w3.org/2000/svg","stop");s.setAttribute("stop-color","#009688"),s.setAttribute("offset","100%"),a.append(" ",l," ",s," ");const c=e.createElementNS("http://www.w3.org/2000/svg","linearGradient");c.setAttribute("id","lh-gauge--pwa__installable__shadow-gradient"),c.setAttribute("x1","76.056%"),c.setAttribute("x2","24.111%"),c.setAttribute("y1","82.995%"),c.setAttribute("y2","24.735%");const d=e.createElementNS("http://www.w3.org/2000/svg","stop");d.setAttribute("stop-color","#A5D6A7"),d.setAttribute("offset","0%");const h=e.createElementNS("http://www.w3.org/2000/svg","stop");h.setAttribute("stop-color","#80CBC4"),h.setAttribute("offset","100%"),c.append(" ",d," ",h," ");const p=e.createElementNS("http://www.w3.org/2000/svg","g");p.setAttribute("id","lh-gauge--pwa__installable-badge");const u=e.createElementNS("http://www.w3.org/2000/svg","circle");u.setAttribute("fill","#FFFFFF"),u.setAttribute("cx","10"),u.setAttribute("cy","10"),u.setAttribute("r","10");const g=e.createElementNS("http://www.w3.org/2000/svg","path");g.setAttribute("fill","#009688"),g.setAttribute("d","M10 4.167A5.835 5.835 0 0 0 4.167 10 5.835 5.835 0 0 0 10 15.833 5.835 5.835 0 0 0 15.833 10 5.835 5.835 0 0 0 10 4.167zm2.917 6.416h-2.334v2.334H9.417v-2.334H7.083V9.417h2.334V7.083h1.166v2.334h2.334v1.166z"),p.append(" ",u," ",g," "),i.append(" ",a," ",c," ",p," ");const m=e.createElementNS("http://www.w3.org/2000/svg","g");m.setAttribute("stroke","none"),m.setAttribute("fill-rule","nonzero");const f=e.createElementNS("http://www.w3.org/2000/svg","circle","lh-gauge--pwa__disc");f.setAttribute("cx","30"),f.setAttribute("cy","30"),f.setAttribute("r","30");const v=e.createElementNS("http://www.w3.org/2000/svg","g","lh-gauge--pwa__logo"),b=e.createElementNS("http://www.w3.org/2000/svg","path","lh-gauge--pwa__logo--secondary-color");b.setAttribute("d","M35.66 19.39l.7-1.75h2L37.4 15 38.6 12l3.4 9h-2.51l-.58-1.61z");const _=e.createElementNS("http://www.w3.org/2000/svg","path","lh-gauge--pwa__logo--primary-color");_.setAttribute("d","M33.52 21l3.65-9h-2.42l-2.5 5.82L30.5 12h-1.86l-1.9 5.82-1.35-2.65-1.21 3.72L25.4 21h2.38l1.72-5.2 1.64 5.2z");const w=e.createElementNS("http://www.w3.org/2000/svg","path","lh-gauge--pwa__logo--secondary-color");w.setAttribute("fill-rule","nonzero"),w.setAttribute("d","M20.3 17.91h1.48c.45 0 .85-.05 1.2-.15l.39-1.18 1.07-3.3a2.64 2.64 0 0 0-.28-.37c-.55-.6-1.36-.91-2.42-.91H18v9h2.3V17.9zm1.96-3.84c.22.22.33.5.33.87 0 .36-.1.65-.29.87-.2.23-.59.35-1.15.35h-.86v-2.41h.87c.52 0 .89.1 1.1.32z"),v.append(" ",b," ",_," ",w," ");const y=e.createElementNS("http://www.w3.org/2000/svg","rect","lh-gauge--pwa__component lh-gauge--pwa__na-line");y.setAttribute("fill","#FFFFFF"),y.setAttribute("x","20"),y.setAttribute("y","32"),y.setAttribute("width","20"),y.setAttribute("height","4"),y.setAttribute("rx","2");const x=e.createElementNS("http://www.w3.org/2000/svg","g","lh-gauge--pwa__component lh-gauge--pwa__installable-badge");x.setAttribute("transform","translate(20, 29)");const k=e.createElementNS("http://www.w3.org/2000/svg","path");k.setAttribute("fill","url(#lh-gauge--pwa__installable__shadow-gradient)"),k.setAttribute("d","M33.629 19.487c-4.272 5.453-10.391 9.39-17.415 10.869L3 17.142 17.142 3 33.63 19.487z");const E=e.createElementNS("http://www.w3.org/2000/svg","use");E.setAttribute("href","#lh-gauge--pwa__installable-badge"),x.append(" ",k," ",E," ");const A=e.createElementNS("http://www.w3.org/2000/svg","g","lh-gauge--pwa__component lh-gauge--pwa__check-circle");A.setAttribute("transform","translate(18, 28)");const S=e.createElementNS("http://www.w3.org/2000/svg","circle");S.setAttribute("fill","#FFFFFF"),S.setAttribute("cx","12"),S.setAttribute("cy","12"),S.setAttribute("r","12");const z=e.createElementNS("http://www.w3.org/2000/svg","path");z.setAttribute("fill","url(#lh-gauge--pwa__check-circle__gradient)"),z.setAttribute("d","M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"),A.append(" ",S," ",z," "),m.append(" "," ",f," ",v," "," ",y," "," ",x," "," ",A," "),o.append(" ",i," ",m," ");const C=e.createElement("div","lh-gauge__label");return r.append(" ",o," ",C," "),t.append(r),t}(e);case"heading":return function(e){const t=e.createFragment(),n=e.createElement("style");n.append("\n /* CSS Fireworks. Originally by Eddie Lin\n https://codepen.io/paulirish/pen/yEVMbP\n */\n .lh-pyro {\n display: none;\n z-index: 1;\n pointer-events: none;\n }\n .lh-score100 .lh-pyro {\n display: block;\n }\n .lh-score100 .lh-lighthouse stop:first-child {\n stop-color: hsla(200, 12%, 95%, 0);\n }\n .lh-score100 .lh-lighthouse stop:last-child {\n stop-color: hsla(65, 81%, 76%, 1);\n }\n\n .lh-pyro > .lh-pyro-before, .lh-pyro > .lh-pyro-after {\n position: absolute;\n width: 5px;\n height: 5px;\n border-radius: 2.5px;\n box-shadow: 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff;\n animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;\n animation-delay: 1s, 1s, 1s;\n }\n\n .lh-pyro > .lh-pyro-after {\n animation-delay: 2.25s, 2.25s, 2.25s;\n animation-duration: 1.25s, 1.25s, 6.25s;\n }\n\n @keyframes bang {\n to {\n opacity: 1;\n box-shadow: -70px -115.67px #47ebbc, -28px -99.67px #eb47a4, 58px -31.67px #7eeb47, 13px -141.67px #eb47c5, -19px 6.33px #7347eb, -2px -74.67px #ebd247, 24px -151.67px #eb47e0, 57px -138.67px #b4eb47, -51px -104.67px #479eeb, 62px 8.33px #ebcf47, -93px 0.33px #d547eb, -16px -118.67px #47bfeb, 53px -84.67px #47eb83, 66px -57.67px #eb47bf, -93px -65.67px #91eb47, 30px -13.67px #86eb47, -2px -59.67px #83eb47, -44px 1.33px #eb47eb, 61px -58.67px #47eb73, 5px -22.67px #47e8eb, -66px -28.67px #ebe247, 42px -123.67px #eb5547, -75px 26.33px #7beb47, 15px -52.67px #a147eb, 36px -51.67px #eb8347, -38px -12.67px #eb5547, -46px -59.67px #47eb81, 78px -114.67px #eb47ba, 15px -156.67px #eb47bf, -36px 1.33px #eb4783, -72px -86.67px #eba147, 31px -46.67px #ebe247, -68px 29.33px #47e2eb, -55px 19.33px #ebe047, -56px 27.33px #4776eb, -13px -91.67px #eb5547, -47px -138.67px #47ebc7, -18px -96.67px #eb47ac, 11px -88.67px #4783eb, -67px -28.67px #47baeb, 53px 10.33px #ba47eb, 11px 19.33px #5247eb, -5px -11.67px #eb4791, -68px -4.67px #47eba7, 95px -37.67px #eb478b, -67px -162.67px #eb5d47, -54px -120.67px #eb6847, 49px -12.67px #ebe047, 88px 8.33px #47ebda, 97px 33.33px #eb8147, 6px -71.67px #ebbc47;\n }\n }\n @keyframes gravity {\n from {\n opacity: 1;\n }\n to {\n transform: translateY(80px);\n opacity: 0;\n }\n }\n @keyframes position {\n 0%, 19.9% {\n margin-top: 4%;\n margin-left: 47%;\n }\n 20%, 39.9% {\n margin-top: 7%;\n margin-left: 30%;\n }\n 40%, 59.9% {\n margin-top: 6%;\n margin-left: 70%;\n }\n 60%, 79.9% {\n margin-top: 3%;\n margin-left: 20%;\n }\n 80%, 99.9% {\n margin-top: 3%;\n margin-left: 80%;\n }\n }\n "),t.append(n);const r=e.createElement("div","lh-header-container"),o=e.createElement("div","lh-scores-wrapper-placeholder");return r.append(" ",o," "),t.append(r),t}(e);case"metric":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-metric"),r=e.createElement("div","lh-metric__innerwrap"),o=e.createElement("div","lh-metric__icon"),i=e.createElement("span","lh-metric__title"),a=e.createElement("div","lh-metric__value"),l=e.createElement("div","lh-metric__description");return r.append(" ",o," ",i," ",a," ",l," "),n.append(" ",r," "),t.append(n),t}(e);case"opportunity":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-audit lh-audit--load-opportunity"),r=e.createElement("details","lh-expandable-details"),o=e.createElement("summary"),i=e.createElement("div","lh-audit__header"),a=e.createElement("div","lh-load-opportunity__cols"),l=e.createElement("div","lh-load-opportunity__col lh-load-opportunity__col--one"),s=e.createElement("span","lh-audit__score-icon"),c=e.createElement("div","lh-audit__title");l.append(" ",s," ",c," ");const d=e.createElement("div","lh-load-opportunity__col lh-load-opportunity__col--two"),h=e.createElement("div","lh-load-opportunity__sparkline"),p=e.createElement("div","lh-sparkline"),u=e.createElement("div","lh-sparkline__bar");p.append(u),h.append(" ",p," ");const g=e.createElement("div","lh-audit__display-text"),m=e.createElement("div","lh-chevron-container");d.append(" ",h," ",g," ",m," "),a.append(" ",l," ",d," "),i.append(" ",a," "),o.append(" ",i," ");const f=e.createElement("div","lh-audit__description"),v=e.createElement("div","lh-audit__stackpacks");return r.append(" ",o," ",f," ",v," "),n.append(" ",r," "),t.append(n),t}(e);case"opportunityHeader":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-load-opportunity__header lh-load-opportunity__cols"),r=e.createElement("div","lh-load-opportunity__col lh-load-opportunity__col--one"),o=e.createElement("div","lh-load-opportunity__col lh-load-opportunity__col--two");return n.append(" ",r," ",o," "),t.append(n),t}(e);case"scorescale":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-scorescale"),r=e.createElement("span","lh-scorescale-range lh-scorescale-range--fail");r.append("0–49");const o=e.createElement("span","lh-scorescale-range lh-scorescale-range--average");o.append("50–89");const i=e.createElement("span","lh-scorescale-range lh-scorescale-range--pass");return i.append("90–100"),n.append(" ",r," ",o," ",i," "),t.append(n),t}(e);case"scoresWrapper":return function(e){const t=e.createFragment(),n=e.createElement("style");n.append("\n .lh-scores-container {\n display: flex;\n flex-direction: column;\n padding: var(--default-padding) 0;\n position: relative;\n width: 100%;\n }\n\n .lh-sticky-header {\n --gauge-circle-size: var(--gauge-circle-size-sm);\n --plugin-badge-size: 16px;\n --plugin-icon-size: 75%;\n --gauge-wrapper-width: 60px;\n --gauge-percentage-font-size: 13px;\n position: fixed;\n left: 0;\n right: 0;\n top: var(--topbar-height);\n font-weight: 500;\n display: none;\n justify-content: center;\n background-color: var(--sticky-header-background-color);\n border-bottom: 1px solid var(--color-gray-200);\n padding-top: var(--score-container-padding);\n padding-bottom: 4px;\n z-index: 1;\n pointer-events: none;\n }\n\n .lh-devtools .lh-sticky-header {\n /* The report within DevTools is placed in a container with overflow, which changes the placement of this header unless we change `position` to `sticky.` */\n position: sticky;\n }\n\n .lh-sticky-header--visible {\n display: grid;\n grid-auto-flow: column;\n pointer-events: auto;\n }\n\n /* Disable the gauge arc animation for the sticky header, so toggling display: none\n does not play the animation. */\n .lh-sticky-header .lh-gauge-arc {\n animation: none;\n }\n\n .lh-sticky-header .lh-gauge__label,\n .lh-sticky-header .lh-fraction__label {\n display: none;\n }\n\n .lh-highlighter {\n width: var(--gauge-wrapper-width);\n height: 1px;\n background-color: var(--highlighter-background-color);\n /* Position at bottom of first gauge in sticky header. */\n position: absolute;\n grid-column: 1;\n bottom: -1px;\n }\n\n .lh-gauge__wrapper:first-of-type {\n contain: none;\n }\n "),t.append(n);const r=e.createElement("div","lh-scores-wrapper"),o=e.createElement("div","lh-scores-container"),i=e.createElement("div","lh-pyro"),a=e.createElement("div","lh-pyro-before"),l=e.createElement("div","lh-pyro-after");return i.append(" ",a," ",l," "),o.append(" ",i," "),r.append(" ",o," "),t.append(r),t}(e);case"snippet":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-snippet"),r=e.createElement("style");return r.append('\n :root {\n --snippet-highlight-light: #fbf1f2;\n --snippet-highlight-dark: #ffd6d8;\n }\n\n .lh-snippet__header {\n position: relative;\n overflow: hidden;\n padding: 10px;\n border-bottom: none;\n color: var(--snippet-color);\n background-color: var(--snippet-background-color);\n border: 1px solid var(--report-border-color-secondary);\n }\n .lh-snippet__title {\n font-weight: bold;\n float: left;\n }\n .lh-snippet__node {\n float: left;\n margin-left: 4px;\n }\n .lh-snippet__toggle-expand {\n padding: 1px 7px;\n margin-top: -1px;\n margin-right: -7px;\n float: right;\n background: transparent;\n border: none;\n cursor: pointer;\n font-size: 14px;\n color: #0c50c7;\n }\n\n .lh-snippet__snippet {\n overflow: auto;\n border: 1px solid var(--report-border-color-secondary);\n }\n /* Container needed so that all children grow to the width of the scroll container */\n .lh-snippet__snippet-inner {\n display: inline-block;\n min-width: 100%;\n }\n\n .lh-snippet:not(.lh-snippet--expanded) .lh-snippet__show-if-expanded {\n display: none;\n }\n .lh-snippet.lh-snippet--expanded .lh-snippet__show-if-collapsed {\n display: none;\n }\n\n .lh-snippet__line {\n background: white;\n white-space: pre;\n display: flex;\n }\n .lh-snippet__line:not(.lh-snippet__line--message):first-child {\n padding-top: 4px;\n }\n .lh-snippet__line:not(.lh-snippet__line--message):last-child {\n padding-bottom: 4px;\n }\n .lh-snippet__line--content-highlighted {\n background: var(--snippet-highlight-dark);\n }\n .lh-snippet__line--message {\n background: var(--snippet-highlight-light);\n }\n .lh-snippet__line--message .lh-snippet__line-number {\n padding-top: 10px;\n padding-bottom: 10px;\n }\n .lh-snippet__line--message code {\n padding: 10px;\n padding-left: 5px;\n color: var(--color-fail);\n font-family: var(--report-font-family);\n }\n .lh-snippet__line--message code {\n white-space: normal;\n }\n .lh-snippet__line-icon {\n padding-top: 10px;\n display: none;\n }\n .lh-snippet__line--message .lh-snippet__line-icon {\n display: block;\n }\n .lh-snippet__line-icon:before {\n content: "";\n display: inline-block;\n vertical-align: middle;\n margin-right: 4px;\n width: var(--score-icon-size);\n height: var(--score-icon-size);\n background-image: var(--fail-icon-url);\n }\n .lh-snippet__line-number {\n flex-shrink: 0;\n width: 40px;\n text-align: right;\n font-family: monospace;\n padding-right: 5px;\n margin-right: 5px;\n color: var(--color-gray-600);\n user-select: none;\n }\n '),n.append(" ",r," "),t.append(n),t}(e);case"snippetContent":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-snippet__snippet"),r=e.createElement("div","lh-snippet__snippet-inner");return n.append(" ",r," "),t.append(n),t}(e);case"snippetHeader":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-snippet__header"),r=e.createElement("div","lh-snippet__title"),o=e.createElement("div","lh-snippet__node"),i=e.createElement("button","lh-snippet__toggle-expand"),a=e.createElement("span","lh-snippet__btn-label-collapse lh-snippet__show-if-expanded"),l=e.createElement("span","lh-snippet__btn-label-expand lh-snippet__show-if-collapsed");return i.append(" ",a," ",l," "),n.append(" ",r," ",o," ",i," "),t.append(n),t}(e);case"snippetLine":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-snippet__line"),r=e.createElement("div","lh-snippet__line-number"),o=e.createElement("div","lh-snippet__line-icon"),i=e.createElement("code");return n.append(" ",r," ",o," ",i," "),t.append(n),t}(e);case"styles":return function(e){const t=e.createFragment(),n=e.createElement("style");return n.append('/**\n * @license\n * Copyright 2017 The Lighthouse Authors. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the "License");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an "AS-IS" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n/*\n Naming convention:\n\n If a variable is used for a specific component: --{component}-{property name}-{modifier}\n\n Both {component} and {property name} should be kebab-case. If the target is the entire page,\n use \'report\' for the component. The property name should not be abbreviated. Use the\n property name the variable is intended for - if it\'s used for multiple, a common descriptor\n is fine (ex: \'size\' for a variable applied to \'width\' and \'height\'). If a variable is shared\n across multiple components, either create more variables or just drop the "{component}-"\n part of the name. Append any modifiers at the end (ex: \'big\', \'dark\').\n\n For colors: --color-{hue}-{intensity}\n\n {intensity} is the Material Design tag - 700, A700, etc.\n*/\n.lh-vars {\n /* Palette using Material Design Colors\n * https://www.materialui.co/colors */\n --color-amber-50: #FFF8E1;\n --color-blue-200: #90CAF9;\n --color-blue-900: #0D47A1;\n --color-blue-A700: #2962FF;\n --color-blue-primary: #06f;\n --color-cyan-500: #00BCD4;\n --color-gray-100: #F5F5F5;\n --color-gray-300: #CFCFCF;\n --color-gray-200: #E0E0E0;\n --color-gray-400: #BDBDBD;\n --color-gray-50: #FAFAFA;\n --color-gray-500: #9E9E9E;\n --color-gray-600: #757575;\n --color-gray-700: #616161;\n --color-gray-800: #424242;\n --color-gray-900: #212121;\n --color-gray: #000000;\n --color-green-700: #080;\n --color-green: #0c6;\n --color-lime-400: #D3E156;\n --color-orange-50: #FFF3E0;\n --color-orange-700: #C33300;\n --color-orange: #fa3;\n --color-red-700: #c00;\n --color-red: #f33;\n --color-teal-600: #00897B;\n --color-white: #FFFFFF;\n\n /* Context-specific colors */\n --color-average-secondary: var(--color-orange-700);\n --color-average: var(--color-orange);\n --color-fail-secondary: var(--color-red-700);\n --color-fail: var(--color-red);\n --color-hover: var(--color-gray-50);\n --color-informative: var(--color-blue-900);\n --color-pass-secondary: var(--color-green-700);\n --color-pass: var(--color-green);\n --color-not-applicable: var(--color-gray-600);\n\n /* Component variables */\n --audit-description-padding-left: calc(var(--score-icon-size) + var(--score-icon-margin-left) + var(--score-icon-margin-right));\n --audit-explanation-line-height: 16px;\n --audit-group-margin-bottom: calc(var(--default-padding) * 6);\n --audit-group-padding-vertical: 8px;\n --audit-margin-horizontal: 5px;\n --audit-padding-vertical: 8px;\n --category-padding: calc(var(--default-padding) * 6) var(--edge-gap-padding) calc(var(--default-padding) * 4);\n --chevron-line-stroke: var(--color-gray-600);\n --chevron-size: 12px;\n --default-padding: 8px;\n --edge-gap-padding: calc(var(--default-padding) * 4);\n --env-item-background-color: var(--color-gray-100);\n --env-item-font-size: 28px;\n --env-item-line-height: 36px;\n --env-item-padding: 10px 0px;\n --env-name-min-width: 220px;\n --footer-padding-vertical: 16px;\n --gauge-circle-size-big: 96px;\n --gauge-circle-size: 48px;\n --gauge-circle-size-sm: 32px;\n --gauge-label-font-size-big: 18px;\n --gauge-label-font-size: var(--report-font-size-secondary);\n --gauge-label-line-height-big: 24px;\n --gauge-label-line-height: var(--report-line-height-secondary);\n --gauge-percentage-font-size-big: 38px;\n --gauge-percentage-font-size: var(--report-font-size-secondary);\n --gauge-wrapper-width: 120px;\n --header-line-height: 24px;\n --highlighter-background-color: var(--report-text-color);\n --icon-square-size: calc(var(--score-icon-size) * 0.88);\n --image-preview-size: 48px;\n --link-color: var(--color-blue-primary);\n --locale-selector-background-color: var(--color-white);\n --metric-toggle-lines-fill: #7F7F7F;\n --metric-value-font-size: calc(var(--report-font-size) * 1.8);\n --metrics-toggle-background-color: var(--color-gray-200);\n --plugin-badge-background-color: var(--color-white);\n --plugin-badge-size-big: calc(var(--gauge-circle-size-big) / 2.7);\n --plugin-badge-size: calc(var(--gauge-circle-size) / 2.7);\n --plugin-icon-size: 65%;\n --pwa-icon-margin: 0 var(--default-padding);\n --pwa-icon-size: var(--topbar-logo-size);\n --report-background-color: #fff;\n --report-border-color-secondary: #ebebeb;\n --report-font-family-monospace: \'Roboto Mono\', \'Menlo\', \'dejavu sans mono\', \'Consolas\', \'Lucida Console\', monospace;\n --report-font-family: Roboto, Helvetica, Arial, sans-serif;\n --report-font-size: 14px;\n --report-font-size-secondary: 12px;\n --report-icon-size: var(--score-icon-background-size);\n --report-line-height: 24px;\n --report-line-height-secondary: 20px;\n --report-monospace-font-size: calc(var(--report-font-size) * 0.85);\n --report-text-color-secondary: var(--color-gray-800);\n --report-text-color: var(--color-gray-900);\n --report-content-max-width: calc(60 * var(--report-font-size)); /* defaults to 840px */\n --report-content-min-width: 360px;\n --report-content-max-width-minus-edge-gap: calc(var(--report-content-max-width) - var(--edge-gap-padding) * 2);\n --score-container-padding: 8px;\n --score-icon-background-size: 24px;\n --score-icon-margin-left: 6px;\n --score-icon-margin-right: 14px;\n --score-icon-margin: 0 var(--score-icon-margin-right) 0 var(--score-icon-margin-left);\n --score-icon-size: 12px;\n --score-icon-size-big: 16px;\n --screenshot-overlay-background: rgba(0, 0, 0, 0.3);\n --section-padding-vertical: calc(var(--default-padding) * 6);\n --snippet-background-color: var(--color-gray-50);\n --snippet-color: #0938C2;\n --sparkline-height: 5px;\n --stackpack-padding-horizontal: 10px;\n --sticky-header-background-color: var(--report-background-color);\n --sticky-header-buffer: calc(var(--topbar-height) + var(--sticky-header-height));\n --sticky-header-height: calc(var(--gauge-circle-size-sm) + var(--score-container-padding) * 2);\n --table-group-header-background-color: #EEF1F4;\n --table-group-header-text-color: var(--color-gray-700);\n --table-higlight-background-color: #F5F7FA;\n --tools-icon-color: var(--color-gray-600);\n --topbar-background-color: var(--color-white);\n --topbar-height: 32px;\n --topbar-logo-size: 24px;\n --topbar-padding: 0 8px;\n --toplevel-warning-background-color: hsla(30, 100%, 75%, 10%);\n --toplevel-warning-message-text-color: var(--color-average-secondary);\n --toplevel-warning-padding: 18px;\n --toplevel-warning-text-color: var(--report-text-color);\n\n /* SVGs */\n --plugin-icon-url-dark: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24" fill="%23FFFFFF"><path d="M0 0h24v24H0z" fill="none"/><path d="M20.5 11H19V7c0-1.1-.9-2-2-2h-4V3.5C13 2.12 11.88 1 10.5 1S8 2.12 8 3.5V5H4c-1.1 0-1.99.9-1.99 2v3.8H3.5c1.49 0 2.7 1.21 2.7 2.7s-1.21 2.7-2.7 2.7H2V20c0 1.1.9 2 2 2h3.8v-1.5c0-1.49 1.21-2.7 2.7-2.7 1.49 0 2.7 1.21 2.7 2.7V22H17c1.1 0 2-.9 2-2v-4h1.5c1.38 0 2.5-1.12 2.5-2.5S21.88 11 20.5 11z"/></svg>\');\n --plugin-icon-url: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24" fill="%23757575"><path d="M0 0h24v24H0z" fill="none"/><path d="M20.5 11H19V7c0-1.1-.9-2-2-2h-4V3.5C13 2.12 11.88 1 10.5 1S8 2.12 8 3.5V5H4c-1.1 0-1.99.9-1.99 2v3.8H3.5c1.49 0 2.7 1.21 2.7 2.7s-1.21 2.7-2.7 2.7H2V20c0 1.1.9 2 2 2h3.8v-1.5c0-1.49 1.21-2.7 2.7-2.7 1.49 0 2.7 1.21 2.7 2.7V22H17c1.1 0 2-.9 2-2v-4h1.5c1.38 0 2.5-1.12 2.5-2.5S21.88 11 20.5 11z"/></svg>\');\n\n --pass-icon-url: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><title>check</title><path fill="%23178239" d="M24 4C12.95 4 4 12.95 4 24c0 11.04 8.95 20 20 20 11.04 0 20-8.96 20-20 0-11.05-8.96-20-20-20zm-4 30L10 24l2.83-2.83L20 28.34l15.17-15.17L38 16 20 34z"/></svg>\');\n --average-icon-url: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><title>info</title><path fill="%23E67700" d="M24 4C12.95 4 4 12.95 4 24s8.95 20 20 20 20-8.95 20-20S35.05 4 24 4zm2 30h-4V22h4v12zm0-16h-4v-4h4v4z"/></svg>\');\n --fail-icon-url: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><title>warn</title><path fill="%23C7221F" d="M2 42h44L24 4 2 42zm24-6h-4v-4h4v4zm0-8h-4v-8h4v8z"/></svg>\');\n --error-icon-url: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 3 15"><title>error</title><path d="M0 15H 3V 12H 0V" fill="%23FF4E42"/><path d="M0 9H 3V 0H 0V" fill="%23FF4E42"/></svg>\');\n\n --pwa-installable-gray-url: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="nonzero"><circle fill="%23DAE0E3" cx="12" cy="12" r="12"/><path d="M12 5a7 7 0 1 0 0 14 7 7 0 0 0 0-14zm3.5 7.7h-2.8v2.8h-1.4v-2.8H8.5v-1.4h2.8V8.5h1.4v2.8h2.8v1.4z" fill="%23FFF"/></g></svg>\');\n --pwa-optimized-gray-url: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><rect fill="%23DAE0E3" width="24" height="24" rx="12"/><path fill="%23FFF" d="M12 15.07l3.6 2.18-.95-4.1 3.18-2.76-4.2-.36L12 6.17l-1.64 3.86-4.2.36 3.2 2.76-.96 4.1z"/><path d="M5 5h14v14H5z"/></g></svg>\');\n\n --pwa-installable-gray-url-dark: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="nonzero"><circle fill="%23424242" cx="12" cy="12" r="12"/><path d="M12 5a7 7 0 1 0 0 14 7 7 0 0 0 0-14zm3.5 7.7h-2.8v2.8h-1.4v-2.8H8.5v-1.4h2.8V8.5h1.4v2.8h2.8v1.4z" fill="%23FFF"/></g></svg>\');\n --pwa-optimized-gray-url-dark: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><rect fill="%23424242" width="24" height="24" rx="12"/><path fill="%23FFF" d="M12 15.07l3.6 2.18-.95-4.1 3.18-2.76-4.2-.36L12 6.17l-1.64 3.86-4.2.36 3.2 2.76-.96 4.1z"/><path d="M5 5h14v14H5z"/></g></svg>\');\n\n --pwa-installable-color-url: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><g fill-rule="nonzero" fill="none"><circle fill="%230CCE6B" cx="12" cy="12" r="12"/><path d="M12 5a7 7 0 1 0 0 14 7 7 0 0 0 0-14zm3.5 7.7h-2.8v2.8h-1.4v-2.8H8.5v-1.4h2.8V8.5h1.4v2.8h2.8v1.4z" fill="%23FFF"/></g></svg>\');\n --pwa-optimized-color-url: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><rect fill="%230CCE6B" width="24" height="24" rx="12"/><path d="M5 5h14v14H5z"/><path fill="%23FFF" d="M12 15.07l3.6 2.18-.95-4.1 3.18-2.76-4.2-.36L12 6.17l-1.64 3.86-4.2.36 3.2 2.76-.96 4.1z"/></g></svg>\');\n\n --swap-locale-icon-url: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M12.87 15.07l-2.54-2.51.03-.03c1.74-1.94 2.98-4.17 3.71-6.53H17V4h-7V2H8v2H1v1.99h11.17C11.5 7.92 10.44 9.75 9 11.35 8.07 10.32 7.3 9.19 6.69 8h-2c.73 1.63 1.73 3.17 2.98 4.56l-5.09 5.02L4 19l5-5 3.11 3.11.76-2.04zM18.5 10h-2L12 22h2l1.12-3h4.75L21 22h2l-4.5-12zm-2.62 7l1.62-4.33L19.12 17h-3.24z"/></svg>\');\n}\n\n@media not print {\n .lh-dark {\n /* Pallete */\n --color-gray-200: var(--color-gray-800);\n --color-gray-300: #616161;\n --color-gray-400: var(--color-gray-600);\n --color-gray-700: var(--color-gray-400);\n --color-gray-50: #757575;\n --color-gray-600: var(--color-gray-500);\n --color-green-700: var(--color-green);\n --color-orange-700: var(--color-orange);\n --color-red-700: var(--color-red);\n --color-teal-600: var(--color-cyan-500);\n\n /* Context-specific colors */\n --color-hover: rgba(0, 0, 0, 0.2);\n --color-informative: var(--color-blue-200);\n\n /* Component variables */\n --env-item-background-color: #393535;\n --link-color: var(--color-blue-200);\n --locale-selector-background-color: var(--color-gray-200);\n --plugin-badge-background-color: var(--color-gray-800);\n --report-background-color: var(--color-gray-900);\n --report-border-color-secondary: var(--color-gray-200);\n --report-text-color-secondary: var(--color-gray-400);\n --report-text-color: var(--color-gray-100);\n --snippet-color: var(--color-cyan-500);\n --topbar-background-color: var(--color-gray);\n --toplevel-warning-background-color: hsl(33deg 14% 18%);\n --toplevel-warning-message-text-color: var(--color-orange-700);\n --toplevel-warning-text-color: var(--color-gray-100);\n --table-group-header-background-color: rgba(186, 196, 206, 0.15);\n --table-group-header-text-color: var(--color-gray-100);\n --table-higlight-background-color: rgba(186, 196, 206, 0.09);\n\n /* SVGs */\n --plugin-icon-url: var(--plugin-icon-url-dark);\n --pwa-installable-gray-url: var(--pwa-installable-gray-url-dark);\n --pwa-optimized-gray-url: var(--pwa-optimized-gray-url-dark);\n }\n}\n\n@media only screen and (max-width: 480px) {\n .lh-vars {\n --audit-group-margin-bottom: 20px;\n --edge-gap-padding: var(--default-padding);\n --env-name-min-width: 120px;\n --gauge-circle-size-big: 96px;\n --gauge-circle-size: 72px;\n --gauge-label-font-size-big: 22px;\n --gauge-label-font-size: 14px;\n --gauge-label-line-height-big: 26px;\n --gauge-label-line-height: 20px;\n --gauge-percentage-font-size-big: 34px;\n --gauge-percentage-font-size: 26px;\n --gauge-wrapper-width: 112px;\n --header-padding: 16px 0 16px 0;\n --image-preview-size: 24px;\n --plugin-icon-size: 75%;\n --pwa-icon-margin: 0 7px 0 -3px;\n --report-font-size: 14px;\n --report-line-height: 20px;\n --score-icon-margin-left: 2px;\n --score-icon-size: 10px;\n --topbar-height: 28px;\n --topbar-logo-size: 20px;\n }\n\n /* Not enough space to adequately show the relative savings bars. */\n .lh-sparkline {\n display: none;\n }\n}\n\n.lh-vars.lh-devtools {\n --audit-explanation-line-height: 14px;\n --audit-group-margin-bottom: 20px;\n --audit-group-padding-vertical: 12px;\n --audit-padding-vertical: 4px;\n --category-padding: 12px;\n --default-padding: 12px;\n --env-name-min-width: 120px;\n --footer-padding-vertical: 8px;\n --gauge-circle-size-big: 72px;\n --gauge-circle-size: 64px;\n --gauge-label-font-size-big: 22px;\n --gauge-label-font-size: 14px;\n --gauge-label-line-height-big: 26px;\n --gauge-label-line-height: 20px;\n --gauge-percentage-font-size-big: 34px;\n --gauge-percentage-font-size: 26px;\n --gauge-wrapper-width: 97px;\n --header-line-height: 20px;\n --header-padding: 16px 0 16px 0;\n --screenshot-overlay-background: transparent;\n --plugin-icon-size: 75%;\n --pwa-icon-margin: 0 7px 0 -3px;\n --report-font-family-monospace: \'Menlo\', \'dejavu sans mono\', \'Consolas\', \'Lucida Console\', monospace;\n --report-font-family: \'.SFNSDisplay-Regular\', \'Helvetica Neue\', \'Lucida Grande\', sans-serif;\n --report-font-size: 12px;\n --report-line-height: 20px;\n --score-icon-margin-left: 2px;\n --score-icon-size: 10px;\n --section-padding-vertical: 8px;\n}\n\n.lh-container:not(.lh-topbar + .lh-container) {\n --topbar-height: 0;\n --sticky-header-height: 0;\n --sticky-header-buffer: 0;\n}\n\n.lh-devtools.lh-root {\n height: 100%;\n}\n.lh-devtools.lh-root img {\n /* Override devtools default \'min-width: 0\' so svg without size in a flexbox isn\'t collapsed. */\n min-width: auto;\n}\n.lh-devtools .lh-container {\n overflow-y: scroll;\n height: calc(100% - var(--topbar-height));\n /** The .lh-container is the scroll parent in DevTools so we exclude the topbar from the sticky header buffer. */\n --sticky-header-buffer: calc(var(--sticky-header-height));\n}\n@media print {\n .lh-devtools .lh-container {\n overflow: unset;\n }\n}\n.lh-devtools .lh-sticky-header {\n /* This is normally the height of the topbar, but we want it to stick to the top of our scroll container .lh-container` */\n top: 0;\n}\n.lh-devtools .lh-element-screenshot__overlay {\n position: absolute;\n}\n\n@keyframes fadeIn {\n 0% { opacity: 0;}\n 100% { opacity: 0.6;}\n}\n\n.lh-root *, .lh-root *::before, .lh-root *::after {\n box-sizing: border-box;\n}\n\n.lh-root {\n font-family: var(--report-font-family);\n font-size: var(--report-font-size);\n margin: 0;\n line-height: var(--report-line-height);\n background: var(--report-background-color);\n color: var(--report-text-color);\n}\n\n.lh-root :focus-visible {\n outline: -webkit-focus-ring-color auto 3px;\n}\n.lh-root summary:focus {\n outline: none;\n box-shadow: 0 0 0 1px hsl(217, 89%, 61%);\n}\n\n.lh-root [hidden] {\n display: none !important;\n}\n\n.lh-root pre {\n margin: 0;\n}\n\n.lh-root pre,\n.lh-root code {\n font-family: var(--report-font-family-monospace);\n}\n\n.lh-root details > summary {\n cursor: pointer;\n}\n\n.lh-hidden {\n display: none !important;\n}\n\n.lh-container {\n /*\n Text wrapping in the report is so much FUN!\n We have a `word-break: break-word;` globally here to prevent a few common scenarios, namely\n long non-breakable text (usually URLs) found in:\n 1. The footer\n 2. .lh-node (outerHTML)\n 3. .lh-code\n\n With that sorted, the next challenge is appropriate column sizing and text wrapping inside our\n .lh-details tables. Even more fun.\n * We don\'t want table headers ("Potential Savings (ms)") to wrap or their column values, but\n we\'d be happy for the URL column to wrap if the URLs are particularly long.\n * We want the narrow columns to remain narrow, providing the most column width for URL\n * We don\'t want the table to extend past 100% width.\n * Long URLs in the URL column can wrap. Util.getURLDisplayName maxes them out at 64 characters,\n but they do not get any overflow:ellipsis treatment.\n */\n word-break: break-word;\n}\n\n.lh-audit-group a,\n.lh-category-header__description a,\n.lh-audit__description a,\n.lh-warnings a,\n.lh-footer a,\n.lh-table-column--link a {\n color: var(--link-color);\n}\n\n.lh-audit__description, .lh-audit__stackpack {\n --inner-audit-padding-right: var(--stackpack-padding-horizontal);\n padding-left: var(--audit-description-padding-left);\n padding-right: var(--inner-audit-padding-right);\n padding-top: 8px;\n padding-bottom: 8px;\n}\n\n.lh-details {\n margin-top: var(--default-padding);\n margin-bottom: var(--default-padding);\n margin-left: var(--audit-description-padding-left);\n /* whatever the .lh-details side margins are */\n width: 100%;\n}\n\n.lh-audit__stackpack {\n display: flex;\n align-items: center;\n}\n\n.lh-audit__stackpack__img {\n max-width: 30px;\n margin-right: var(--default-padding)\n}\n\n/* Report header */\n\n.lh-report-icon {\n display: flex;\n align-items: center;\n padding: 10px 12px;\n cursor: pointer;\n}\n.lh-report-icon[disabled] {\n opacity: 0.3;\n pointer-events: none;\n}\n\n.lh-report-icon::before {\n content: "";\n margin: 4px;\n background-repeat: no-repeat;\n width: var(--report-icon-size);\n height: var(--report-icon-size);\n opacity: 0.7;\n display: inline-block;\n vertical-align: middle;\n}\n.lh-report-icon:hover::before {\n opacity: 1;\n}\n.lh-dark .lh-report-icon::before {\n filter: invert(1);\n}\n.lh-report-icon--print::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 8H5c-1.66 0-3 1.34-3 3v6h4v4h12v-4h4v-6c0-1.66-1.34-3-3-3zm-3 11H8v-5h8v5zm3-7c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zm-1-9H6v4h12V3z"/><path fill="none" d="M0 0h24v24H0z"/></svg>\');\n}\n.lh-report-icon--copy::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M0 0h24v24H0z" fill="none"/><path d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"/></svg>\');\n}\n.lh-report-icon--open::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 4H5c-1.11 0-2 .9-2 2v12c0 1.1.89 2 2 2h4v-2H5V8h14v10h-4v2h4c1.1 0 2-.9 2-2V6c0-1.1-.89-2-2-2zm-7 6l-4 4h3v6h2v-6h3l-4-4z"/></svg>\');\n}\n.lh-report-icon--download::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"/><path d="M0 0h24v24H0z" fill="none"/></svg>\');\n}\n.lh-report-icon--dark::before {\n background-image:url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 100 125"><path d="M50 23.587c-16.27 0-22.799 12.574-22.799 21.417 0 12.917 10.117 22.451 12.436 32.471h20.726c2.32-10.02 12.436-19.554 12.436-32.471 0-8.843-6.528-21.417-22.799-21.417zM39.637 87.161c0 3.001 1.18 4.181 4.181 4.181h.426l.41 1.231C45.278 94.449 46.042 95 48.019 95h3.963c1.978 0 2.74-.551 3.365-2.427l.409-1.231h.427c3.002 0 4.18-1.18 4.18-4.181V80.91H39.637v6.251zM50 18.265c1.26 0 2.072-.814 2.072-2.073v-9.12C52.072 5.813 51.26 5 50 5c-1.259 0-2.072.813-2.072 2.073v9.12c0 1.259.813 2.072 2.072 2.072zM68.313 23.727c.994.774 2.135.634 2.91-.357l5.614-7.187c.776-.992.636-2.135-.356-2.909-.992-.776-2.135-.636-2.91.357l-5.613 7.186c-.778.993-.636 2.135.355 2.91zM91.157 36.373c-.306-1.222-1.291-1.815-2.513-1.51l-8.85 2.207c-1.222.305-1.814 1.29-1.51 2.512.305 1.223 1.291 1.814 2.513 1.51l8.849-2.206c1.223-.305 1.816-1.291 1.511-2.513zM86.757 60.48l-8.331-3.709c-1.15-.512-2.225-.099-2.736 1.052-.512 1.151-.1 2.224 1.051 2.737l8.33 3.707c1.15.514 2.225.101 2.736-1.05.513-1.149.1-2.223-1.05-2.737zM28.779 23.37c.775.992 1.917 1.131 2.909.357.992-.776 1.132-1.917.357-2.91l-5.615-7.186c-.775-.992-1.917-1.132-2.909-.357s-1.131 1.917-.356 2.909l5.614 7.187zM21.715 39.583c.305-1.223-.288-2.208-1.51-2.513l-8.849-2.207c-1.222-.303-2.208.289-2.513 1.511-.303 1.222.288 2.207 1.511 2.512l8.848 2.206c1.222.304 2.208-.287 2.513-1.509zM21.575 56.771l-8.331 3.711c-1.151.511-1.563 1.586-1.05 2.735.511 1.151 1.586 1.563 2.736 1.052l8.331-3.711c1.151-.511 1.563-1.586 1.05-2.735-.512-1.15-1.585-1.562-2.736-1.052z"/></svg>\');\n}\n.lh-report-icon--treemap::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="black"><path d="M3 5v14h19V5H3zm2 2h15v4H5V7zm0 10v-4h4v4H5zm6 0v-4h9v4h-9z"/></svg>\');\n}\n.lh-report-icon--date::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 11h2v2H7v-2zm14-5v14a2 2 0 01-2 2H5a2 2 0 01-2-2V6c0-1.1.9-2 2-2h1V2h2v2h8V2h2v2h1a2 2 0 012 2zM5 8h14V6H5v2zm14 12V10H5v10h14zm-4-7h2v-2h-2v2zm-4 0h2v-2h-2v2z"/></svg>\');\n}\n.lh-report-icon--devices::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 6h18V4H4a2 2 0 00-2 2v11H0v3h14v-3H4V6zm19 2h-6a1 1 0 00-1 1v10c0 .6.5 1 1 1h6c.6 0 1-.5 1-1V9c0-.6-.5-1-1-1zm-1 9h-4v-7h4v7z"/></svg>\');\n}\n.lh-report-icon--world::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm7 6h-3c-.3-1.3-.8-2.5-1.4-3.6A8 8 0 0 1 18.9 8zm-7-4a14 14 0 0 1 2 4h-4a14 14 0 0 1 2-4zM4.3 14a8.2 8.2 0 0 1 0-4h3.3a16.5 16.5 0 0 0 0 4H4.3zm.8 2h3a14 14 0 0 0 1.3 3.6A8 8 0 0 1 5.1 16zm3-8H5a8 8 0 0 1 4.3-3.6L8 8zM12 20a14 14 0 0 1-2-4h4a14 14 0 0 1-2 4zm2.3-6H9.7a14.7 14.7 0 0 1 0-4h4.6a14.6 14.6 0 0 1 0 4zm.3 5.6c.6-1.2 1-2.4 1.4-3.6h3a8 8 0 0 1-4.4 3.6zm1.8-5.6a16.5 16.5 0 0 0 0-4h3.3a8.2 8.2 0 0 1 0 4h-3.3z"/></svg>\');\n}\n.lh-report-icon--stopwatch::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15 1H9v2h6V1zm-4 13h2V8h-2v6zm8.1-6.6L20.5 6l-1.4-1.4L17.7 6A9 9 0 0 0 3 13a9 9 0 1 0 16-5.6zm-7 12.6a7 7 0 1 1 0-14 7 7 0 0 1 0 14z"/></svg>\');\n}\n.lh-report-icon--networkspeed::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15.9 5c-.2 0-.3 0-.4.2v.2L10.1 17a2 2 0 0 0-.2 1 2 2 0 0 0 4 .4l2.4-12.9c0-.3-.2-.5-.5-.5zM1 9l2 2c2.9-2.9 6.8-4 10.5-3.6l1.2-2.7C10 3.8 4.7 5.3 1 9zm20 2 2-2a15.4 15.4 0 0 0-5.6-3.6L17 8.2c1.5.7 2.9 1.6 4.1 2.8zm-4 4 2-2a9.9 9.9 0 0 0-2.7-1.9l-.5 3 1.2.9zM5 13l2 2a7.1 7.1 0 0 1 4-2l1.3-2.9C9.7 10.1 7 11 5 13z"/></svg>\');\n}\n.lh-report-icon--samples-one::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="7" cy="14" r="3"/><path d="M7 18a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm4-2a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm5.6 17.6a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/></svg>\');\n}\n.lh-report-icon--samples-many::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 18a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm4-2a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm5.6 17.6a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/><circle cx="7" cy="14" r="3"/><circle cx="11" cy="6" r="3"/></svg>\');\n}\n.lh-report-icon--chrome::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-50 -50 562 562"><path d="M256 25.6v25.6a204 204 0 0 1 144.8 60 204 204 0 0 1 60 144.8 204 204 0 0 1-60 144.8 204 204 0 0 1-144.8 60 204 204 0 0 1-144.8-60 204 204 0 0 1-60-144.8 204 204 0 0 1 60-144.8 204 204 0 0 1 144.8-60V0a256 256 0 1 0 0 512 256 256 0 0 0 0-512v25.6z"/><path d="M256 179.2v25.6a51.3 51.3 0 0 1 0 102.4 51.3 51.3 0 0 1 0-102.4v-51.2a102.3 102.3 0 1 0-.1 204.7 102.3 102.3 0 0 0 .1-204.7v25.6z"/><path d="M256 204.8h217.6a25.6 25.6 0 0 0 0-51.2H256a25.6 25.6 0 0 0 0 51.2m44.3 76.8L191.5 470.1a25.6 25.6 0 1 0 44.4 25.6l108.8-188.5a25.6 25.6 0 1 0-44.4-25.6m-88.6 0L102.9 93.2a25.7 25.7 0 0 0-35-9.4 25.7 25.7 0 0 0-9.4 35l108.8 188.5a25.7 25.7 0 0 0 35 9.4 25.9 25.9 0 0 0 9.4-35.1"/></svg>\');\n}\n.lh-report-icon--external::before {\n background-image: url(\'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><path d="M3.15 11.9a1.01 1.01 0 0 1-.743-.307 1.01 1.01 0 0 1-.306-.743v-7.7c0-.292.102-.54.306-.744a1.01 1.01 0 0 1 .744-.306H7v1.05H3.15v7.7h7.7V7h1.05v3.85c0 .291-.103.54-.307.743a1.01 1.01 0 0 1-.743.307h-7.7Zm2.494-2.8-.743-.744 5.206-5.206H8.401V2.1h3.5v3.5h-1.05V3.893L5.644 9.1Z"/></svg>\');\n}\n\n.lh-buttons {\n display: flex;\n flex-wrap: wrap;\n margin: var(--default-padding) 0;\n}\n.lh-button {\n height: 32px;\n border: 1px solid var(--report-border-color-secondary);\n border-radius: 3px;\n color: var(--link-color);\n background-color: var(--report-background-color);\n margin: 5px;\n}\n\n.lh-button:first-of-type {\n margin-left: 0;\n}\n\n/* Node */\n.lh-node__snippet {\n font-family: var(--report-font-family-monospace);\n color: var(--snippet-color);\n font-size: var(--report-monospace-font-size);\n line-height: 20px;\n}\n\n/* Score */\n\n.lh-audit__score-icon {\n width: var(--score-icon-size);\n height: var(--score-icon-size);\n margin: var(--score-icon-margin);\n}\n\n.lh-audit--pass .lh-audit__display-text {\n color: var(--color-pass-secondary);\n}\n.lh-audit--pass .lh-audit__score-icon,\n.lh-scorescale-range--pass::before {\n border-radius: 100%;\n background: var(--color-pass);\n}\n\n.lh-audit--average .lh-audit__display-text {\n color: var(--color-average-secondary);\n}\n.lh-audit--average .lh-audit__score-icon,\n.lh-scorescale-range--average::before {\n background: var(--color-average);\n width: var(--icon-square-size);\n height: var(--icon-square-size);\n}\n\n.lh-audit--fail .lh-audit__display-text {\n color: var(--color-fail-secondary);\n}\n.lh-audit--fail .lh-audit__score-icon,\n.lh-audit--error .lh-audit__score-icon,\n.lh-scorescale-range--fail::before {\n border-left: calc(var(--score-icon-size) / 2) solid transparent;\n border-right: calc(var(--score-icon-size) / 2) solid transparent;\n border-bottom: var(--score-icon-size) solid var(--color-fail);\n}\n\n.lh-audit--error .lh-audit__score-icon,\n.lh-metric--error .lh-metric__icon {\n background-image: var(--error-icon-url);\n background-repeat: no-repeat;\n background-position: center;\n border: none;\n}\n\n.lh-gauge__wrapper--fail .lh-gauge--error {\n background-image: var(--error-icon-url);\n background-repeat: no-repeat;\n background-position: center;\n transform: scale(0.5);\n top: var(--score-container-padding);\n}\n\n.lh-audit--manual .lh-audit__display-text,\n.lh-audit--notapplicable .lh-audit__display-text {\n color: var(--color-gray-600);\n}\n.lh-audit--manual .lh-audit__score-icon,\n.lh-audit--notapplicable .lh-audit__score-icon {\n border: calc(0.2 * var(--score-icon-size)) solid var(--color-gray-400);\n border-radius: 100%;\n background: none;\n}\n\n.lh-audit--informative .lh-audit__display-text {\n color: var(--color-gray-600);\n}\n\n.lh-audit--informative .lh-audit__score-icon {\n border: calc(0.2 * var(--score-icon-size)) solid var(--color-gray-400);\n border-radius: 100%;\n}\n\n.lh-audit__description,\n.lh-audit__stackpack {\n color: var(--report-text-color-secondary);\n}\n.lh-audit__adorn {\n border: 1px solid var(--color-gray-500);\n border-radius: 3px;\n margin: 0 3px;\n padding: 0 2px;\n line-height: 1.1;\n display: inline-block;\n font-size: 90%;\n color: var(--report-text-color-secondary);\n}\n\n.lh-category-header__description {\n text-align: center;\n color: var(--color-gray-700);\n margin: 0px auto;\n max-width: 400px;\n}\n\n\n.lh-audit__display-text,\n.lh-load-opportunity__sparkline,\n.lh-chevron-container {\n margin: 0 var(--audit-margin-horizontal);\n}\n.lh-chevron-container {\n margin-right: 0;\n}\n\n.lh-audit__title-and-text {\n flex: 1;\n}\n\n.lh-audit__title-and-text code {\n color: var(--snippet-color);\n font-size: var(--report-monospace-font-size);\n}\n\n/* Prepend display text with em dash separator. But not in Opportunities. */\n.lh-audit__display-text:not(:empty):before {\n content: \'—\';\n margin-right: var(--audit-margin-horizontal);\n}\n.lh-audit-group.lh-audit-group--load-opportunities .lh-audit__display-text:not(:empty):before {\n display: none;\n}\n\n/* Expandable Details (Audit Groups, Audits) */\n.lh-audit__header {\n display: flex;\n align-items: center;\n padding: var(--default-padding);\n}\n\n.lh-audit--load-opportunity .lh-audit__header {\n display: block;\n}\n\n\n.lh-metricfilter {\n display: grid;\n justify-content: end;\n align-items: center;\n grid-auto-flow: column;\n gap: 4px;\n color: var(--color-gray-700);\n}\n\n.lh-metricfilter__radio {\n /*\n * Instead of hiding, position offscreen so it\'s still accessible to screen readers\n * https://bugs.chromium.org/p/chromium/issues/detail?id=1439785\n */\n position: fixed;\n left: -9999px;\n}\n.lh-metricfilter input[type=\'radio\']:focus-visible + label {\n outline: -webkit-focus-ring-color auto 1px;\n}\n\n.lh-metricfilter__label {\n display: inline-flex;\n padding: 0 4px;\n height: 16px;\n text-decoration: underline;\n align-items: center;\n cursor: pointer;\n font-size: 90%;\n}\n\n.lh-metricfilter__label--active {\n background: var(--color-blue-primary);\n color: var(--color-white);\n border-radius: 3px;\n text-decoration: none;\n}\n/* Give the \'All\' choice a more muted display */\n.lh-metricfilter__label--active[for="metric-All"] {\n background-color: var(--color-blue-200) !important;\n color: black !important;\n}\n\n.lh-metricfilter__text {\n margin-right: 8px;\n}\n\n/* If audits are filtered, hide the itemcount for Passed Audits… */\n.lh-category--filtered .lh-audit-group .lh-audit-group__itemcount {\n display: none;\n}\n\n\n.lh-audit__header:hover {\n background-color: var(--color-hover);\n}\n\n/* We want to hide the browser\'s default arrow marker on summary elements. Admittedly, it\'s complicated. */\n.lh-root details > summary {\n /* Blink 89+ and Firefox will hide the arrow when display is changed from (new) default of `list-item` to block. https://chromestatus.com/feature/6730096436051968*/\n display: block;\n}\n/* Safari and Blink <=88 require using the -webkit-details-marker selector */\n.lh-root details > summary::-webkit-details-marker {\n display: none;\n}\n\n/* Perf Metric */\n\n.lh-metrics-container {\n display: grid;\n grid-auto-rows: 1fr;\n grid-template-columns: 1fr 1fr;\n grid-column-gap: var(--report-line-height);\n margin-bottom: var(--default-padding);\n}\n\n.lh-metric {\n border-top: 1px solid var(--report-border-color-secondary);\n}\n\n.lh-category:not(.lh--hoisted-meta) .lh-metric:nth-last-child(-n+2) {\n border-bottom: 1px solid var(--report-border-color-secondary);\n}\n\n.lh-metric__innerwrap {\n display: grid;\n /**\n * Icon -- Metric Name\n * -- Metric Value\n */\n grid-template-columns: calc(var(--score-icon-size) + var(--score-icon-margin-left) + var(--score-icon-margin-right)) 1fr;\n align-items: center;\n padding: var(--default-padding);\n}\n\n.lh-metric__details {\n order: -1;\n}\n\n.lh-metric__title {\n flex: 1;\n}\n\n.lh-calclink {\n padding-left: calc(1ex / 3);\n}\n\n.lh-metric__description {\n display: none;\n grid-column-start: 2;\n grid-column-end: 4;\n color: var(--report-text-color-secondary);\n}\n\n.lh-metric__value {\n font-size: var(--metric-value-font-size);\n margin: calc(var(--default-padding) / 2) 0;\n white-space: nowrap; /* No wrapping between metric value and the icon */\n grid-column-start: 2;\n}\n\n\n@media screen and (max-width: 535px) {\n .lh-metrics-container {\n display: block;\n }\n\n .lh-metric {\n border-bottom: none !important;\n }\n .lh-category:not(.lh--hoisted-meta) .lh-metric:nth-last-child(1) {\n border-bottom: 1px solid var(--report-border-color-secondary) !important;\n }\n\n /* Change the grid to 3 columns for narrow viewport. */\n .lh-metric__innerwrap {\n /**\n * Icon -- Metric Name -- Metric Value\n */\n grid-template-columns: calc(var(--score-icon-size) + var(--score-icon-margin-left) + var(--score-icon-margin-right)) 2fr 1fr;\n }\n .lh-metric__value {\n justify-self: end;\n grid-column-start: unset;\n }\n}\n\n/* No-JS toggle switch */\n/* Keep this selector sync\'d w/ `magicSelector` in report-ui-features-test.js */\n .lh-metrics-toggle__input:checked ~ .lh-metrics-container .lh-metric__description {\n display: block;\n}\n\n/* TODO get rid of the SVGS and clean up these some more */\n.lh-metrics-toggle__input {\n opacity: 0;\n position: absolute;\n right: 0;\n top: 0px;\n}\n\n.lh-metrics-toggle__input + div > label > .lh-metrics-toggle__labeltext--hide,\n.lh-metrics-toggle__input:checked + div > label > .lh-metrics-toggle__labeltext--show {\n display: none;\n}\n.lh-metrics-toggle__input:checked + div > label > .lh-metrics-toggle__labeltext--hide {\n display: inline;\n}\n.lh-metrics-toggle__input:focus + div > label {\n outline: -webkit-focus-ring-color auto 3px;\n}\n\n.lh-metrics-toggle__label {\n cursor: pointer;\n font-size: var(--report-font-size-secondary);\n line-height: var(--report-line-height-secondary);\n color: var(--color-gray-700);\n}\n\n/* Pushes the metric description toggle button to the right. */\n.lh-audit-group--metrics .lh-audit-group__header {\n display: flex;\n justify-content: space-between;\n}\n\n.lh-metric__icon,\n.lh-scorescale-range::before {\n content: \'\';\n width: var(--score-icon-size);\n height: var(--score-icon-size);\n display: inline-block;\n margin: var(--score-icon-margin);\n}\n\n.lh-metric--pass .lh-metric__value {\n color: var(--color-pass-secondary);\n}\n.lh-metric--pass .lh-metric__icon {\n border-radius: 100%;\n background: var(--color-pass);\n}\n\n.lh-metric--average .lh-metric__value {\n color: var(--color-average-secondary);\n}\n.lh-metric--average .lh-metric__icon {\n background: var(--color-average);\n width: var(--icon-square-size);\n height: var(--icon-square-size);\n}\n\n.lh-metric--fail .lh-metric__value {\n color: var(--color-fail-secondary);\n}\n.lh-metric--fail .lh-metric__icon {\n border-left: calc(var(--score-icon-size) / 2) solid transparent;\n border-right: calc(var(--score-icon-size) / 2) solid transparent;\n border-bottom: var(--score-icon-size) solid var(--color-fail);\n}\n\n.lh-metric--error .lh-metric__value,\n.lh-metric--error .lh-metric__description {\n color: var(--color-fail-secondary);\n}\n\n/* Perf load opportunity */\n\n.lh-load-opportunity__cols {\n display: flex;\n align-items: flex-start;\n}\n\n.lh-load-opportunity__header .lh-load-opportunity__col {\n color: var(--color-gray-600);\n display: unset;\n line-height: calc(2.3 * var(--report-font-size));\n}\n\n.lh-load-opportunity__col {\n display: flex;\n}\n\n.lh-load-opportunity__col--one {\n flex: 5;\n align-items: center;\n margin-right: 2px;\n}\n.lh-load-opportunity__col--two {\n flex: 4;\n text-align: right;\n}\n\n.lh-audit--load-opportunity .lh-audit__display-text {\n text-align: right;\n flex: 0 0 7.5ch;\n}\n\n\n/* Sparkline */\n\n.lh-load-opportunity__sparkline {\n flex: 1;\n margin-top: calc((var(--report-line-height) - var(--sparkline-height)) / 2);\n}\n\n.lh-sparkline {\n height: var(--sparkline-height);\n width: 100%;\n}\n\n.lh-sparkline__bar {\n height: 100%;\n float: right;\n}\n\n.lh-audit--pass .lh-sparkline__bar {\n background: var(--color-pass);\n}\n\n.lh-audit--average .lh-sparkline__bar {\n background: var(--color-average);\n}\n\n.lh-audit--fail .lh-sparkline__bar {\n background: var(--color-fail);\n}\n\n/* Filmstrip */\n\n.lh-filmstrip-container {\n /* smaller gap between metrics and filmstrip */\n margin: -8px auto 0 auto;\n}\n\n.lh-filmstrip {\n display: grid;\n justify-content: space-between;\n padding-bottom: var(--default-padding);\n width: 100%;\n grid-template-columns: repeat(auto-fit, 90px);\n}\n\n.lh-filmstrip__frame {\n text-align: right;\n position: relative;\n}\n\n.lh-filmstrip__thumbnail {\n border: 1px solid var(--report-border-color-secondary);\n max-height: 150px;\n max-width: 120px;\n}\n\n/* Audit */\n\n.lh-audit {\n border-bottom: 1px solid var(--report-border-color-secondary);\n}\n\n/* Apply border-top to just the first audit. */\n.lh-audit {\n border-top: 1px solid var(--report-border-color-secondary);\n}\n.lh-audit ~ .lh-audit {\n border-top: none;\n}\n\n\n.lh-audit--error .lh-audit__display-text {\n color: var(--color-fail-secondary);\n}\n\n/* Audit Group */\n\n.lh-audit-group {\n margin-bottom: var(--audit-group-margin-bottom);\n position: relative;\n}\n.lh-audit-group--metrics {\n margin-bottom: calc(var(--audit-group-margin-bottom) / 2);\n}\n\n.lh-audit-group__header::before {\n /* By default, groups don\'t get an icon */\n content: none;\n width: var(--pwa-icon-size);\n height: var(--pwa-icon-size);\n margin: var(--pwa-icon-margin);\n display: inline-block;\n vertical-align: middle;\n}\n\n/* Style the "over budget" columns red. */\n.lh-audit-group--budgets #performance-budget tbody tr td:nth-child(4),\n.lh-audit-group--budgets #performance-budget tbody tr td:nth-child(5),\n.lh-audit-group--budgets #timing-budget tbody tr td:nth-child(3) {\n color: var(--color-red-700);\n}\n\n/* Align the "over budget request count" text to be close to the "over budget bytes" column. */\n.lh-audit-group--budgets .lh-table tbody tr td:nth-child(4){\n text-align: right;\n}\n\n.lh-audit-group--budgets .lh-details--budget {\n width: 100%;\n margin: 0 0 var(--default-padding);\n}\n\n.lh-audit-group--pwa-installable .lh-audit-group__header::before {\n content: \'\';\n background-image: var(--pwa-installable-gray-url);\n}\n.lh-audit-group--pwa-optimized .lh-audit-group__header::before {\n content: \'\';\n background-image: var(--pwa-optimized-gray-url);\n}\n.lh-audit-group--pwa-installable.lh-badged .lh-audit-group__header::before {\n background-image: var(--pwa-installable-color-url);\n}\n.lh-audit-group--pwa-optimized.lh-badged .lh-audit-group__header::before {\n background-image: var(--pwa-optimized-color-url);\n}\n\n.lh-audit-group--metrics .lh-audit-group__summary {\n margin-top: 0;\n margin-bottom: 0;\n}\n\n.lh-audit-group__summary {\n display: flex;\n justify-content: space-between;\n align-items: center;\n}\n\n.lh-audit-group__header .lh-chevron {\n margin-top: calc((var(--report-line-height) - 5px) / 2);\n}\n\n.lh-audit-group__header {\n letter-spacing: 0.8px;\n padding: var(--default-padding);\n padding-left: 0;\n}\n\n.lh-audit-group__header, .lh-audit-group__summary {\n font-size: var(--report-font-size-secondary);\n line-height: var(--report-line-height-secondary);\n color: var(--color-gray-700);\n}\n\n.lh-audit-group__title {\n text-transform: uppercase;\n font-weight: 500;\n}\n\n.lh-audit-group__itemcount {\n color: var(--color-gray-600);\n}\n\n.lh-audit-group__footer {\n color: var(--color-gray-600);\n display: block;\n margin-top: var(--default-padding);\n}\n\n.lh-details,\n.lh-category-header__description,\n.lh-load-opportunity__header,\n.lh-audit-group__footer {\n font-size: var(--report-font-size-secondary);\n line-height: var(--report-line-height-secondary);\n}\n\n.lh-audit-explanation {\n margin: var(--audit-padding-vertical) 0 calc(var(--audit-padding-vertical) / 2) var(--audit-margin-horizontal);\n line-height: var(--audit-explanation-line-height);\n display: inline-block;\n}\n\n.lh-audit--fail .lh-audit-explanation {\n color: var(--color-fail-secondary);\n}\n\n/* Report */\n.lh-list > :not(:last-child) {\n margin-bottom: calc(var(--default-padding) * 2);\n}\n\n.lh-header-container {\n display: block;\n margin: 0 auto;\n position: relative;\n word-wrap: break-word;\n}\n\n.lh-header-container .lh-scores-wrapper {\n border-bottom: 1px solid var(--color-gray-200);\n}\n\n\n.lh-report {\n min-width: var(--report-content-min-width);\n}\n\n.lh-exception {\n font-size: large;\n}\n\n.lh-code {\n white-space: normal;\n margin-top: 0;\n font-size: var(--report-monospace-font-size);\n}\n\n.lh-warnings {\n --item-margin: calc(var(--report-line-height) / 6);\n color: var(--color-average-secondary);\n margin: var(--audit-padding-vertical) 0;\n padding: var(--default-padding)\n var(--default-padding)\n var(--default-padding)\n calc(var(--audit-description-padding-left));\n background-color: var(--toplevel-warning-background-color);\n}\n.lh-warnings span {\n font-weight: bold;\n}\n\n.lh-warnings--toplevel {\n --item-margin: calc(var(--header-line-height) / 4);\n color: var(--toplevel-warning-text-color);\n margin-left: auto;\n margin-right: auto;\n max-width: var(--report-content-max-width-minus-edge-gap);\n padding: var(--toplevel-warning-padding);\n border-radius: 8px;\n}\n\n.lh-warnings__msg {\n color: var(--toplevel-warning-message-text-color);\n margin: 0;\n}\n\n.lh-warnings ul {\n margin: 0;\n}\n.lh-warnings li {\n margin: var(--item-margin) 0;\n}\n.lh-warnings li:last-of-type {\n margin-bottom: 0;\n}\n\n.lh-scores-header {\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n}\n.lh-scores-header__solo {\n padding: 0;\n border: 0;\n}\n\n/* Gauge */\n\n.lh-gauge__wrapper--pass {\n color: var(--color-pass-secondary);\n fill: var(--color-pass);\n stroke: var(--color-pass);\n}\n\n.lh-gauge__wrapper--average {\n color: var(--color-average-secondary);\n fill: var(--color-average);\n stroke: var(--color-average);\n}\n\n.lh-gauge__wrapper--fail {\n color: var(--color-fail-secondary);\n fill: var(--color-fail);\n stroke: var(--color-fail);\n}\n\n.lh-gauge__wrapper--not-applicable {\n color: var(--color-not-applicable);\n fill: var(--color-not-applicable);\n stroke: var(--color-not-applicable);\n}\n\n.lh-fraction__wrapper .lh-fraction__content::before {\n content: \'\';\n height: var(--score-icon-size);\n width: var(--score-icon-size);\n margin: var(--score-icon-margin);\n display: inline-block;\n}\n.lh-fraction__wrapper--pass .lh-fraction__content {\n color: var(--color-pass-secondary);\n}\n.lh-fraction__wrapper--pass .lh-fraction__background {\n background-color: var(--color-pass);\n}\n.lh-fraction__wrapper--pass .lh-fraction__content::before {\n background-color: var(--color-pass);\n border-radius: 50%;\n}\n.lh-fraction__wrapper--average .lh-fraction__content {\n color: var(--color-average-secondary);\n}\n.lh-fraction__wrapper--average .lh-fraction__background,\n.lh-fraction__wrapper--average .lh-fraction__content::before {\n background-color: var(--color-average);\n}\n.lh-fraction__wrapper--fail .lh-fraction__content {\n color: var(--color-fail);\n}\n.lh-fraction__wrapper--fail .lh-fraction__background {\n background-color: var(--color-fail);\n}\n.lh-fraction__wrapper--fail .lh-fraction__content::before {\n border-left: calc(var(--score-icon-size) / 2) solid transparent;\n border-right: calc(var(--score-icon-size) / 2) solid transparent;\n border-bottom: var(--score-icon-size) solid var(--color-fail);\n}\n.lh-fraction__wrapper--null .lh-fraction__content {\n color: var(--color-gray-700);\n}\n.lh-fraction__wrapper--null .lh-fraction__background {\n background-color: var(--color-gray-700);\n}\n.lh-fraction__wrapper--null .lh-fraction__content::before {\n border-radius: 50%;\n border: calc(0.2 * var(--score-icon-size)) solid var(--color-gray-700);\n}\n\n.lh-fraction__background {\n position: absolute;\n height: 100%;\n width: 100%;\n border-radius: calc(var(--gauge-circle-size) / 2);\n opacity: 0.1;\n z-index: -1;\n}\n\n.lh-fraction__content-wrapper {\n height: var(--gauge-circle-size);\n display: flex;\n align-items: center;\n}\n\n.lh-fraction__content {\n display: flex;\n position: relative;\n align-items: center;\n justify-content: center;\n font-size: calc(0.3 * var(--gauge-circle-size));\n line-height: calc(0.4 * var(--gauge-circle-size));\n width: max-content;\n min-width: calc(1.5 * var(--gauge-circle-size));\n padding: calc(0.1 * var(--gauge-circle-size)) calc(0.2 * var(--gauge-circle-size));\n --score-icon-size: calc(0.21 * var(--gauge-circle-size));\n --score-icon-margin: 0 calc(0.15 * var(--gauge-circle-size)) 0 0;\n}\n\n.lh-gauge {\n stroke-linecap: round;\n width: var(--gauge-circle-size);\n height: var(--gauge-circle-size);\n}\n\n.lh-category .lh-gauge {\n --gauge-circle-size: var(--gauge-circle-size-big);\n}\n\n.lh-gauge-base {\n opacity: 0.1;\n}\n\n.lh-gauge-arc {\n fill: none;\n transform-origin: 50% 50%;\n animation: load-gauge var(--transition-length) ease both;\n animation-delay: 250ms;\n}\n\n.lh-gauge__svg-wrapper {\n position: relative;\n height: var(--gauge-circle-size);\n}\n.lh-category .lh-gauge__svg-wrapper,\n.lh-category .lh-fraction__wrapper {\n --gauge-circle-size: var(--gauge-circle-size-big);\n}\n\n/* The plugin badge overlay */\n.lh-gauge__wrapper--plugin .lh-gauge__svg-wrapper::before {\n width: var(--plugin-badge-size);\n height: var(--plugin-badge-size);\n background-color: var(--plugin-badge-background-color);\n background-image: var(--plugin-icon-url);\n background-repeat: no-repeat;\n background-size: var(--plugin-icon-size);\n background-position: 58% 50%;\n content: "";\n position: absolute;\n right: -6px;\n bottom: 0px;\n display: block;\n z-index: 100;\n box-shadow: 0 0 4px rgba(0,0,0,.2);\n border-radius: 25%;\n}\n.lh-category .lh-gauge__wrapper--plugin .lh-gauge__svg-wrapper::before {\n width: var(--plugin-badge-size-big);\n height: var(--plugin-badge-size-big);\n}\n\n@keyframes load-gauge {\n from { stroke-dasharray: 0 352; }\n}\n\n.lh-gauge__percentage {\n width: 100%;\n height: var(--gauge-circle-size);\n position: absolute;\n font-family: var(--report-font-family-monospace);\n font-size: calc(var(--gauge-circle-size) * 0.34 + 1.3px);\n line-height: 0;\n text-align: center;\n top: calc(var(--score-container-padding) + var(--gauge-circle-size) / 2);\n}\n\n.lh-category .lh-gauge__percentage {\n --gauge-circle-size: var(--gauge-circle-size-big);\n --gauge-percentage-font-size: var(--gauge-percentage-font-size-big);\n}\n\n.lh-gauge__wrapper,\n.lh-fraction__wrapper {\n position: relative;\n display: flex;\n align-items: center;\n flex-direction: column;\n text-decoration: none;\n padding: var(--score-container-padding);\n\n --transition-length: 1s;\n\n /* Contain the layout style paint & layers during animation*/\n contain: content;\n will-change: opacity; /* Only using for layer promotion */\n}\n\n.lh-gauge__label,\n.lh-fraction__label {\n font-size: var(--gauge-label-font-size);\n font-weight: 500;\n line-height: var(--gauge-label-line-height);\n margin-top: 10px;\n text-align: center;\n color: var(--report-text-color);\n word-break: keep-all;\n}\n\n/* TODO(#8185) use more BEM (.lh-gauge__label--big) instead of relying on descendant selector */\n.lh-category .lh-gauge__label,\n.lh-category .lh-fraction__label {\n --gauge-label-font-size: var(--gauge-label-font-size-big);\n --gauge-label-line-height: var(--gauge-label-line-height-big);\n margin-top: 14px;\n}\n\n.lh-scores-header .lh-gauge__wrapper,\n.lh-scores-header .lh-fraction__wrapper,\n.lh-scores-header .lh-gauge--pwa__wrapper,\n.lh-sticky-header .lh-gauge__wrapper,\n.lh-sticky-header .lh-fraction__wrapper,\n.lh-sticky-header .lh-gauge--pwa__wrapper {\n width: var(--gauge-wrapper-width);\n}\n\n.lh-scorescale {\n display: inline-flex;\n\n gap: calc(var(--default-padding) * 4);\n margin: 16px auto 0 auto;\n font-size: var(--report-font-size-secondary);\n color: var(--color-gray-700);\n\n}\n\n.lh-scorescale-range {\n display: flex;\n align-items: center;\n font-family: var(--report-font-family-monospace);\n white-space: nowrap;\n}\n\n.lh-category-header__finalscreenshot .lh-scorescale {\n border: 0;\n display: flex;\n justify-content: center;\n}\n\n.lh-category-header__finalscreenshot .lh-scorescale-range {\n font-family: unset;\n font-size: 12px;\n}\n\n.lh-scorescale-wrap {\n display: contents;\n}\n\n/* Hide category score gauages if it\'s a single category report */\n.lh-header--solo-category .lh-scores-wrapper {\n display: none;\n}\n\n\n.lh-categories {\n width: 100%;\n}\n\n.lh-category {\n padding: var(--category-padding);\n max-width: var(--report-content-max-width);\n margin: 0 auto;\n\n scroll-margin-top: var(--sticky-header-buffer);\n}\n\n.lh-category-wrapper {\n border-bottom: 1px solid var(--color-gray-200);\n}\n.lh-category-wrapper:last-of-type {\n border-bottom: 0;\n}\n\n.lh-category-header {\n margin-bottom: var(--section-padding-vertical);\n}\n\n.lh-category-header .lh-score__gauge {\n max-width: 400px;\n width: auto;\n margin: 0px auto;\n}\n\n.lh-category-header__finalscreenshot {\n display: grid;\n grid-template: none / 1fr 1px 1fr;\n justify-items: center;\n align-items: center;\n gap: var(--report-line-height);\n min-height: 288px;\n margin-bottom: var(--default-padding);\n}\n\n.lh-final-ss-image {\n /* constrain the size of the image to not be too large */\n max-height: calc(var(--gauge-circle-size-big) * 2.8);\n max-width: calc(var(--gauge-circle-size-big) * 3.5);\n border: 1px solid var(--color-gray-200);\n padding: 4px;\n border-radius: 3px;\n display: block;\n}\n\n.lh-category-headercol--separator {\n background: var(--color-gray-200);\n width: 1px;\n height: var(--gauge-circle-size-big);\n}\n\n@media screen and (max-width: 780px) {\n .lh-category-header__finalscreenshot {\n grid-template: 1fr 1fr / none\n }\n .lh-category-headercol--separator {\n display: none;\n }\n}\n\n\n/* 964 fits the min-width of the filmstrip */\n@media screen and (max-width: 964px) {\n .lh-report {\n margin-left: 0;\n width: 100%;\n }\n}\n\n@media print {\n body {\n -webkit-print-color-adjust: exact; /* print background colors */\n }\n .lh-container {\n display: block;\n }\n .lh-report {\n margin-left: 0;\n padding-top: 0;\n }\n .lh-categories {\n margin-top: 0;\n }\n}\n\n.lh-table {\n position: relative;\n border-collapse: separate;\n border-spacing: 0;\n /* Can\'t assign padding to table, so shorten the width instead. */\n width: calc(100% - var(--audit-description-padding-left) - var(--stackpack-padding-horizontal));\n border: 1px solid var(--report-border-color-secondary);\n}\n\n.lh-table thead th {\n position: sticky;\n top: calc(var(--sticky-header-buffer) + 1em);\n z-index: 1;\n background-color: var(--report-background-color);\n border-bottom: 1px solid var(--report-border-color-secondary);\n font-weight: normal;\n color: var(--color-gray-600);\n /* See text-wrapping comment on .lh-container. */\n word-break: normal;\n}\n\n.lh-row--group {\n background-color: var(--table-group-header-background-color);\n}\n\n.lh-row--group td {\n font-weight: bold;\n font-size: 1.05em;\n color: var(--table-group-header-text-color);\n}\n\n.lh-row--group td:first-child {\n font-weight: normal;\n}\n\n.lh-row--group .lh-text {\n color: inherit;\n text-decoration: none;\n display: inline-block;\n}\n\n.lh-row--group a.lh-link:hover {\n text-decoration: underline;\n}\n\n.lh-row--group .lh-audit__adorn {\n text-transform: capitalize;\n font-weight: normal;\n padding: 2px 3px 1px 3px;\n}\n\n.lh-row--group .lh-audit__adorn1p {\n color: var(--link-color);\n border-color: var(--link-color);\n}\n\n.lh-row--group .lh-report-icon--external::before {\n content: "";\n background-repeat: no-repeat;\n width: 14px;\n height: 16px;\n opacity: 0.7;\n display: inline-block;\n vertical-align: middle;\n}\n\n.lh-row--group .lh-report-icon--external {\n display: none;\n}\n\n.lh-row--group:hover .lh-report-icon--external {\n display: inline-block;\n}\n\n.lh-dark .lh-report-icon--external::before {\n filter: invert(1);\n}\n\n/** Manages indentation of two-level and three-level nested adjacent rows */\n\n.lh-row--group ~ [data-entity]:not(.lh-row--group) td:first-child {\n padding-left: 20px;\n}\n\n.lh-row--group ~ [data-entity]:not(.lh-row--group) ~ .lh-sub-item-row td:first-child {\n padding-left: 40px;\n}\n\n.lh-row--even {\n background-color: var(--table-group-header-background-color);\n}\n.lh-row--hidden {\n display: none;\n}\n\n.lh-table th,\n.lh-table td {\n padding: var(--default-padding);\n}\n\n.lh-table tr {\n vertical-align: middle;\n}\n\n.lh-table tr:hover {\n background-color: var(--table-higlight-background-color);\n}\n\n/* Looks unnecessary, but mostly for keeping the <th>s left-aligned */\n.lh-table-column--text,\n.lh-table-column--source-location,\n.lh-table-column--url,\n/* .lh-table-column--thumbnail, */\n/* .lh-table-column--empty,*/\n.lh-table-column--code,\n.lh-table-column--node {\n text-align: left;\n}\n\n.lh-table-column--code {\n min-width: 100px;\n}\n\n.lh-table-column--bytes,\n.lh-table-column--timespanMs,\n.lh-table-column--ms,\n.lh-table-column--numeric {\n text-align: right;\n word-break: normal;\n}\n\n\n\n.lh-table .lh-table-column--thumbnail {\n width: var(--image-preview-size);\n}\n\n.lh-table-column--url {\n min-width: 250px;\n}\n\n.lh-table-column--text {\n min-width: 80px;\n}\n\n/* Keep columns narrow if they follow the URL column */\n/* 12% was determined to be a decent narrow width, but wide enough for column headings */\n.lh-table-column--url + th.lh-table-column--bytes,\n.lh-table-column--url + .lh-table-column--bytes + th.lh-table-column--bytes,\n.lh-table-column--url + .lh-table-column--ms,\n.lh-table-column--url + .lh-table-column--ms + th.lh-table-column--bytes,\n.lh-table-column--url + .lh-table-column--bytes + th.lh-table-column--timespanMs {\n width: 12%;\n}\n\n.lh-text__url-host {\n display: inline;\n}\n\n.lh-text__url-host {\n margin-left: calc(var(--report-font-size) / 2);\n opacity: 0.6;\n font-size: 90%\n}\n\n.lh-thumbnail {\n object-fit: cover;\n width: var(--image-preview-size);\n height: var(--image-preview-size);\n display: block;\n}\n\n.lh-unknown pre {\n overflow: scroll;\n border: solid 1px var(--color-gray-200);\n}\n\n.lh-text__url > a {\n color: inherit;\n text-decoration: none;\n}\n\n.lh-text__url > a:hover {\n text-decoration: underline dotted #999;\n}\n\n.lh-sub-item-row {\n margin-left: 20px;\n margin-bottom: 0;\n color: var(--color-gray-700);\n}\n\n.lh-sub-item-row td {\n padding-top: 4px;\n padding-bottom: 4px;\n padding-left: 20px;\n}\n\n/* Chevron\n https://codepen.io/paulirish/pen/LmzEmK\n */\n.lh-chevron {\n --chevron-angle: 42deg;\n /* Edge doesn\'t support transform: rotate(calc(...)), so we define it here */\n --chevron-angle-right: -42deg;\n width: var(--chevron-size);\n height: var(--chevron-size);\n margin-top: calc((var(--report-line-height) - 12px) / 2);\n}\n\n.lh-chevron__lines {\n transition: transform 0.4s;\n transform: translateY(var(--report-line-height));\n}\n.lh-chevron__line {\n stroke: var(--chevron-line-stroke);\n stroke-width: var(--chevron-size);\n stroke-linecap: square;\n transform-origin: 50%;\n transform: rotate(var(--chevron-angle));\n transition: transform 300ms, stroke 300ms;\n}\n\n.lh-expandable-details .lh-chevron__line-right,\n.lh-expandable-details[open] .lh-chevron__line-left {\n transform: rotate(var(--chevron-angle-right));\n}\n\n.lh-expandable-details[open] .lh-chevron__line-right {\n transform: rotate(var(--chevron-angle));\n}\n\n\n.lh-expandable-details[open] .lh-chevron__lines {\n transform: translateY(calc(var(--chevron-size) * -1));\n}\n\n.lh-expandable-details[open] {\n animation: 300ms openDetails forwards;\n padding-bottom: var(--default-padding);\n}\n\n@keyframes openDetails {\n from {\n outline: 1px solid var(--report-background-color);\n }\n to {\n outline: 1px solid;\n box-shadow: 0 2px 4px rgba(0, 0, 0, .24);\n }\n}\n\n@media screen and (max-width: 780px) {\n /* no black outline if we\'re not confident the entire table can be displayed within bounds */\n .lh-expandable-details[open] {\n animation: none;\n }\n}\n\n.lh-expandable-details[open] summary, details.lh-clump > summary {\n border-bottom: 1px solid var(--report-border-color-secondary);\n}\ndetails.lh-clump[open] > summary {\n border-bottom-width: 0;\n}\n\n\n\ndetails .lh-clump-toggletext--hide,\ndetails[open] .lh-clump-toggletext--show { display: none; }\ndetails[open] .lh-clump-toggletext--hide { display: block;}\n\n\n/* Tooltip */\n.lh-tooltip-boundary {\n position: relative;\n}\n\n.lh-tooltip {\n position: absolute;\n display: none; /* Don\'t retain these layers when not needed */\n opacity: 0;\n background: #ffffff;\n white-space: pre-line; /* Render newlines in the text */\n min-width: 246px;\n max-width: 275px;\n padding: 15px;\n border-radius: 5px;\n text-align: initial;\n line-height: 1.4;\n}\n/* shrink tooltips to not be cutoff on left edge of narrow viewports\n 45vw is chosen to be ~= width of the left column of metrics\n*/\n@media screen and (max-width: 535px) {\n .lh-tooltip {\n min-width: 45vw;\n padding: 3vw;\n }\n}\n\n.lh-tooltip-boundary:hover .lh-tooltip {\n display: block;\n animation: fadeInTooltip 250ms;\n animation-fill-mode: forwards;\n animation-delay: 850ms;\n bottom: 100%;\n z-index: 1;\n will-change: opacity;\n right: 0;\n pointer-events: none;\n}\n\n.lh-tooltip::before {\n content: "";\n border: solid transparent;\n border-bottom-color: #fff;\n border-width: 10px;\n position: absolute;\n bottom: -20px;\n right: 6px;\n transform: rotate(180deg);\n pointer-events: none;\n}\n\n@keyframes fadeInTooltip {\n 0% { opacity: 0; }\n 75% { opacity: 1; }\n 100% { opacity: 1; filter: drop-shadow(1px 0px 1px #aaa) drop-shadow(0px 2px 4px hsla(206, 6%, 25%, 0.15)); pointer-events: auto; }\n}\n\n/* Element screenshot */\n.lh-element-screenshot {\n float: left;\n margin-right: 20px;\n}\n.lh-element-screenshot__content {\n overflow: hidden;\n min-width: 110px;\n display: flex;\n justify-content: center;\n background-color: var(--report-background-color);\n}\n.lh-element-screenshot__image {\n position: relative;\n /* Set by ElementScreenshotRenderer.installFullPageScreenshotCssVariable */\n background-image: var(--element-screenshot-url);\n outline: 2px solid #777;\n background-color: white;\n background-repeat: no-repeat;\n}\n.lh-element-screenshot__mask {\n position: absolute;\n background: #555;\n opacity: 0.8;\n}\n.lh-element-screenshot__element-marker {\n position: absolute;\n outline: 2px solid var(--color-lime-400);\n}\n.lh-element-screenshot__overlay {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 2000; /* .lh-topbar is 1000 */\n background: var(--screenshot-overlay-background);\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: zoom-out;\n}\n\n.lh-element-screenshot__overlay .lh-element-screenshot {\n margin-right: 0; /* clearing margin used in thumbnail case */\n outline: 1px solid var(--color-gray-700);\n}\n\n.lh-screenshot-overlay--enabled .lh-element-screenshot {\n cursor: zoom-out;\n}\n.lh-screenshot-overlay--enabled .lh-node .lh-element-screenshot {\n cursor: zoom-in;\n}\n\n\n.lh-meta__items {\n --meta-icon-size: calc(var(--report-icon-size) * 0.667);\n padding: var(--default-padding);\n display: grid;\n grid-template-columns: 1fr 1fr 1fr;\n background-color: var(--env-item-background-color);\n border-radius: 3px;\n margin: 0 0 var(--default-padding) 0;\n font-size: 12px;\n column-gap: var(--default-padding);\n color: var(--color-gray-700);\n}\n\n.lh-meta__item {\n display: block;\n list-style-type: none;\n position: relative;\n padding: 0 0 0 calc(var(--meta-icon-size) + var(--default-padding) * 2);\n cursor: unset; /* disable pointer cursor from report-icon */\n}\n\n.lh-meta__item.lh-tooltip-boundary {\n text-decoration: dotted underline var(--color-gray-500);\n cursor: help;\n}\n\n.lh-meta__item.lh-report-icon::before {\n position: absolute;\n left: var(--default-padding);\n width: var(--meta-icon-size);\n height: var(--meta-icon-size);\n}\n\n.lh-meta__item.lh-report-icon:hover::before {\n opacity: 0.7;\n}\n\n.lh-meta__item .lh-tooltip {\n color: var(--color-gray-800);\n}\n\n.lh-meta__item .lh-tooltip::before {\n right: auto; /* Set the tooltip arrow to the leftside */\n left: 6px;\n}\n\n/* Change the grid for narrow viewport. */\n@media screen and (max-width: 640px) {\n .lh-meta__items {\n grid-template-columns: 1fr 1fr;\n }\n}\n@media screen and (max-width: 535px) {\n .lh-meta__items {\n display: block;\n }\n}\n\n\n/*# sourceURL=report-styles.css */\n'),t.append(n),t}(e);case"topbar":return function(e){const t=e.createFragment(),n=e.createElement("style");n.append("\n .lh-topbar {\n position: sticky;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n display: flex;\n align-items: center;\n height: var(--topbar-height);\n padding: var(--topbar-padding);\n font-size: var(--report-font-size-secondary);\n background-color: var(--topbar-background-color);\n border-bottom: 1px solid var(--color-gray-200);\n }\n\n .lh-topbar__logo {\n width: var(--topbar-logo-size);\n height: var(--topbar-logo-size);\n user-select: none;\n flex: none;\n }\n\n .lh-topbar__url {\n margin: var(--topbar-padding);\n text-decoration: none;\n color: var(--report-text-color);\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n }\n\n .lh-tools {\n display: flex;\n align-items: center;\n margin-left: auto;\n will-change: transform;\n min-width: var(--report-icon-size);\n }\n .lh-tools__button {\n width: var(--report-icon-size);\n min-width: 24px;\n height: var(--report-icon-size);\n cursor: pointer;\n margin-right: 5px;\n /* This is actually a button element, but we want to style it like a transparent div. */\n display: flex;\n background: none;\n color: inherit;\n border: none;\n padding: 0;\n font: inherit;\n outline: inherit;\n }\n .lh-tools__button svg {\n fill: var(--tools-icon-color);\n }\n .lh-dark .lh-tools__button svg {\n filter: invert(1);\n }\n .lh-tools__button.lh-active + .lh-tools__dropdown {\n opacity: 1;\n clip: rect(-1px, 194px, 242px, -3px);\n visibility: visible;\n }\n .lh-tools__dropdown {\n position: absolute;\n background-color: var(--report-background-color);\n border: 1px solid var(--report-border-color);\n border-radius: 3px;\n padding: calc(var(--default-padding) / 2) 0;\n cursor: pointer;\n top: 36px;\n right: 0;\n box-shadow: 1px 1px 3px #ccc;\n min-width: 125px;\n clip: rect(0, 164px, 0, 0);\n visibility: hidden;\n opacity: 0;\n transition: all 200ms cubic-bezier(0,0,0.2,1);\n }\n .lh-tools__dropdown a {\n color: currentColor;\n text-decoration: none;\n white-space: nowrap;\n padding: 0 6px;\n line-height: 2;\n }\n .lh-tools__dropdown a:hover,\n .lh-tools__dropdown a:focus {\n background-color: var(--color-gray-200);\n outline: none;\n }\n /* save-gist option hidden in report. */\n .lh-tools__dropdown a[data-action='save-gist'] {\n display: none;\n }\n\n .lh-locale-selector {\n width: 100%;\n color: var(--report-text-color);\n background-color: var(--locale-selector-background-color);\n padding: 2px;\n }\n .lh-tools-locale {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n }\n .lh-tools-locale__selector-wrapper {\n transition: opacity 0.15s;\n opacity: 0;\n max-width: 200px;\n }\n .lh-button.lh-tool-locale__button {\n height: var(--topbar-height);\n color: var(--tools-icon-color);\n padding: calc(var(--default-padding) / 2);\n }\n .lh-tool-locale__button.lh-active + .lh-tools-locale__selector-wrapper {\n opacity: 1;\n clip: rect(-1px, 194px, 242px, -3px);\n visibility: visible;\n margin: 0 4px;\n }\n\n @media screen and (max-width: 964px) {\n .lh-tools__dropdown {\n right: 0;\n left: initial;\n }\n }\n @media print {\n .lh-topbar {\n position: static;\n margin-left: 0;\n }\n\n .lh-tools__dropdown {\n display: none;\n }\n }\n "),t.append(n);const r=e.createElement("div","lh-topbar"),o=e.createElementNS("http://www.w3.org/2000/svg","svg","lh-topbar__logo");o.setAttribute("role","img"),o.setAttribute("title","Lighthouse logo"),o.setAttribute("fill","none"),o.setAttribute("xmlns","http://www.w3.org/2000/svg"),o.setAttribute("viewBox","0 0 48 48");const i=e.createElementNS("http://www.w3.org/2000/svg","path");i.setAttribute("d","m14 7 10-7 10 7v10h5v7h-5l5 24H9l5-24H9v-7h5V7Z"),i.setAttribute("fill","#F63");const a=e.createElementNS("http://www.w3.org/2000/svg","path");a.setAttribute("d","M31.561 24H14l-1.689 8.105L31.561 24ZM18.983 48H9l1.022-4.907L35.723 32.27l1.663 7.98L18.983 48Z"),a.setAttribute("fill","#FFA385");const l=e.createElementNS("http://www.w3.org/2000/svg","path");l.setAttribute("fill","#FF3"),l.setAttribute("d","M20.5 10h7v7h-7z"),o.append(" ",i," ",a," ",l," ");const s=e.createElement("a","lh-topbar__url");s.setAttribute("href",""),s.setAttribute("target","_blank"),s.setAttribute("rel","noopener");const c=e.createElement("div","lh-tools"),d=e.createElement("div","lh-tools-locale lh-hidden"),h=e.createElement("button","lh-button lh-tool-locale__button");h.setAttribute("id","lh-button__swap-locales"),h.setAttribute("title","Show Language Picker"),h.setAttribute("aria-label","Toggle language picker"),h.setAttribute("aria-haspopup","menu"),h.setAttribute("aria-expanded","false"),h.setAttribute("aria-controls","lh-tools-locale__selector-wrapper");const p=e.createElementNS("http://www.w3.org/2000/svg","svg");p.setAttribute("width","20px"),p.setAttribute("height","20px"),p.setAttribute("viewBox","0 0 24 24"),p.setAttribute("fill","currentColor");const u=e.createElementNS("http://www.w3.org/2000/svg","path");u.setAttribute("d","M0 0h24v24H0V0z"),u.setAttribute("fill","none");const g=e.createElementNS("http://www.w3.org/2000/svg","path");g.setAttribute("d","M12.87 15.07l-2.54-2.51.03-.03c1.74-1.94 2.98-4.17 3.71-6.53H17V4h-7V2H8v2H1v1.99h11.17C11.5 7.92 10.44 9.75 9 11.35 8.07 10.32 7.3 9.19 6.69 8h-2c.73 1.63 1.73 3.17 2.98 4.56l-5.09 5.02L4 19l5-5 3.11 3.11.76-2.04zM18.5 10h-2L12 22h2l1.12-3h4.75L21 22h2l-4.5-12zm-2.62 7l1.62-4.33L19.12 17h-3.24z"),p.append(u,g),h.append(" ",p," ");const m=e.createElement("div","lh-tools-locale__selector-wrapper");m.setAttribute("id","lh-tools-locale__selector-wrapper"),m.setAttribute("role","menu"),m.setAttribute("aria-labelledby","lh-button__swap-locales"),m.setAttribute("aria-hidden","true"),m.append(" "," "),d.append(" ",h," ",m," ");const f=e.createElement("button","lh-tools__button");f.setAttribute("id","lh-tools-button"),f.setAttribute("title","Tools menu"),f.setAttribute("aria-label","Toggle report tools menu"),f.setAttribute("aria-haspopup","menu"),f.setAttribute("aria-expanded","false"),f.setAttribute("aria-controls","lh-tools-dropdown");const v=e.createElementNS("http://www.w3.org/2000/svg","svg");v.setAttribute("width","100%"),v.setAttribute("height","100%"),v.setAttribute("viewBox","0 0 24 24");const b=e.createElementNS("http://www.w3.org/2000/svg","path");b.setAttribute("d","M0 0h24v24H0z"),b.setAttribute("fill","none");const _=e.createElementNS("http://www.w3.org/2000/svg","path");_.setAttribute("d","M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"),v.append(" ",b," ",_," "),f.append(" ",v," ");const w=e.createElement("div","lh-tools__dropdown");w.setAttribute("id","lh-tools-dropdown"),w.setAttribute("role","menu"),w.setAttribute("aria-labelledby","lh-tools-button");const y=e.createElement("a","lh-report-icon lh-report-icon--print");y.setAttribute("role","menuitem"),y.setAttribute("tabindex","-1"),y.setAttribute("href","#"),y.setAttribute("data-i18n","dropdownPrintSummary"),y.setAttribute("data-action","print-summary");const x=e.createElement("a","lh-report-icon lh-report-icon--print");x.setAttribute("role","menuitem"),x.setAttribute("tabindex","-1"),x.setAttribute("href","#"),x.setAttribute("data-i18n","dropdownPrintExpanded"),x.setAttribute("data-action","print-expanded");const k=e.createElement("a","lh-report-icon lh-report-icon--copy");k.setAttribute("role","menuitem"),k.setAttribute("tabindex","-1"),k.setAttribute("href","#"),k.setAttribute("data-i18n","dropdownCopyJSON"),k.setAttribute("data-action","copy");const E=e.createElement("a","lh-report-icon lh-report-icon--download lh-hidden");E.setAttribute("role","menuitem"),E.setAttribute("tabindex","-1"),E.setAttribute("href","#"),E.setAttribute("data-i18n","dropdownSaveHTML"),E.setAttribute("data-action","save-html");const A=e.createElement("a","lh-report-icon lh-report-icon--download");A.setAttribute("role","menuitem"),A.setAttribute("tabindex","-1"),A.setAttribute("href","#"),A.setAttribute("data-i18n","dropdownSaveJSON"),A.setAttribute("data-action","save-json");const S=e.createElement("a","lh-report-icon lh-report-icon--open");S.setAttribute("role","menuitem"),S.setAttribute("tabindex","-1"),S.setAttribute("href","#"),S.setAttribute("data-i18n","dropdownViewer"),S.setAttribute("data-action","open-viewer");const z=e.createElement("a","lh-report-icon lh-report-icon--open");z.setAttribute("role","menuitem"),z.setAttribute("tabindex","-1"),z.setAttribute("href","#"),z.setAttribute("data-i18n","dropdownSaveGist"),z.setAttribute("data-action","save-gist");const C=e.createElement("a","lh-report-icon lh-report-icon--dark");return C.setAttribute("role","menuitem"),C.setAttribute("tabindex","-1"),C.setAttribute("href","#"),C.setAttribute("data-i18n","dropdownDarkTheme"),C.setAttribute("data-action","toggle-dark"),w.append(" ",y," ",x," ",k," "," ",E," ",A," ",S," ",z," ",C," "),c.append(" ",d," ",f," ",w," "),r.append(" "," ",o," ",s," ",c," "),t.append(r),t}(e);case"warningsToplevel":return function(e){const t=e.createFragment(),n=e.createElement("div","lh-warnings lh-warnings--toplevel"),r=e.createElement("p","lh-warnings__msg"),o=e.createElement("ul");return n.append(" ",r," ",o," "),t.append(n),t}(e)}throw new Error("unexpected component: "+t)}(this,e),this._componentCache.set(e,t);return t.cloneNode(!0)}clearComponentCache(){this._componentCache.clear()}convertMarkdownLinkSnippets(e,t={}){const n=this.createElement("span");for(const o of r.splitMarkdownLink(e)){const e=o.text.includes("`")?this.convertMarkdownCodeSnippets(o.text):o.text;if(!o.isLink){n.append(e);continue}const r=new URL(o.linkHref);(["https://developers.google.com","https://web.dev","https://developer.chrome.com"].includes(r.origin)||t.alwaysAppendUtmSource)&&(r.searchParams.set("utm_source","lighthouse"),r.searchParams.set("utm_medium",this._lighthouseChannel));const i=this.createElement("a");i.rel="noopener",i.target="_blank",i.append(e),this.safelySetHref(i,r.href),n.append(i)}return n}safelySetHref(e,t){if((t=t||"").startsWith("#"))return void(e.href=t);let n;try{n=new URL(t)}catch(e){}n&&["https:","http:"].includes(n.protocol)&&(e.href=n.href)}safelySetBlobHref(e,t){if("text/html"!==t.type&&"application/json"!==t.type)throw new Error("Unsupported blob type");const n=URL.createObjectURL(t);e.href=n}convertMarkdownCodeSnippets(e){const t=this.createElement("span");for(const n of r.splitMarkdownCodeSpans(e))if(n.isCode){const e=this.createElement("code");e.textContent=n.text,t.append(e)}else t.append(this._document.createTextNode(n.text));return t}setLighthouseChannel(e){this._lighthouseChannel=e}document(){return this._document}isDevTools(){return!!this._document.querySelector(".lh-devtools")}find(e,t){const n=t.querySelector(e);if(null===n)throw new Error(`query ${e} not found`);return n}findAll(e,t){return Array.from(t.querySelectorAll(e))}fireEventOn(e,t=this._document,n){const r=new CustomEvent(e,n?{detail:n}:void 0);t.dispatchEvent(r)}saveFile(e,t){const n=this.createElement("a");n.download=t,this.safelySetBlobHref(n,e),this._document.body.append(n),n.click(),this._document.body.removeChild(n),setTimeout((()=>URL.revokeObjectURL(n.href)),500)}}
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
1034
|
+
position: fixed;
|
|
1035
|
+
left: -9999px;
|
|
1036
|
+
}
|
|
1037
|
+
.lh-metricfilter input[type='radio']:focus-visible + label {
|
|
1038
|
+
outline: -webkit-focus-ring-color auto 1px;
|
|
1039
|
+
}
|
|
1040
|
+
|
|
1041
|
+
.lh-metricfilter__label {
|
|
1042
|
+
display: inline-flex;
|
|
1043
|
+
padding: 0 4px;
|
|
1044
|
+
height: 16px;
|
|
1045
|
+
text-decoration: underline;
|
|
1046
|
+
align-items: center;
|
|
1047
|
+
cursor: pointer;
|
|
1048
|
+
font-size: 90%;
|
|
1049
|
+
}
|
|
1050
|
+
|
|
1051
|
+
.lh-metricfilter__label--active {
|
|
1052
|
+
background: var(--color-blue-primary);
|
|
1053
|
+
color: var(--color-white);
|
|
1054
|
+
border-radius: 3px;
|
|
1055
|
+
text-decoration: none;
|
|
1056
|
+
}
|
|
1057
|
+
/* Give the 'All' choice a more muted display */
|
|
1058
|
+
.lh-metricfilter__label--active[for="metric-All"] {
|
|
1059
|
+
background-color: var(--color-blue-200) !important;
|
|
1060
|
+
color: black !important;
|
|
1061
|
+
}
|
|
1062
|
+
|
|
1063
|
+
.lh-metricfilter__text {
|
|
1064
|
+
margin-right: 8px;
|
|
1065
|
+
}
|
|
1066
|
+
|
|
1067
|
+
/* If audits are filtered, hide the itemcount for Passed Audits\u2026 */
|
|
1068
|
+
.lh-category--filtered .lh-audit-group .lh-audit-group__itemcount {
|
|
1069
|
+
display: none;
|
|
1070
|
+
}
|
|
1071
|
+
|
|
1072
|
+
|
|
1073
|
+
.lh-audit__header:hover {
|
|
1074
|
+
background-color: var(--color-hover);
|
|
1075
|
+
}
|
|
1076
|
+
|
|
1077
|
+
/* We want to hide the browser's default arrow marker on summary elements. Admittedly, it's complicated. */
|
|
1078
|
+
.lh-root details > summary {
|
|
1079
|
+
/* Blink 89+ and Firefox will hide the arrow when display is changed from (new) default of \`list-item\` to block. https://chromestatus.com/feature/6730096436051968*/
|
|
1080
|
+
display: block;
|
|
1081
|
+
}
|
|
1082
|
+
/* Safari and Blink <=88 require using the -webkit-details-marker selector */
|
|
1083
|
+
.lh-root details > summary::-webkit-details-marker {
|
|
1084
|
+
display: none;
|
|
1085
|
+
}
|
|
1086
|
+
|
|
1087
|
+
/* Perf Metric */
|
|
1088
|
+
|
|
1089
|
+
.lh-metrics-container {
|
|
1090
|
+
display: grid;
|
|
1091
|
+
grid-auto-rows: 1fr;
|
|
1092
|
+
grid-template-columns: 1fr 1fr;
|
|
1093
|
+
grid-column-gap: var(--report-line-height);
|
|
1094
|
+
margin-bottom: var(--default-padding);
|
|
1095
|
+
}
|
|
1096
|
+
|
|
1097
|
+
.lh-metric {
|
|
1098
|
+
border-top: 1px solid var(--report-border-color-secondary);
|
|
1099
|
+
}
|
|
1100
|
+
|
|
1101
|
+
.lh-category:not(.lh--hoisted-meta) .lh-metric:nth-last-child(-n+2) {
|
|
1102
|
+
border-bottom: 1px solid var(--report-border-color-secondary);
|
|
1103
|
+
}
|
|
1104
|
+
|
|
1105
|
+
.lh-metric__innerwrap {
|
|
1106
|
+
display: grid;
|
|
1107
|
+
/**
|
|
1108
|
+
* Icon -- Metric Name
|
|
1109
|
+
* -- Metric Value
|
|
49
1110
|
*/
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
*
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
1111
|
+
grid-template-columns: calc(var(--score-icon-size) + var(--score-icon-margin-left) + var(--score-icon-margin-right)) 1fr;
|
|
1112
|
+
align-items: center;
|
|
1113
|
+
padding: var(--default-padding);
|
|
1114
|
+
}
|
|
1115
|
+
|
|
1116
|
+
.lh-metric__details {
|
|
1117
|
+
order: -1;
|
|
1118
|
+
}
|
|
1119
|
+
|
|
1120
|
+
.lh-metric__title {
|
|
1121
|
+
flex: 1;
|
|
1122
|
+
}
|
|
1123
|
+
|
|
1124
|
+
.lh-calclink {
|
|
1125
|
+
padding-left: calc(1ex / 3);
|
|
1126
|
+
}
|
|
1127
|
+
|
|
1128
|
+
.lh-metric__description {
|
|
1129
|
+
display: none;
|
|
1130
|
+
grid-column-start: 2;
|
|
1131
|
+
grid-column-end: 4;
|
|
1132
|
+
color: var(--report-text-color-secondary);
|
|
1133
|
+
}
|
|
1134
|
+
|
|
1135
|
+
.lh-metric__value {
|
|
1136
|
+
font-size: var(--metric-value-font-size);
|
|
1137
|
+
margin: calc(var(--default-padding) / 2) 0;
|
|
1138
|
+
white-space: nowrap; /* No wrapping between metric value and the icon */
|
|
1139
|
+
grid-column-start: 2;
|
|
1140
|
+
}
|
|
1141
|
+
|
|
1142
|
+
|
|
1143
|
+
@media screen and (max-width: 535px) {
|
|
1144
|
+
.lh-metrics-container {
|
|
1145
|
+
display: block;
|
|
1146
|
+
}
|
|
1147
|
+
|
|
1148
|
+
.lh-metric {
|
|
1149
|
+
border-bottom: none !important;
|
|
1150
|
+
}
|
|
1151
|
+
.lh-category:not(.lh--hoisted-meta) .lh-metric:nth-last-child(1) {
|
|
1152
|
+
border-bottom: 1px solid var(--report-border-color-secondary) !important;
|
|
1153
|
+
}
|
|
1154
|
+
|
|
1155
|
+
/* Change the grid to 3 columns for narrow viewport. */
|
|
1156
|
+
.lh-metric__innerwrap {
|
|
1157
|
+
/**
|
|
1158
|
+
* Icon -- Metric Name -- Metric Value
|
|
1159
|
+
*/
|
|
1160
|
+
grid-template-columns: calc(var(--score-icon-size) + var(--score-icon-margin-left) + var(--score-icon-margin-right)) 2fr 1fr;
|
|
1161
|
+
}
|
|
1162
|
+
.lh-metric__value {
|
|
1163
|
+
justify-self: end;
|
|
1164
|
+
grid-column-start: unset;
|
|
1165
|
+
}
|
|
1166
|
+
}
|
|
1167
|
+
|
|
1168
|
+
/* No-JS toggle switch */
|
|
1169
|
+
/* Keep this selector sync'd w/ \`magicSelector\` in report-ui-features-test.js */
|
|
1170
|
+
.lh-metrics-toggle__input:checked ~ .lh-metrics-container .lh-metric__description {
|
|
1171
|
+
display: block;
|
|
1172
|
+
}
|
|
1173
|
+
|
|
1174
|
+
/* TODO get rid of the SVGS and clean up these some more */
|
|
1175
|
+
.lh-metrics-toggle__input {
|
|
1176
|
+
opacity: 0;
|
|
1177
|
+
position: absolute;
|
|
1178
|
+
right: 0;
|
|
1179
|
+
top: 0px;
|
|
1180
|
+
}
|
|
1181
|
+
|
|
1182
|
+
.lh-metrics-toggle__input + div > label > .lh-metrics-toggle__labeltext--hide,
|
|
1183
|
+
.lh-metrics-toggle__input:checked + div > label > .lh-metrics-toggle__labeltext--show {
|
|
1184
|
+
display: none;
|
|
1185
|
+
}
|
|
1186
|
+
.lh-metrics-toggle__input:checked + div > label > .lh-metrics-toggle__labeltext--hide {
|
|
1187
|
+
display: inline;
|
|
1188
|
+
}
|
|
1189
|
+
.lh-metrics-toggle__input:focus + div > label {
|
|
1190
|
+
outline: -webkit-focus-ring-color auto 3px;
|
|
1191
|
+
}
|
|
1192
|
+
|
|
1193
|
+
.lh-metrics-toggle__label {
|
|
1194
|
+
cursor: pointer;
|
|
1195
|
+
font-size: var(--report-font-size-secondary);
|
|
1196
|
+
line-height: var(--report-line-height-secondary);
|
|
1197
|
+
color: var(--color-gray-700);
|
|
1198
|
+
}
|
|
1199
|
+
|
|
1200
|
+
/* Pushes the metric description toggle button to the right. */
|
|
1201
|
+
.lh-audit-group--metrics .lh-audit-group__header {
|
|
1202
|
+
display: flex;
|
|
1203
|
+
justify-content: space-between;
|
|
1204
|
+
}
|
|
1205
|
+
|
|
1206
|
+
.lh-metric__icon,
|
|
1207
|
+
.lh-scorescale-range::before {
|
|
1208
|
+
content: '';
|
|
1209
|
+
width: var(--score-icon-size);
|
|
1210
|
+
height: var(--score-icon-size);
|
|
1211
|
+
display: inline-block;
|
|
1212
|
+
margin: var(--score-icon-margin);
|
|
1213
|
+
}
|
|
1214
|
+
|
|
1215
|
+
.lh-metric--pass .lh-metric__value {
|
|
1216
|
+
color: var(--color-pass-secondary);
|
|
1217
|
+
}
|
|
1218
|
+
.lh-metric--pass .lh-metric__icon {
|
|
1219
|
+
border-radius: 100%;
|
|
1220
|
+
background: var(--color-pass);
|
|
1221
|
+
}
|
|
1222
|
+
|
|
1223
|
+
.lh-metric--average .lh-metric__value {
|
|
1224
|
+
color: var(--color-average-secondary);
|
|
1225
|
+
}
|
|
1226
|
+
.lh-metric--average .lh-metric__icon {
|
|
1227
|
+
background: var(--color-average);
|
|
1228
|
+
width: var(--icon-square-size);
|
|
1229
|
+
height: var(--icon-square-size);
|
|
1230
|
+
}
|
|
1231
|
+
|
|
1232
|
+
.lh-metric--fail .lh-metric__value {
|
|
1233
|
+
color: var(--color-fail-secondary);
|
|
1234
|
+
}
|
|
1235
|
+
.lh-metric--fail .lh-metric__icon {
|
|
1236
|
+
border-left: calc(var(--score-icon-size) / 2) solid transparent;
|
|
1237
|
+
border-right: calc(var(--score-icon-size) / 2) solid transparent;
|
|
1238
|
+
border-bottom: var(--score-icon-size) solid var(--color-fail);
|
|
1239
|
+
}
|
|
1240
|
+
|
|
1241
|
+
.lh-metric--error .lh-metric__value,
|
|
1242
|
+
.lh-metric--error .lh-metric__description {
|
|
1243
|
+
color: var(--color-fail-secondary);
|
|
1244
|
+
}
|
|
1245
|
+
|
|
1246
|
+
/* Perf load opportunity */
|
|
1247
|
+
|
|
1248
|
+
.lh-load-opportunity__cols {
|
|
1249
|
+
display: flex;
|
|
1250
|
+
align-items: flex-start;
|
|
1251
|
+
}
|
|
1252
|
+
|
|
1253
|
+
.lh-load-opportunity__header .lh-load-opportunity__col {
|
|
1254
|
+
color: var(--color-gray-600);
|
|
1255
|
+
display: unset;
|
|
1256
|
+
line-height: calc(2.3 * var(--report-font-size));
|
|
1257
|
+
}
|
|
1258
|
+
|
|
1259
|
+
.lh-load-opportunity__col {
|
|
1260
|
+
display: flex;
|
|
1261
|
+
}
|
|
1262
|
+
|
|
1263
|
+
.lh-load-opportunity__col--one {
|
|
1264
|
+
flex: 5;
|
|
1265
|
+
align-items: center;
|
|
1266
|
+
margin-right: 2px;
|
|
1267
|
+
}
|
|
1268
|
+
.lh-load-opportunity__col--two {
|
|
1269
|
+
flex: 4;
|
|
1270
|
+
text-align: right;
|
|
1271
|
+
}
|
|
1272
|
+
|
|
1273
|
+
.lh-audit--load-opportunity .lh-audit__display-text {
|
|
1274
|
+
text-align: right;
|
|
1275
|
+
flex: 0 0 7.5ch;
|
|
1276
|
+
}
|
|
1277
|
+
|
|
1278
|
+
|
|
1279
|
+
/* Sparkline */
|
|
1280
|
+
|
|
1281
|
+
.lh-load-opportunity__sparkline {
|
|
1282
|
+
flex: 1;
|
|
1283
|
+
margin-top: calc((var(--report-line-height) - var(--sparkline-height)) / 2);
|
|
1284
|
+
}
|
|
1285
|
+
|
|
1286
|
+
.lh-sparkline {
|
|
1287
|
+
height: var(--sparkline-height);
|
|
1288
|
+
width: 100%;
|
|
1289
|
+
}
|
|
1290
|
+
|
|
1291
|
+
.lh-sparkline__bar {
|
|
1292
|
+
height: 100%;
|
|
1293
|
+
float: right;
|
|
1294
|
+
}
|
|
1295
|
+
|
|
1296
|
+
.lh-audit--pass .lh-sparkline__bar {
|
|
1297
|
+
background: var(--color-pass);
|
|
1298
|
+
}
|
|
1299
|
+
|
|
1300
|
+
.lh-audit--average .lh-sparkline__bar {
|
|
1301
|
+
background: var(--color-average);
|
|
1302
|
+
}
|
|
1303
|
+
|
|
1304
|
+
.lh-audit--fail .lh-sparkline__bar {
|
|
1305
|
+
background: var(--color-fail);
|
|
1306
|
+
}
|
|
1307
|
+
|
|
1308
|
+
/* Filmstrip */
|
|
1309
|
+
|
|
1310
|
+
.lh-filmstrip-container {
|
|
1311
|
+
/* smaller gap between metrics and filmstrip */
|
|
1312
|
+
margin: -8px auto 0 auto;
|
|
1313
|
+
}
|
|
1314
|
+
|
|
1315
|
+
.lh-filmstrip {
|
|
1316
|
+
display: grid;
|
|
1317
|
+
justify-content: space-between;
|
|
1318
|
+
padding-bottom: var(--default-padding);
|
|
1319
|
+
width: 100%;
|
|
1320
|
+
grid-template-columns: repeat(auto-fit, 90px);
|
|
1321
|
+
}
|
|
1322
|
+
|
|
1323
|
+
.lh-filmstrip__frame {
|
|
1324
|
+
text-align: right;
|
|
1325
|
+
position: relative;
|
|
1326
|
+
}
|
|
1327
|
+
|
|
1328
|
+
.lh-filmstrip__thumbnail {
|
|
1329
|
+
border: 1px solid var(--report-border-color-secondary);
|
|
1330
|
+
max-height: 150px;
|
|
1331
|
+
max-width: 120px;
|
|
1332
|
+
}
|
|
1333
|
+
|
|
1334
|
+
/* Audit */
|
|
1335
|
+
|
|
1336
|
+
.lh-audit {
|
|
1337
|
+
border-bottom: 1px solid var(--report-border-color-secondary);
|
|
1338
|
+
}
|
|
1339
|
+
|
|
1340
|
+
/* Apply border-top to just the first audit. */
|
|
1341
|
+
.lh-audit {
|
|
1342
|
+
border-top: 1px solid var(--report-border-color-secondary);
|
|
1343
|
+
}
|
|
1344
|
+
.lh-audit ~ .lh-audit {
|
|
1345
|
+
border-top: none;
|
|
1346
|
+
}
|
|
1347
|
+
|
|
1348
|
+
|
|
1349
|
+
.lh-audit--error .lh-audit__display-text {
|
|
1350
|
+
color: var(--color-fail-secondary);
|
|
1351
|
+
}
|
|
1352
|
+
|
|
1353
|
+
/* Audit Group */
|
|
1354
|
+
|
|
1355
|
+
.lh-audit-group {
|
|
1356
|
+
margin-bottom: var(--audit-group-margin-bottom);
|
|
1357
|
+
position: relative;
|
|
1358
|
+
}
|
|
1359
|
+
.lh-audit-group--metrics {
|
|
1360
|
+
margin-bottom: calc(var(--audit-group-margin-bottom) / 2);
|
|
1361
|
+
}
|
|
1362
|
+
|
|
1363
|
+
.lh-audit-group__header::before {
|
|
1364
|
+
/* By default, groups don't get an icon */
|
|
1365
|
+
content: none;
|
|
1366
|
+
width: var(--pwa-icon-size);
|
|
1367
|
+
height: var(--pwa-icon-size);
|
|
1368
|
+
margin: var(--pwa-icon-margin);
|
|
1369
|
+
display: inline-block;
|
|
1370
|
+
vertical-align: middle;
|
|
1371
|
+
}
|
|
1372
|
+
|
|
1373
|
+
/* Style the "over budget" columns red. */
|
|
1374
|
+
.lh-audit-group--budgets #performance-budget tbody tr td:nth-child(4),
|
|
1375
|
+
.lh-audit-group--budgets #performance-budget tbody tr td:nth-child(5),
|
|
1376
|
+
.lh-audit-group--budgets #timing-budget tbody tr td:nth-child(3) {
|
|
1377
|
+
color: var(--color-red-700);
|
|
1378
|
+
}
|
|
1379
|
+
|
|
1380
|
+
/* Align the "over budget request count" text to be close to the "over budget bytes" column. */
|
|
1381
|
+
.lh-audit-group--budgets .lh-table tbody tr td:nth-child(4){
|
|
1382
|
+
text-align: right;
|
|
1383
|
+
}
|
|
1384
|
+
|
|
1385
|
+
.lh-audit-group--budgets .lh-details--budget {
|
|
1386
|
+
width: 100%;
|
|
1387
|
+
margin: 0 0 var(--default-padding);
|
|
1388
|
+
}
|
|
1389
|
+
|
|
1390
|
+
.lh-audit-group--pwa-installable .lh-audit-group__header::before {
|
|
1391
|
+
content: '';
|
|
1392
|
+
background-image: var(--pwa-installable-gray-url);
|
|
1393
|
+
}
|
|
1394
|
+
.lh-audit-group--pwa-optimized .lh-audit-group__header::before {
|
|
1395
|
+
content: '';
|
|
1396
|
+
background-image: var(--pwa-optimized-gray-url);
|
|
1397
|
+
}
|
|
1398
|
+
.lh-audit-group--pwa-installable.lh-badged .lh-audit-group__header::before {
|
|
1399
|
+
background-image: var(--pwa-installable-color-url);
|
|
1400
|
+
}
|
|
1401
|
+
.lh-audit-group--pwa-optimized.lh-badged .lh-audit-group__header::before {
|
|
1402
|
+
background-image: var(--pwa-optimized-color-url);
|
|
1403
|
+
}
|
|
1404
|
+
|
|
1405
|
+
.lh-audit-group--metrics .lh-audit-group__summary {
|
|
1406
|
+
margin-top: 0;
|
|
1407
|
+
margin-bottom: 0;
|
|
1408
|
+
}
|
|
1409
|
+
|
|
1410
|
+
.lh-audit-group__summary {
|
|
1411
|
+
display: flex;
|
|
1412
|
+
justify-content: space-between;
|
|
1413
|
+
align-items: center;
|
|
1414
|
+
}
|
|
1415
|
+
|
|
1416
|
+
.lh-audit-group__header .lh-chevron {
|
|
1417
|
+
margin-top: calc((var(--report-line-height) - 5px) / 2);
|
|
1418
|
+
}
|
|
1419
|
+
|
|
1420
|
+
.lh-audit-group__header {
|
|
1421
|
+
letter-spacing: 0.8px;
|
|
1422
|
+
padding: var(--default-padding);
|
|
1423
|
+
padding-left: 0;
|
|
1424
|
+
}
|
|
1425
|
+
|
|
1426
|
+
.lh-audit-group__header, .lh-audit-group__summary {
|
|
1427
|
+
font-size: var(--report-font-size-secondary);
|
|
1428
|
+
line-height: var(--report-line-height-secondary);
|
|
1429
|
+
color: var(--color-gray-700);
|
|
1430
|
+
}
|
|
1431
|
+
|
|
1432
|
+
.lh-audit-group__title {
|
|
1433
|
+
text-transform: uppercase;
|
|
1434
|
+
font-weight: 500;
|
|
1435
|
+
}
|
|
1436
|
+
|
|
1437
|
+
.lh-audit-group__itemcount {
|
|
1438
|
+
color: var(--color-gray-600);
|
|
1439
|
+
}
|
|
1440
|
+
|
|
1441
|
+
.lh-audit-group__footer {
|
|
1442
|
+
color: var(--color-gray-600);
|
|
1443
|
+
display: block;
|
|
1444
|
+
margin-top: var(--default-padding);
|
|
1445
|
+
}
|
|
1446
|
+
|
|
1447
|
+
.lh-details,
|
|
1448
|
+
.lh-category-header__description,
|
|
1449
|
+
.lh-load-opportunity__header,
|
|
1450
|
+
.lh-audit-group__footer {
|
|
1451
|
+
font-size: var(--report-font-size-secondary);
|
|
1452
|
+
line-height: var(--report-line-height-secondary);
|
|
1453
|
+
}
|
|
1454
|
+
|
|
1455
|
+
.lh-audit-explanation {
|
|
1456
|
+
margin: var(--audit-padding-vertical) 0 calc(var(--audit-padding-vertical) / 2) var(--audit-margin-horizontal);
|
|
1457
|
+
line-height: var(--audit-explanation-line-height);
|
|
1458
|
+
display: inline-block;
|
|
1459
|
+
}
|
|
1460
|
+
|
|
1461
|
+
.lh-audit--fail .lh-audit-explanation {
|
|
1462
|
+
color: var(--color-fail-secondary);
|
|
1463
|
+
}
|
|
1464
|
+
|
|
1465
|
+
/* Report */
|
|
1466
|
+
.lh-list > :not(:last-child) {
|
|
1467
|
+
margin-bottom: calc(var(--default-padding) * 2);
|
|
1468
|
+
}
|
|
1469
|
+
|
|
1470
|
+
.lh-header-container {
|
|
1471
|
+
display: block;
|
|
1472
|
+
margin: 0 auto;
|
|
1473
|
+
position: relative;
|
|
1474
|
+
word-wrap: break-word;
|
|
1475
|
+
}
|
|
1476
|
+
|
|
1477
|
+
.lh-header-container .lh-scores-wrapper {
|
|
1478
|
+
border-bottom: 1px solid var(--color-gray-200);
|
|
1479
|
+
}
|
|
1480
|
+
|
|
1481
|
+
|
|
1482
|
+
.lh-report {
|
|
1483
|
+
min-width: var(--report-content-min-width);
|
|
1484
|
+
}
|
|
1485
|
+
|
|
1486
|
+
.lh-exception {
|
|
1487
|
+
font-size: large;
|
|
1488
|
+
}
|
|
1489
|
+
|
|
1490
|
+
.lh-code {
|
|
1491
|
+
white-space: normal;
|
|
1492
|
+
margin-top: 0;
|
|
1493
|
+
font-size: var(--report-monospace-font-size);
|
|
1494
|
+
}
|
|
1495
|
+
|
|
1496
|
+
.lh-warnings {
|
|
1497
|
+
--item-margin: calc(var(--report-line-height) / 6);
|
|
1498
|
+
color: var(--color-average-secondary);
|
|
1499
|
+
margin: var(--audit-padding-vertical) 0;
|
|
1500
|
+
padding: var(--default-padding)
|
|
1501
|
+
var(--default-padding)
|
|
1502
|
+
var(--default-padding)
|
|
1503
|
+
calc(var(--audit-description-padding-left));
|
|
1504
|
+
background-color: var(--toplevel-warning-background-color);
|
|
1505
|
+
}
|
|
1506
|
+
.lh-warnings span {
|
|
1507
|
+
font-weight: bold;
|
|
1508
|
+
}
|
|
1509
|
+
|
|
1510
|
+
.lh-warnings--toplevel {
|
|
1511
|
+
--item-margin: calc(var(--header-line-height) / 4);
|
|
1512
|
+
color: var(--toplevel-warning-text-color);
|
|
1513
|
+
margin-left: auto;
|
|
1514
|
+
margin-right: auto;
|
|
1515
|
+
max-width: var(--report-content-max-width-minus-edge-gap);
|
|
1516
|
+
padding: var(--toplevel-warning-padding);
|
|
1517
|
+
border-radius: 8px;
|
|
1518
|
+
}
|
|
1519
|
+
|
|
1520
|
+
.lh-warnings__msg {
|
|
1521
|
+
color: var(--toplevel-warning-message-text-color);
|
|
1522
|
+
margin: 0;
|
|
1523
|
+
}
|
|
1524
|
+
|
|
1525
|
+
.lh-warnings ul {
|
|
1526
|
+
margin: 0;
|
|
1527
|
+
}
|
|
1528
|
+
.lh-warnings li {
|
|
1529
|
+
margin: var(--item-margin) 0;
|
|
1530
|
+
}
|
|
1531
|
+
.lh-warnings li:last-of-type {
|
|
1532
|
+
margin-bottom: 0;
|
|
1533
|
+
}
|
|
1534
|
+
|
|
1535
|
+
.lh-scores-header {
|
|
1536
|
+
display: flex;
|
|
1537
|
+
flex-wrap: wrap;
|
|
1538
|
+
justify-content: center;
|
|
1539
|
+
}
|
|
1540
|
+
.lh-scores-header__solo {
|
|
1541
|
+
padding: 0;
|
|
1542
|
+
border: 0;
|
|
1543
|
+
}
|
|
1544
|
+
|
|
1545
|
+
/* Gauge */
|
|
1546
|
+
|
|
1547
|
+
.lh-gauge__wrapper--pass {
|
|
1548
|
+
color: var(--color-pass-secondary);
|
|
1549
|
+
fill: var(--color-pass);
|
|
1550
|
+
stroke: var(--color-pass);
|
|
1551
|
+
}
|
|
1552
|
+
|
|
1553
|
+
.lh-gauge__wrapper--average {
|
|
1554
|
+
color: var(--color-average-secondary);
|
|
1555
|
+
fill: var(--color-average);
|
|
1556
|
+
stroke: var(--color-average);
|
|
1557
|
+
}
|
|
1558
|
+
|
|
1559
|
+
.lh-gauge__wrapper--fail {
|
|
1560
|
+
color: var(--color-fail-secondary);
|
|
1561
|
+
fill: var(--color-fail);
|
|
1562
|
+
stroke: var(--color-fail);
|
|
1563
|
+
}
|
|
1564
|
+
|
|
1565
|
+
.lh-gauge__wrapper--not-applicable {
|
|
1566
|
+
color: var(--color-not-applicable);
|
|
1567
|
+
fill: var(--color-not-applicable);
|
|
1568
|
+
stroke: var(--color-not-applicable);
|
|
1569
|
+
}
|
|
1570
|
+
|
|
1571
|
+
.lh-fraction__wrapper .lh-fraction__content::before {
|
|
1572
|
+
content: '';
|
|
1573
|
+
height: var(--score-icon-size);
|
|
1574
|
+
width: var(--score-icon-size);
|
|
1575
|
+
margin: var(--score-icon-margin);
|
|
1576
|
+
display: inline-block;
|
|
1577
|
+
}
|
|
1578
|
+
.lh-fraction__wrapper--pass .lh-fraction__content {
|
|
1579
|
+
color: var(--color-pass-secondary);
|
|
1580
|
+
}
|
|
1581
|
+
.lh-fraction__wrapper--pass .lh-fraction__background {
|
|
1582
|
+
background-color: var(--color-pass);
|
|
1583
|
+
}
|
|
1584
|
+
.lh-fraction__wrapper--pass .lh-fraction__content::before {
|
|
1585
|
+
background-color: var(--color-pass);
|
|
1586
|
+
border-radius: 50%;
|
|
1587
|
+
}
|
|
1588
|
+
.lh-fraction__wrapper--average .lh-fraction__content {
|
|
1589
|
+
color: var(--color-average-secondary);
|
|
1590
|
+
}
|
|
1591
|
+
.lh-fraction__wrapper--average .lh-fraction__background,
|
|
1592
|
+
.lh-fraction__wrapper--average .lh-fraction__content::before {
|
|
1593
|
+
background-color: var(--color-average);
|
|
1594
|
+
}
|
|
1595
|
+
.lh-fraction__wrapper--fail .lh-fraction__content {
|
|
1596
|
+
color: var(--color-fail);
|
|
1597
|
+
}
|
|
1598
|
+
.lh-fraction__wrapper--fail .lh-fraction__background {
|
|
1599
|
+
background-color: var(--color-fail);
|
|
1600
|
+
}
|
|
1601
|
+
.lh-fraction__wrapper--fail .lh-fraction__content::before {
|
|
1602
|
+
border-left: calc(var(--score-icon-size) / 2) solid transparent;
|
|
1603
|
+
border-right: calc(var(--score-icon-size) / 2) solid transparent;
|
|
1604
|
+
border-bottom: var(--score-icon-size) solid var(--color-fail);
|
|
1605
|
+
}
|
|
1606
|
+
.lh-fraction__wrapper--null .lh-fraction__content {
|
|
1607
|
+
color: var(--color-gray-700);
|
|
1608
|
+
}
|
|
1609
|
+
.lh-fraction__wrapper--null .lh-fraction__background {
|
|
1610
|
+
background-color: var(--color-gray-700);
|
|
1611
|
+
}
|
|
1612
|
+
.lh-fraction__wrapper--null .lh-fraction__content::before {
|
|
1613
|
+
border-radius: 50%;
|
|
1614
|
+
border: calc(0.2 * var(--score-icon-size)) solid var(--color-gray-700);
|
|
1615
|
+
}
|
|
1616
|
+
|
|
1617
|
+
.lh-fraction__background {
|
|
1618
|
+
position: absolute;
|
|
1619
|
+
height: 100%;
|
|
1620
|
+
width: 100%;
|
|
1621
|
+
border-radius: calc(var(--gauge-circle-size) / 2);
|
|
1622
|
+
opacity: 0.1;
|
|
1623
|
+
z-index: -1;
|
|
1624
|
+
}
|
|
1625
|
+
|
|
1626
|
+
.lh-fraction__content-wrapper {
|
|
1627
|
+
height: var(--gauge-circle-size);
|
|
1628
|
+
display: flex;
|
|
1629
|
+
align-items: center;
|
|
1630
|
+
}
|
|
1631
|
+
|
|
1632
|
+
.lh-fraction__content {
|
|
1633
|
+
display: flex;
|
|
1634
|
+
position: relative;
|
|
1635
|
+
align-items: center;
|
|
1636
|
+
justify-content: center;
|
|
1637
|
+
font-size: calc(0.3 * var(--gauge-circle-size));
|
|
1638
|
+
line-height: calc(0.4 * var(--gauge-circle-size));
|
|
1639
|
+
width: max-content;
|
|
1640
|
+
min-width: calc(1.5 * var(--gauge-circle-size));
|
|
1641
|
+
padding: calc(0.1 * var(--gauge-circle-size)) calc(0.2 * var(--gauge-circle-size));
|
|
1642
|
+
--score-icon-size: calc(0.21 * var(--gauge-circle-size));
|
|
1643
|
+
--score-icon-margin: 0 calc(0.15 * var(--gauge-circle-size)) 0 0;
|
|
1644
|
+
}
|
|
1645
|
+
|
|
1646
|
+
.lh-gauge {
|
|
1647
|
+
stroke-linecap: round;
|
|
1648
|
+
width: var(--gauge-circle-size);
|
|
1649
|
+
height: var(--gauge-circle-size);
|
|
1650
|
+
}
|
|
1651
|
+
|
|
1652
|
+
.lh-category .lh-gauge {
|
|
1653
|
+
--gauge-circle-size: var(--gauge-circle-size-big);
|
|
1654
|
+
}
|
|
1655
|
+
|
|
1656
|
+
.lh-gauge-base {
|
|
1657
|
+
opacity: 0.1;
|
|
1658
|
+
}
|
|
1659
|
+
|
|
1660
|
+
.lh-gauge-arc {
|
|
1661
|
+
fill: none;
|
|
1662
|
+
transform-origin: 50% 50%;
|
|
1663
|
+
animation: load-gauge var(--transition-length) ease both;
|
|
1664
|
+
animation-delay: 250ms;
|
|
1665
|
+
}
|
|
1666
|
+
|
|
1667
|
+
.lh-gauge__svg-wrapper {
|
|
1668
|
+
position: relative;
|
|
1669
|
+
height: var(--gauge-circle-size);
|
|
1670
|
+
}
|
|
1671
|
+
.lh-category .lh-gauge__svg-wrapper,
|
|
1672
|
+
.lh-category .lh-fraction__wrapper {
|
|
1673
|
+
--gauge-circle-size: var(--gauge-circle-size-big);
|
|
1674
|
+
}
|
|
1675
|
+
|
|
1676
|
+
/* The plugin badge overlay */
|
|
1677
|
+
.lh-gauge__wrapper--plugin .lh-gauge__svg-wrapper::before {
|
|
1678
|
+
width: var(--plugin-badge-size);
|
|
1679
|
+
height: var(--plugin-badge-size);
|
|
1680
|
+
background-color: var(--plugin-badge-background-color);
|
|
1681
|
+
background-image: var(--plugin-icon-url);
|
|
1682
|
+
background-repeat: no-repeat;
|
|
1683
|
+
background-size: var(--plugin-icon-size);
|
|
1684
|
+
background-position: 58% 50%;
|
|
1685
|
+
content: "";
|
|
1686
|
+
position: absolute;
|
|
1687
|
+
right: -6px;
|
|
1688
|
+
bottom: 0px;
|
|
1689
|
+
display: block;
|
|
1690
|
+
z-index: 100;
|
|
1691
|
+
box-shadow: 0 0 4px rgba(0,0,0,.2);
|
|
1692
|
+
border-radius: 25%;
|
|
1693
|
+
}
|
|
1694
|
+
.lh-category .lh-gauge__wrapper--plugin .lh-gauge__svg-wrapper::before {
|
|
1695
|
+
width: var(--plugin-badge-size-big);
|
|
1696
|
+
height: var(--plugin-badge-size-big);
|
|
1697
|
+
}
|
|
1698
|
+
|
|
1699
|
+
@keyframes load-gauge {
|
|
1700
|
+
from { stroke-dasharray: 0 352; }
|
|
1701
|
+
}
|
|
1702
|
+
|
|
1703
|
+
.lh-gauge__percentage {
|
|
1704
|
+
width: 100%;
|
|
1705
|
+
height: var(--gauge-circle-size);
|
|
1706
|
+
position: absolute;
|
|
1707
|
+
font-family: var(--report-font-family-monospace);
|
|
1708
|
+
font-size: calc(var(--gauge-circle-size) * 0.34 + 1.3px);
|
|
1709
|
+
line-height: 0;
|
|
1710
|
+
text-align: center;
|
|
1711
|
+
top: calc(var(--score-container-padding) + var(--gauge-circle-size) / 2);
|
|
1712
|
+
}
|
|
1713
|
+
|
|
1714
|
+
.lh-category .lh-gauge__percentage {
|
|
1715
|
+
--gauge-circle-size: var(--gauge-circle-size-big);
|
|
1716
|
+
--gauge-percentage-font-size: var(--gauge-percentage-font-size-big);
|
|
1717
|
+
}
|
|
1718
|
+
|
|
1719
|
+
.lh-gauge__wrapper,
|
|
1720
|
+
.lh-fraction__wrapper {
|
|
1721
|
+
position: relative;
|
|
1722
|
+
display: flex;
|
|
1723
|
+
align-items: center;
|
|
1724
|
+
flex-direction: column;
|
|
1725
|
+
text-decoration: none;
|
|
1726
|
+
padding: var(--score-container-padding);
|
|
1727
|
+
|
|
1728
|
+
--transition-length: 1s;
|
|
1729
|
+
|
|
1730
|
+
/* Contain the layout style paint & layers during animation*/
|
|
1731
|
+
contain: content;
|
|
1732
|
+
will-change: opacity; /* Only using for layer promotion */
|
|
1733
|
+
}
|
|
1734
|
+
|
|
1735
|
+
.lh-gauge__label,
|
|
1736
|
+
.lh-fraction__label {
|
|
1737
|
+
font-size: var(--gauge-label-font-size);
|
|
1738
|
+
font-weight: 500;
|
|
1739
|
+
line-height: var(--gauge-label-line-height);
|
|
1740
|
+
margin-top: 10px;
|
|
1741
|
+
text-align: center;
|
|
1742
|
+
color: var(--report-text-color);
|
|
1743
|
+
word-break: keep-all;
|
|
1744
|
+
}
|
|
1745
|
+
|
|
1746
|
+
/* TODO(#8185) use more BEM (.lh-gauge__label--big) instead of relying on descendant selector */
|
|
1747
|
+
.lh-category .lh-gauge__label,
|
|
1748
|
+
.lh-category .lh-fraction__label {
|
|
1749
|
+
--gauge-label-font-size: var(--gauge-label-font-size-big);
|
|
1750
|
+
--gauge-label-line-height: var(--gauge-label-line-height-big);
|
|
1751
|
+
margin-top: 14px;
|
|
1752
|
+
}
|
|
1753
|
+
|
|
1754
|
+
.lh-scores-header .lh-gauge__wrapper,
|
|
1755
|
+
.lh-scores-header .lh-fraction__wrapper,
|
|
1756
|
+
.lh-scores-header .lh-gauge--pwa__wrapper,
|
|
1757
|
+
.lh-sticky-header .lh-gauge__wrapper,
|
|
1758
|
+
.lh-sticky-header .lh-fraction__wrapper,
|
|
1759
|
+
.lh-sticky-header .lh-gauge--pwa__wrapper {
|
|
1760
|
+
width: var(--gauge-wrapper-width);
|
|
1761
|
+
}
|
|
1762
|
+
|
|
1763
|
+
.lh-scorescale {
|
|
1764
|
+
display: inline-flex;
|
|
1765
|
+
|
|
1766
|
+
gap: calc(var(--default-padding) * 4);
|
|
1767
|
+
margin: 16px auto 0 auto;
|
|
1768
|
+
font-size: var(--report-font-size-secondary);
|
|
1769
|
+
color: var(--color-gray-700);
|
|
1770
|
+
|
|
1771
|
+
}
|
|
1772
|
+
|
|
1773
|
+
.lh-scorescale-range {
|
|
1774
|
+
display: flex;
|
|
1775
|
+
align-items: center;
|
|
1776
|
+
font-family: var(--report-font-family-monospace);
|
|
1777
|
+
white-space: nowrap;
|
|
1778
|
+
}
|
|
1779
|
+
|
|
1780
|
+
.lh-category-header__finalscreenshot .lh-scorescale {
|
|
1781
|
+
border: 0;
|
|
1782
|
+
display: flex;
|
|
1783
|
+
justify-content: center;
|
|
1784
|
+
}
|
|
1785
|
+
|
|
1786
|
+
.lh-category-header__finalscreenshot .lh-scorescale-range {
|
|
1787
|
+
font-family: unset;
|
|
1788
|
+
font-size: 12px;
|
|
1789
|
+
}
|
|
1790
|
+
|
|
1791
|
+
.lh-scorescale-wrap {
|
|
1792
|
+
display: contents;
|
|
1793
|
+
}
|
|
1794
|
+
|
|
1795
|
+
/* Hide category score gauages if it's a single category report */
|
|
1796
|
+
.lh-header--solo-category .lh-scores-wrapper {
|
|
1797
|
+
display: none;
|
|
1798
|
+
}
|
|
1799
|
+
|
|
1800
|
+
|
|
1801
|
+
.lh-categories {
|
|
1802
|
+
width: 100%;
|
|
1803
|
+
}
|
|
1804
|
+
|
|
1805
|
+
.lh-category {
|
|
1806
|
+
padding: var(--category-padding);
|
|
1807
|
+
max-width: var(--report-content-max-width);
|
|
1808
|
+
margin: 0 auto;
|
|
1809
|
+
|
|
1810
|
+
scroll-margin-top: var(--sticky-header-buffer);
|
|
1811
|
+
}
|
|
1812
|
+
|
|
1813
|
+
.lh-category-wrapper {
|
|
1814
|
+
border-bottom: 1px solid var(--color-gray-200);
|
|
1815
|
+
}
|
|
1816
|
+
.lh-category-wrapper:last-of-type {
|
|
1817
|
+
border-bottom: 0;
|
|
1818
|
+
}
|
|
1819
|
+
|
|
1820
|
+
.lh-category-header {
|
|
1821
|
+
margin-bottom: var(--section-padding-vertical);
|
|
1822
|
+
}
|
|
1823
|
+
|
|
1824
|
+
.lh-category-header .lh-score__gauge {
|
|
1825
|
+
max-width: 400px;
|
|
1826
|
+
width: auto;
|
|
1827
|
+
margin: 0px auto;
|
|
1828
|
+
}
|
|
1829
|
+
|
|
1830
|
+
.lh-category-header__finalscreenshot {
|
|
1831
|
+
display: grid;
|
|
1832
|
+
grid-template: none / 1fr 1px 1fr;
|
|
1833
|
+
justify-items: center;
|
|
1834
|
+
align-items: center;
|
|
1835
|
+
gap: var(--report-line-height);
|
|
1836
|
+
min-height: 288px;
|
|
1837
|
+
margin-bottom: var(--default-padding);
|
|
1838
|
+
}
|
|
1839
|
+
|
|
1840
|
+
.lh-final-ss-image {
|
|
1841
|
+
/* constrain the size of the image to not be too large */
|
|
1842
|
+
max-height: calc(var(--gauge-circle-size-big) * 2.8);
|
|
1843
|
+
max-width: calc(var(--gauge-circle-size-big) * 3.5);
|
|
1844
|
+
border: 1px solid var(--color-gray-200);
|
|
1845
|
+
padding: 4px;
|
|
1846
|
+
border-radius: 3px;
|
|
1847
|
+
display: block;
|
|
1848
|
+
}
|
|
1849
|
+
|
|
1850
|
+
.lh-category-headercol--separator {
|
|
1851
|
+
background: var(--color-gray-200);
|
|
1852
|
+
width: 1px;
|
|
1853
|
+
height: var(--gauge-circle-size-big);
|
|
1854
|
+
}
|
|
1855
|
+
|
|
1856
|
+
@media screen and (max-width: 780px) {
|
|
1857
|
+
.lh-category-header__finalscreenshot {
|
|
1858
|
+
grid-template: 1fr 1fr / none
|
|
1859
|
+
}
|
|
1860
|
+
.lh-category-headercol--separator {
|
|
1861
|
+
display: none;
|
|
1862
|
+
}
|
|
1863
|
+
}
|
|
1864
|
+
|
|
1865
|
+
|
|
1866
|
+
/* 964 fits the min-width of the filmstrip */
|
|
1867
|
+
@media screen and (max-width: 964px) {
|
|
1868
|
+
.lh-report {
|
|
1869
|
+
margin-left: 0;
|
|
1870
|
+
width: 100%;
|
|
1871
|
+
}
|
|
1872
|
+
}
|
|
1873
|
+
|
|
1874
|
+
@media print {
|
|
1875
|
+
body {
|
|
1876
|
+
-webkit-print-color-adjust: exact; /* print background colors */
|
|
1877
|
+
}
|
|
1878
|
+
.lh-container {
|
|
1879
|
+
display: block;
|
|
1880
|
+
}
|
|
1881
|
+
.lh-report {
|
|
1882
|
+
margin-left: 0;
|
|
1883
|
+
padding-top: 0;
|
|
1884
|
+
}
|
|
1885
|
+
.lh-categories {
|
|
1886
|
+
margin-top: 0;
|
|
1887
|
+
}
|
|
1888
|
+
}
|
|
1889
|
+
|
|
1890
|
+
.lh-table {
|
|
1891
|
+
position: relative;
|
|
1892
|
+
border-collapse: separate;
|
|
1893
|
+
border-spacing: 0;
|
|
1894
|
+
/* Can't assign padding to table, so shorten the width instead. */
|
|
1895
|
+
width: calc(100% - var(--audit-description-padding-left) - var(--stackpack-padding-horizontal));
|
|
1896
|
+
border: 1px solid var(--report-border-color-secondary);
|
|
1897
|
+
}
|
|
1898
|
+
|
|
1899
|
+
.lh-table thead th {
|
|
1900
|
+
position: sticky;
|
|
1901
|
+
top: calc(var(--sticky-header-buffer) + 1em);
|
|
1902
|
+
z-index: 1;
|
|
1903
|
+
background-color: var(--report-background-color);
|
|
1904
|
+
border-bottom: 1px solid var(--report-border-color-secondary);
|
|
1905
|
+
font-weight: normal;
|
|
1906
|
+
color: var(--color-gray-600);
|
|
1907
|
+
/* See text-wrapping comment on .lh-container. */
|
|
1908
|
+
word-break: normal;
|
|
1909
|
+
}
|
|
1910
|
+
|
|
1911
|
+
.lh-row--group {
|
|
1912
|
+
background-color: var(--table-group-header-background-color);
|
|
1913
|
+
}
|
|
1914
|
+
|
|
1915
|
+
.lh-row--group td {
|
|
1916
|
+
font-weight: bold;
|
|
1917
|
+
font-size: 1.05em;
|
|
1918
|
+
color: var(--table-group-header-text-color);
|
|
1919
|
+
}
|
|
1920
|
+
|
|
1921
|
+
.lh-row--group td:first-child {
|
|
1922
|
+
font-weight: normal;
|
|
1923
|
+
}
|
|
1924
|
+
|
|
1925
|
+
.lh-row--group .lh-text {
|
|
1926
|
+
color: inherit;
|
|
1927
|
+
text-decoration: none;
|
|
1928
|
+
display: inline-block;
|
|
1929
|
+
}
|
|
1930
|
+
|
|
1931
|
+
.lh-row--group a.lh-link:hover {
|
|
1932
|
+
text-decoration: underline;
|
|
1933
|
+
}
|
|
1934
|
+
|
|
1935
|
+
.lh-row--group .lh-audit__adorn {
|
|
1936
|
+
text-transform: capitalize;
|
|
1937
|
+
font-weight: normal;
|
|
1938
|
+
padding: 2px 3px 1px 3px;
|
|
1939
|
+
}
|
|
1940
|
+
|
|
1941
|
+
.lh-row--group .lh-audit__adorn1p {
|
|
1942
|
+
color: var(--link-color);
|
|
1943
|
+
border-color: var(--link-color);
|
|
1944
|
+
}
|
|
1945
|
+
|
|
1946
|
+
.lh-row--group .lh-report-icon--external::before {
|
|
1947
|
+
content: "";
|
|
1948
|
+
background-repeat: no-repeat;
|
|
1949
|
+
width: 14px;
|
|
1950
|
+
height: 16px;
|
|
1951
|
+
opacity: 0.7;
|
|
1952
|
+
display: inline-block;
|
|
1953
|
+
vertical-align: middle;
|
|
1954
|
+
}
|
|
1955
|
+
|
|
1956
|
+
.lh-row--group .lh-report-icon--external {
|
|
1957
|
+
display: none;
|
|
1958
|
+
}
|
|
1959
|
+
|
|
1960
|
+
.lh-row--group:hover .lh-report-icon--external {
|
|
1961
|
+
display: inline-block;
|
|
1962
|
+
}
|
|
1963
|
+
|
|
1964
|
+
.lh-dark .lh-report-icon--external::before {
|
|
1965
|
+
filter: invert(1);
|
|
1966
|
+
}
|
|
1967
|
+
|
|
1968
|
+
/** Manages indentation of two-level and three-level nested adjacent rows */
|
|
1969
|
+
|
|
1970
|
+
.lh-row--group ~ [data-entity]:not(.lh-row--group) td:first-child {
|
|
1971
|
+
padding-left: 20px;
|
|
1972
|
+
}
|
|
1973
|
+
|
|
1974
|
+
.lh-row--group ~ [data-entity]:not(.lh-row--group) ~ .lh-sub-item-row td:first-child {
|
|
1975
|
+
padding-left: 40px;
|
|
1976
|
+
}
|
|
1977
|
+
|
|
1978
|
+
.lh-row--even {
|
|
1979
|
+
background-color: var(--table-group-header-background-color);
|
|
1980
|
+
}
|
|
1981
|
+
.lh-row--hidden {
|
|
1982
|
+
display: none;
|
|
1983
|
+
}
|
|
1984
|
+
|
|
1985
|
+
.lh-table th,
|
|
1986
|
+
.lh-table td {
|
|
1987
|
+
padding: var(--default-padding);
|
|
1988
|
+
}
|
|
1989
|
+
|
|
1990
|
+
.lh-table tr {
|
|
1991
|
+
vertical-align: middle;
|
|
1992
|
+
}
|
|
1993
|
+
|
|
1994
|
+
.lh-table tr:hover {
|
|
1995
|
+
background-color: var(--table-higlight-background-color);
|
|
1996
|
+
}
|
|
1997
|
+
|
|
1998
|
+
/* Looks unnecessary, but mostly for keeping the <th>s left-aligned */
|
|
1999
|
+
.lh-table-column--text,
|
|
2000
|
+
.lh-table-column--source-location,
|
|
2001
|
+
.lh-table-column--url,
|
|
2002
|
+
/* .lh-table-column--thumbnail, */
|
|
2003
|
+
/* .lh-table-column--empty,*/
|
|
2004
|
+
.lh-table-column--code,
|
|
2005
|
+
.lh-table-column--node {
|
|
2006
|
+
text-align: left;
|
|
2007
|
+
}
|
|
2008
|
+
|
|
2009
|
+
.lh-table-column--code {
|
|
2010
|
+
min-width: 100px;
|
|
2011
|
+
}
|
|
2012
|
+
|
|
2013
|
+
.lh-table-column--bytes,
|
|
2014
|
+
.lh-table-column--timespanMs,
|
|
2015
|
+
.lh-table-column--ms,
|
|
2016
|
+
.lh-table-column--numeric {
|
|
2017
|
+
text-align: right;
|
|
2018
|
+
word-break: normal;
|
|
2019
|
+
}
|
|
2020
|
+
|
|
2021
|
+
|
|
2022
|
+
|
|
2023
|
+
.lh-table .lh-table-column--thumbnail {
|
|
2024
|
+
width: var(--image-preview-size);
|
|
2025
|
+
}
|
|
2026
|
+
|
|
2027
|
+
.lh-table-column--url {
|
|
2028
|
+
min-width: 250px;
|
|
2029
|
+
}
|
|
2030
|
+
|
|
2031
|
+
.lh-table-column--text {
|
|
2032
|
+
min-width: 80px;
|
|
2033
|
+
}
|
|
2034
|
+
|
|
2035
|
+
/* Keep columns narrow if they follow the URL column */
|
|
2036
|
+
/* 12% was determined to be a decent narrow width, but wide enough for column headings */
|
|
2037
|
+
.lh-table-column--url + th.lh-table-column--bytes,
|
|
2038
|
+
.lh-table-column--url + .lh-table-column--bytes + th.lh-table-column--bytes,
|
|
2039
|
+
.lh-table-column--url + .lh-table-column--ms,
|
|
2040
|
+
.lh-table-column--url + .lh-table-column--ms + th.lh-table-column--bytes,
|
|
2041
|
+
.lh-table-column--url + .lh-table-column--bytes + th.lh-table-column--timespanMs {
|
|
2042
|
+
width: 12%;
|
|
2043
|
+
}
|
|
2044
|
+
|
|
2045
|
+
.lh-text__url-host {
|
|
2046
|
+
display: inline;
|
|
2047
|
+
}
|
|
2048
|
+
|
|
2049
|
+
.lh-text__url-host {
|
|
2050
|
+
margin-left: calc(var(--report-font-size) / 2);
|
|
2051
|
+
opacity: 0.6;
|
|
2052
|
+
font-size: 90%
|
|
2053
|
+
}
|
|
2054
|
+
|
|
2055
|
+
.lh-thumbnail {
|
|
2056
|
+
object-fit: cover;
|
|
2057
|
+
width: var(--image-preview-size);
|
|
2058
|
+
height: var(--image-preview-size);
|
|
2059
|
+
display: block;
|
|
2060
|
+
}
|
|
2061
|
+
|
|
2062
|
+
.lh-unknown pre {
|
|
2063
|
+
overflow: scroll;
|
|
2064
|
+
border: solid 1px var(--color-gray-200);
|
|
2065
|
+
}
|
|
2066
|
+
|
|
2067
|
+
.lh-text__url > a {
|
|
2068
|
+
color: inherit;
|
|
2069
|
+
text-decoration: none;
|
|
2070
|
+
}
|
|
2071
|
+
|
|
2072
|
+
.lh-text__url > a:hover {
|
|
2073
|
+
text-decoration: underline dotted #999;
|
|
2074
|
+
}
|
|
2075
|
+
|
|
2076
|
+
.lh-sub-item-row {
|
|
2077
|
+
margin-left: 20px;
|
|
2078
|
+
margin-bottom: 0;
|
|
2079
|
+
color: var(--color-gray-700);
|
|
2080
|
+
}
|
|
2081
|
+
|
|
2082
|
+
.lh-sub-item-row td {
|
|
2083
|
+
padding-top: 4px;
|
|
2084
|
+
padding-bottom: 4px;
|
|
2085
|
+
padding-left: 20px;
|
|
2086
|
+
}
|
|
2087
|
+
|
|
2088
|
+
/* Chevron
|
|
2089
|
+
https://codepen.io/paulirish/pen/LmzEmK
|
|
2090
|
+
*/
|
|
2091
|
+
.lh-chevron {
|
|
2092
|
+
--chevron-angle: 42deg;
|
|
2093
|
+
/* Edge doesn't support transform: rotate(calc(...)), so we define it here */
|
|
2094
|
+
--chevron-angle-right: -42deg;
|
|
2095
|
+
width: var(--chevron-size);
|
|
2096
|
+
height: var(--chevron-size);
|
|
2097
|
+
margin-top: calc((var(--report-line-height) - 12px) / 2);
|
|
2098
|
+
}
|
|
2099
|
+
|
|
2100
|
+
.lh-chevron__lines {
|
|
2101
|
+
transition: transform 0.4s;
|
|
2102
|
+
transform: translateY(var(--report-line-height));
|
|
2103
|
+
}
|
|
2104
|
+
.lh-chevron__line {
|
|
2105
|
+
stroke: var(--chevron-line-stroke);
|
|
2106
|
+
stroke-width: var(--chevron-size);
|
|
2107
|
+
stroke-linecap: square;
|
|
2108
|
+
transform-origin: 50%;
|
|
2109
|
+
transform: rotate(var(--chevron-angle));
|
|
2110
|
+
transition: transform 300ms, stroke 300ms;
|
|
2111
|
+
}
|
|
2112
|
+
|
|
2113
|
+
.lh-expandable-details .lh-chevron__line-right,
|
|
2114
|
+
.lh-expandable-details[open] .lh-chevron__line-left {
|
|
2115
|
+
transform: rotate(var(--chevron-angle-right));
|
|
2116
|
+
}
|
|
2117
|
+
|
|
2118
|
+
.lh-expandable-details[open] .lh-chevron__line-right {
|
|
2119
|
+
transform: rotate(var(--chevron-angle));
|
|
2120
|
+
}
|
|
2121
|
+
|
|
2122
|
+
|
|
2123
|
+
.lh-expandable-details[open] .lh-chevron__lines {
|
|
2124
|
+
transform: translateY(calc(var(--chevron-size) * -1));
|
|
2125
|
+
}
|
|
2126
|
+
|
|
2127
|
+
.lh-expandable-details[open] {
|
|
2128
|
+
animation: 300ms openDetails forwards;
|
|
2129
|
+
padding-bottom: var(--default-padding);
|
|
2130
|
+
}
|
|
2131
|
+
|
|
2132
|
+
@keyframes openDetails {
|
|
2133
|
+
from {
|
|
2134
|
+
outline: 1px solid var(--report-background-color);
|
|
2135
|
+
}
|
|
2136
|
+
to {
|
|
2137
|
+
outline: 1px solid;
|
|
2138
|
+
box-shadow: 0 2px 4px rgba(0, 0, 0, .24);
|
|
2139
|
+
}
|
|
2140
|
+
}
|
|
2141
|
+
|
|
2142
|
+
@media screen and (max-width: 780px) {
|
|
2143
|
+
/* no black outline if we're not confident the entire table can be displayed within bounds */
|
|
2144
|
+
.lh-expandable-details[open] {
|
|
2145
|
+
animation: none;
|
|
2146
|
+
}
|
|
2147
|
+
}
|
|
2148
|
+
|
|
2149
|
+
.lh-expandable-details[open] summary, details.lh-clump > summary {
|
|
2150
|
+
border-bottom: 1px solid var(--report-border-color-secondary);
|
|
2151
|
+
}
|
|
2152
|
+
details.lh-clump[open] > summary {
|
|
2153
|
+
border-bottom-width: 0;
|
|
2154
|
+
}
|
|
2155
|
+
|
|
2156
|
+
|
|
2157
|
+
|
|
2158
|
+
details .lh-clump-toggletext--hide,
|
|
2159
|
+
details[open] .lh-clump-toggletext--show { display: none; }
|
|
2160
|
+
details[open] .lh-clump-toggletext--hide { display: block;}
|
|
2161
|
+
|
|
2162
|
+
|
|
2163
|
+
/* Tooltip */
|
|
2164
|
+
.lh-tooltip-boundary {
|
|
2165
|
+
position: relative;
|
|
2166
|
+
}
|
|
2167
|
+
|
|
2168
|
+
.lh-tooltip {
|
|
2169
|
+
position: absolute;
|
|
2170
|
+
display: none; /* Don't retain these layers when not needed */
|
|
2171
|
+
opacity: 0;
|
|
2172
|
+
background: #ffffff;
|
|
2173
|
+
white-space: pre-line; /* Render newlines in the text */
|
|
2174
|
+
min-width: 246px;
|
|
2175
|
+
max-width: 275px;
|
|
2176
|
+
padding: 15px;
|
|
2177
|
+
border-radius: 5px;
|
|
2178
|
+
text-align: initial;
|
|
2179
|
+
line-height: 1.4;
|
|
2180
|
+
}
|
|
2181
|
+
/* shrink tooltips to not be cutoff on left edge of narrow viewports
|
|
2182
|
+
45vw is chosen to be ~= width of the left column of metrics
|
|
2183
|
+
*/
|
|
2184
|
+
@media screen and (max-width: 535px) {
|
|
2185
|
+
.lh-tooltip {
|
|
2186
|
+
min-width: 45vw;
|
|
2187
|
+
padding: 3vw;
|
|
2188
|
+
}
|
|
2189
|
+
}
|
|
2190
|
+
|
|
2191
|
+
.lh-tooltip-boundary:hover .lh-tooltip {
|
|
2192
|
+
display: block;
|
|
2193
|
+
animation: fadeInTooltip 250ms;
|
|
2194
|
+
animation-fill-mode: forwards;
|
|
2195
|
+
animation-delay: 850ms;
|
|
2196
|
+
bottom: 100%;
|
|
2197
|
+
z-index: 1;
|
|
2198
|
+
will-change: opacity;
|
|
2199
|
+
right: 0;
|
|
2200
|
+
pointer-events: none;
|
|
2201
|
+
}
|
|
2202
|
+
|
|
2203
|
+
.lh-tooltip::before {
|
|
2204
|
+
content: "";
|
|
2205
|
+
border: solid transparent;
|
|
2206
|
+
border-bottom-color: #fff;
|
|
2207
|
+
border-width: 10px;
|
|
2208
|
+
position: absolute;
|
|
2209
|
+
bottom: -20px;
|
|
2210
|
+
right: 6px;
|
|
2211
|
+
transform: rotate(180deg);
|
|
2212
|
+
pointer-events: none;
|
|
2213
|
+
}
|
|
2214
|
+
|
|
2215
|
+
@keyframes fadeInTooltip {
|
|
2216
|
+
0% { opacity: 0; }
|
|
2217
|
+
75% { opacity: 1; }
|
|
2218
|
+
100% { opacity: 1; filter: drop-shadow(1px 0px 1px #aaa) drop-shadow(0px 2px 4px hsla(206, 6%, 25%, 0.15)); pointer-events: auto; }
|
|
2219
|
+
}
|
|
2220
|
+
|
|
2221
|
+
/* Element screenshot */
|
|
2222
|
+
.lh-element-screenshot {
|
|
2223
|
+
float: left;
|
|
2224
|
+
margin-right: 20px;
|
|
2225
|
+
}
|
|
2226
|
+
.lh-element-screenshot__content {
|
|
2227
|
+
overflow: hidden;
|
|
2228
|
+
min-width: 110px;
|
|
2229
|
+
display: flex;
|
|
2230
|
+
justify-content: center;
|
|
2231
|
+
background-color: var(--report-background-color);
|
|
2232
|
+
}
|
|
2233
|
+
.lh-element-screenshot__image {
|
|
2234
|
+
position: relative;
|
|
2235
|
+
/* Set by ElementScreenshotRenderer.installFullPageScreenshotCssVariable */
|
|
2236
|
+
background-image: var(--element-screenshot-url);
|
|
2237
|
+
outline: 2px solid #777;
|
|
2238
|
+
background-color: white;
|
|
2239
|
+
background-repeat: no-repeat;
|
|
2240
|
+
}
|
|
2241
|
+
.lh-element-screenshot__mask {
|
|
2242
|
+
position: absolute;
|
|
2243
|
+
background: #555;
|
|
2244
|
+
opacity: 0.8;
|
|
2245
|
+
}
|
|
2246
|
+
.lh-element-screenshot__element-marker {
|
|
2247
|
+
position: absolute;
|
|
2248
|
+
outline: 2px solid var(--color-lime-400);
|
|
2249
|
+
}
|
|
2250
|
+
.lh-element-screenshot__overlay {
|
|
2251
|
+
position: fixed;
|
|
2252
|
+
top: 0;
|
|
2253
|
+
left: 0;
|
|
2254
|
+
right: 0;
|
|
2255
|
+
bottom: 0;
|
|
2256
|
+
z-index: 2000; /* .lh-topbar is 1000 */
|
|
2257
|
+
background: var(--screenshot-overlay-background);
|
|
2258
|
+
display: flex;
|
|
2259
|
+
align-items: center;
|
|
2260
|
+
justify-content: center;
|
|
2261
|
+
cursor: zoom-out;
|
|
2262
|
+
}
|
|
2263
|
+
|
|
2264
|
+
.lh-element-screenshot__overlay .lh-element-screenshot {
|
|
2265
|
+
margin-right: 0; /* clearing margin used in thumbnail case */
|
|
2266
|
+
outline: 1px solid var(--color-gray-700);
|
|
2267
|
+
}
|
|
2268
|
+
|
|
2269
|
+
.lh-screenshot-overlay--enabled .lh-element-screenshot {
|
|
2270
|
+
cursor: zoom-out;
|
|
2271
|
+
}
|
|
2272
|
+
.lh-screenshot-overlay--enabled .lh-node .lh-element-screenshot {
|
|
2273
|
+
cursor: zoom-in;
|
|
2274
|
+
}
|
|
2275
|
+
|
|
2276
|
+
|
|
2277
|
+
.lh-meta__items {
|
|
2278
|
+
--meta-icon-size: calc(var(--report-icon-size) * 0.667);
|
|
2279
|
+
padding: var(--default-padding);
|
|
2280
|
+
display: grid;
|
|
2281
|
+
grid-template-columns: 1fr 1fr 1fr;
|
|
2282
|
+
background-color: var(--env-item-background-color);
|
|
2283
|
+
border-radius: 3px;
|
|
2284
|
+
margin: 0 0 var(--default-padding) 0;
|
|
2285
|
+
font-size: 12px;
|
|
2286
|
+
column-gap: var(--default-padding);
|
|
2287
|
+
color: var(--color-gray-700);
|
|
2288
|
+
}
|
|
2289
|
+
|
|
2290
|
+
.lh-meta__item {
|
|
2291
|
+
display: block;
|
|
2292
|
+
list-style-type: none;
|
|
2293
|
+
position: relative;
|
|
2294
|
+
padding: 0 0 0 calc(var(--meta-icon-size) + var(--default-padding) * 2);
|
|
2295
|
+
cursor: unset; /* disable pointer cursor from report-icon */
|
|
2296
|
+
}
|
|
2297
|
+
|
|
2298
|
+
.lh-meta__item.lh-tooltip-boundary {
|
|
2299
|
+
text-decoration: dotted underline var(--color-gray-500);
|
|
2300
|
+
cursor: help;
|
|
2301
|
+
}
|
|
2302
|
+
|
|
2303
|
+
.lh-meta__item.lh-report-icon::before {
|
|
2304
|
+
position: absolute;
|
|
2305
|
+
left: var(--default-padding);
|
|
2306
|
+
width: var(--meta-icon-size);
|
|
2307
|
+
height: var(--meta-icon-size);
|
|
2308
|
+
}
|
|
2309
|
+
|
|
2310
|
+
.lh-meta__item.lh-report-icon:hover::before {
|
|
2311
|
+
opacity: 0.7;
|
|
2312
|
+
}
|
|
2313
|
+
|
|
2314
|
+
.lh-meta__item .lh-tooltip {
|
|
2315
|
+
color: var(--color-gray-800);
|
|
2316
|
+
}
|
|
2317
|
+
|
|
2318
|
+
.lh-meta__item .lh-tooltip::before {
|
|
2319
|
+
right: auto; /* Set the tooltip arrow to the leftside */
|
|
2320
|
+
left: 6px;
|
|
2321
|
+
}
|
|
2322
|
+
|
|
2323
|
+
/* Change the grid for narrow viewport. */
|
|
2324
|
+
@media screen and (max-width: 640px) {
|
|
2325
|
+
.lh-meta__items {
|
|
2326
|
+
grid-template-columns: 1fr 1fr;
|
|
2327
|
+
}
|
|
2328
|
+
}
|
|
2329
|
+
@media screen and (max-width: 535px) {
|
|
2330
|
+
.lh-meta__items {
|
|
2331
|
+
display: block;
|
|
2332
|
+
}
|
|
2333
|
+
}
|
|
2334
|
+
|
|
2335
|
+
|
|
2336
|
+
/*# sourceURL=report-styles.css */
|
|
2337
|
+
`),e.append(t),e}function Ue(o){let e=o.createFragment(),t=o.createElement("style");t.append(`
|
|
2338
|
+
.lh-topbar {
|
|
2339
|
+
position: sticky;
|
|
2340
|
+
top: 0;
|
|
2341
|
+
left: 0;
|
|
2342
|
+
right: 0;
|
|
2343
|
+
z-index: 1000;
|
|
2344
|
+
display: flex;
|
|
2345
|
+
align-items: center;
|
|
2346
|
+
height: var(--topbar-height);
|
|
2347
|
+
padding: var(--topbar-padding);
|
|
2348
|
+
font-size: var(--report-font-size-secondary);
|
|
2349
|
+
background-color: var(--topbar-background-color);
|
|
2350
|
+
border-bottom: 1px solid var(--color-gray-200);
|
|
2351
|
+
}
|
|
2352
|
+
|
|
2353
|
+
.lh-topbar__logo {
|
|
2354
|
+
width: var(--topbar-logo-size);
|
|
2355
|
+
height: var(--topbar-logo-size);
|
|
2356
|
+
user-select: none;
|
|
2357
|
+
flex: none;
|
|
2358
|
+
}
|
|
2359
|
+
|
|
2360
|
+
.lh-topbar__url {
|
|
2361
|
+
margin: var(--topbar-padding);
|
|
2362
|
+
text-decoration: none;
|
|
2363
|
+
color: var(--report-text-color);
|
|
2364
|
+
text-overflow: ellipsis;
|
|
2365
|
+
overflow: hidden;
|
|
2366
|
+
white-space: nowrap;
|
|
2367
|
+
}
|
|
2368
|
+
|
|
2369
|
+
.lh-tools {
|
|
2370
|
+
display: flex;
|
|
2371
|
+
align-items: center;
|
|
2372
|
+
margin-left: auto;
|
|
2373
|
+
will-change: transform;
|
|
2374
|
+
min-width: var(--report-icon-size);
|
|
2375
|
+
}
|
|
2376
|
+
.lh-tools__button {
|
|
2377
|
+
width: var(--report-icon-size);
|
|
2378
|
+
min-width: 24px;
|
|
2379
|
+
height: var(--report-icon-size);
|
|
2380
|
+
cursor: pointer;
|
|
2381
|
+
margin-right: 5px;
|
|
2382
|
+
/* This is actually a button element, but we want to style it like a transparent div. */
|
|
2383
|
+
display: flex;
|
|
2384
|
+
background: none;
|
|
2385
|
+
color: inherit;
|
|
2386
|
+
border: none;
|
|
2387
|
+
padding: 0;
|
|
2388
|
+
font: inherit;
|
|
2389
|
+
outline: inherit;
|
|
2390
|
+
}
|
|
2391
|
+
.lh-tools__button svg {
|
|
2392
|
+
fill: var(--tools-icon-color);
|
|
2393
|
+
}
|
|
2394
|
+
.lh-dark .lh-tools__button svg {
|
|
2395
|
+
filter: invert(1);
|
|
2396
|
+
}
|
|
2397
|
+
.lh-tools__button.lh-active + .lh-tools__dropdown {
|
|
2398
|
+
opacity: 1;
|
|
2399
|
+
clip: rect(-1px, 194px, 270px, -3px);
|
|
2400
|
+
visibility: visible;
|
|
2401
|
+
}
|
|
2402
|
+
.lh-tools__dropdown {
|
|
2403
|
+
position: absolute;
|
|
2404
|
+
background-color: var(--report-background-color);
|
|
2405
|
+
border: 1px solid var(--report-border-color);
|
|
2406
|
+
border-radius: 3px;
|
|
2407
|
+
padding: calc(var(--default-padding) / 2) 0;
|
|
2408
|
+
cursor: pointer;
|
|
2409
|
+
top: 36px;
|
|
2410
|
+
right: 0;
|
|
2411
|
+
box-shadow: 1px 1px 3px #ccc;
|
|
2412
|
+
min-width: 125px;
|
|
2413
|
+
clip: rect(0, 164px, 0, 0);
|
|
2414
|
+
visibility: hidden;
|
|
2415
|
+
opacity: 0;
|
|
2416
|
+
transition: all 200ms cubic-bezier(0,0,0.2,1);
|
|
2417
|
+
}
|
|
2418
|
+
.lh-tools__dropdown a {
|
|
2419
|
+
color: currentColor;
|
|
2420
|
+
text-decoration: none;
|
|
2421
|
+
white-space: nowrap;
|
|
2422
|
+
padding: 0 6px;
|
|
2423
|
+
line-height: 2;
|
|
2424
|
+
}
|
|
2425
|
+
.lh-tools__dropdown a:hover,
|
|
2426
|
+
.lh-tools__dropdown a:focus {
|
|
2427
|
+
background-color: var(--color-gray-200);
|
|
2428
|
+
outline: none;
|
|
2429
|
+
}
|
|
2430
|
+
/* save-gist option hidden in report. */
|
|
2431
|
+
.lh-tools__dropdown a[data-action='save-gist'] {
|
|
2432
|
+
display: none;
|
|
2433
|
+
}
|
|
2434
|
+
|
|
2435
|
+
.lh-locale-selector {
|
|
2436
|
+
width: 100%;
|
|
2437
|
+
color: var(--report-text-color);
|
|
2438
|
+
background-color: var(--locale-selector-background-color);
|
|
2439
|
+
padding: 2px;
|
|
2440
|
+
}
|
|
2441
|
+
.lh-tools-locale {
|
|
2442
|
+
display: flex;
|
|
2443
|
+
align-items: center;
|
|
2444
|
+
flex-direction: row-reverse;
|
|
2445
|
+
}
|
|
2446
|
+
.lh-tools-locale__selector-wrapper {
|
|
2447
|
+
transition: opacity 0.15s;
|
|
2448
|
+
opacity: 0;
|
|
2449
|
+
max-width: 200px;
|
|
2450
|
+
}
|
|
2451
|
+
.lh-button.lh-tool-locale__button {
|
|
2452
|
+
height: var(--topbar-height);
|
|
2453
|
+
color: var(--tools-icon-color);
|
|
2454
|
+
padding: calc(var(--default-padding) / 2);
|
|
2455
|
+
}
|
|
2456
|
+
.lh-tool-locale__button.lh-active + .lh-tools-locale__selector-wrapper {
|
|
2457
|
+
opacity: 1;
|
|
2458
|
+
clip: rect(-1px, 194px, 242px, -3px);
|
|
2459
|
+
visibility: visible;
|
|
2460
|
+
margin: 0 4px;
|
|
2461
|
+
}
|
|
2462
|
+
|
|
2463
|
+
@media screen and (max-width: 964px) {
|
|
2464
|
+
.lh-tools__dropdown {
|
|
2465
|
+
right: 0;
|
|
2466
|
+
left: initial;
|
|
2467
|
+
}
|
|
2468
|
+
}
|
|
2469
|
+
@media print {
|
|
2470
|
+
.lh-topbar {
|
|
2471
|
+
position: static;
|
|
2472
|
+
margin-left: 0;
|
|
2473
|
+
}
|
|
2474
|
+
|
|
2475
|
+
.lh-tools__dropdown {
|
|
2476
|
+
display: none;
|
|
2477
|
+
}
|
|
2478
|
+
}
|
|
2479
|
+
`),e.append(t);let n=o.createElement("div","lh-topbar"),r=o.createElementNS("http://www.w3.org/2000/svg","svg","lh-topbar__logo");r.setAttribute("role","img"),r.setAttribute("title","Lighthouse logo"),r.setAttribute("fill","none"),r.setAttribute("xmlns","http://www.w3.org/2000/svg"),r.setAttribute("viewBox","0 0 48 48");let i=o.createElementNS("http://www.w3.org/2000/svg","path");i.setAttribute("d","m14 7 10-7 10 7v10h5v7h-5l5 24H9l5-24H9v-7h5V7Z"),i.setAttribute("fill","#F63");let a=o.createElementNS("http://www.w3.org/2000/svg","path");a.setAttribute("d","M31.561 24H14l-1.689 8.105L31.561 24ZM18.983 48H9l1.022-4.907L35.723 32.27l1.663 7.98L18.983 48Z"),a.setAttribute("fill","#FFA385");let l=o.createElementNS("http://www.w3.org/2000/svg","path");l.setAttribute("fill","#FF3"),l.setAttribute("d","M20.5 10h7v7h-7z"),r.append(" ",i," ",a," ",l," ");let s=o.createElement("a","lh-topbar__url");s.setAttribute("href",""),s.setAttribute("target","_blank"),s.setAttribute("rel","noopener");let c=o.createElement("div","lh-tools"),d=o.createElement("div","lh-tools-locale lh-hidden"),p=o.createElement("button","lh-button lh-tool-locale__button");p.setAttribute("id","lh-button__swap-locales"),p.setAttribute("title","Show Language Picker"),p.setAttribute("aria-label","Toggle language picker"),p.setAttribute("aria-haspopup","menu"),p.setAttribute("aria-expanded","false"),p.setAttribute("aria-controls","lh-tools-locale__selector-wrapper");let h=o.createElementNS("http://www.w3.org/2000/svg","svg");h.setAttribute("width","20px"),h.setAttribute("height","20px"),h.setAttribute("viewBox","0 0 24 24"),h.setAttribute("fill","currentColor");let u=o.createElementNS("http://www.w3.org/2000/svg","path");u.setAttribute("d","M0 0h24v24H0V0z"),u.setAttribute("fill","none");let f=o.createElementNS("http://www.w3.org/2000/svg","path");f.setAttribute("d","M12.87 15.07l-2.54-2.51.03-.03c1.74-1.94 2.98-4.17 3.71-6.53H17V4h-7V2H8v2H1v1.99h11.17C11.5 7.92 10.44 9.75 9 11.35 8.07 10.32 7.3 9.19 6.69 8h-2c.73 1.63 1.73 3.17 2.98 4.56l-5.09 5.02L4 19l5-5 3.11 3.11.76-2.04zM18.5 10h-2L12 22h2l1.12-3h4.75L21 22h2l-4.5-12zm-2.62 7l1.62-4.33L19.12 17h-3.24z"),h.append(u,f),p.append(" ",h," ");let b=o.createElement("div","lh-tools-locale__selector-wrapper");b.setAttribute("id","lh-tools-locale__selector-wrapper"),b.setAttribute("role","menu"),b.setAttribute("aria-labelledby","lh-button__swap-locales"),b.setAttribute("aria-hidden","true"),b.append(" "," "),d.append(" ",p," ",b," ");let _=o.createElement("button","lh-tools__button");_.setAttribute("id","lh-tools-button"),_.setAttribute("title","Tools menu"),_.setAttribute("aria-label","Toggle report tools menu"),_.setAttribute("aria-haspopup","menu"),_.setAttribute("aria-expanded","false"),_.setAttribute("aria-controls","lh-tools-dropdown");let m=o.createElementNS("http://www.w3.org/2000/svg","svg");m.setAttribute("width","100%"),m.setAttribute("height","100%"),m.setAttribute("viewBox","0 0 24 24");let w=o.createElementNS("http://www.w3.org/2000/svg","path");w.setAttribute("d","M0 0h24v24H0z"),w.setAttribute("fill","none");let v=o.createElementNS("http://www.w3.org/2000/svg","path");v.setAttribute("d","M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"),m.append(" ",w," ",v," "),_.append(" ",m," ");let x=o.createElement("div","lh-tools__dropdown");x.setAttribute("id","lh-tools-dropdown"),x.setAttribute("role","menu"),x.setAttribute("aria-labelledby","lh-tools-button");let E=o.createElement("a","lh-report-icon lh-report-icon--print");E.setAttribute("role","menuitem"),E.setAttribute("tabindex","-1"),E.setAttribute("href","#"),E.setAttribute("data-i18n","dropdownPrintSummary"),E.setAttribute("data-action","print-summary");let A=o.createElement("a","lh-report-icon lh-report-icon--print");A.setAttribute("role","menuitem"),A.setAttribute("tabindex","-1"),A.setAttribute("href","#"),A.setAttribute("data-i18n","dropdownPrintExpanded"),A.setAttribute("data-action","print-expanded");let C=o.createElement("a","lh-report-icon lh-report-icon--copy");C.setAttribute("role","menuitem"),C.setAttribute("tabindex","-1"),C.setAttribute("href","#"),C.setAttribute("data-i18n","dropdownCopyJSON"),C.setAttribute("data-action","copy");let L=o.createElement("a","lh-report-icon lh-report-icon--download lh-hidden");L.setAttribute("role","menuitem"),L.setAttribute("tabindex","-1"),L.setAttribute("href","#"),L.setAttribute("data-i18n","dropdownSaveHTML"),L.setAttribute("data-action","save-html");let S=o.createElement("a","lh-report-icon lh-report-icon--download");S.setAttribute("role","menuitem"),S.setAttribute("tabindex","-1"),S.setAttribute("href","#"),S.setAttribute("data-i18n","dropdownSaveJSON"),S.setAttribute("data-action","save-json");let z=o.createElement("a","lh-report-icon lh-report-icon--open");z.setAttribute("role","menuitem"),z.setAttribute("tabindex","-1"),z.setAttribute("href","#"),z.setAttribute("data-i18n","dropdownViewer"),z.setAttribute("data-action","open-viewer");let M=o.createElement("a","lh-report-icon lh-report-icon--open");M.setAttribute("role","menuitem"),M.setAttribute("tabindex","-1"),M.setAttribute("href","#"),M.setAttribute("data-i18n","dropdownSaveGist"),M.setAttribute("data-action","save-gist");let T=o.createElement("a","lh-report-icon lh-report-icon--open lh-hidden");T.setAttribute("role","menuitem"),T.setAttribute("tabindex","-1"),T.setAttribute("href","#"),T.setAttribute("data-i18n","dropdownViewUnthrottledTrace"),T.setAttribute("data-action","view-unthrottled-trace");let F=o.createElement("a","lh-report-icon lh-report-icon--dark");return F.setAttribute("role","menuitem"),F.setAttribute("tabindex","-1"),F.setAttribute("href","#"),F.setAttribute("data-i18n","dropdownDarkTheme"),F.setAttribute("data-action","toggle-dark"),x.append(" ",E," ",A," ",C," "," ",L," ",S," ",z," ",M," "," ",T," ",F," "),c.append(" ",d," ",_," ",x," "),n.append(" "," ",r," ",s," ",c," "),e.append(n),e}function Ie(o){let e=o.createFragment(),t=o.createElement("div","lh-warnings lh-warnings--toplevel"),n=o.createElement("p","lh-warnings__msg"),r=o.createElement("ul");return t.append(" ",n," ",r," "),e.append(t),e}function X(o,e){switch(e){case"3pFilter":return me(o);case"audit":return fe(o);case"categoryHeader":return be(o);case"chevron":return ve(o);case"clump":return _e(o);case"crc":return we(o);case"crcChain":return ye(o);case"elementScreenshot":return xe(o);case"footer":return Ee(o);case"fraction":return ke(o);case"gauge":return Ae(o);case"gaugePwa":return Se(o);case"heading":return Ce(o);case"metric":return ze(o);case"opportunity":return Le(o);case"opportunityHeader":return Me(o);case"scorescale":return Te(o);case"scoresWrapper":return Fe(o);case"snippet":return De(o);case"snippetContent":return Ne(o);case"snippetHeader":return Re(o);case"snippetLine":return Pe(o);case"styles":return He(o);case"topbar":return Ue(o);case"warningsToplevel":return Ie(o)}throw new Error("unexpected component: "+e)}var V=class{constructor(e,t){this._document=e,this._lighthouseChannel="unknown",this._componentCache=new Map,this.rootEl=t}createElement(e,t){let n=this._document.createElement(e);if(t)for(let r of t.split(/\s+/))r&&n.classList.add(r);return n}createElementNS(e,t,n){let r=this._document.createElementNS(e,t);if(n)for(let i of n.split(/\s+/))i&&r.classList.add(i);return r}createFragment(){return this._document.createDocumentFragment()}createTextNode(e){return this._document.createTextNode(e)}createChildOf(e,t,n){let r=this.createElement(t,n);return e.append(r),r}createComponent(e){let t=this._componentCache.get(e);if(t){let r=t.cloneNode(!0);return this.findAll("style",r).forEach(i=>i.remove()),r}return t=X(this,e),this._componentCache.set(e,t),t.cloneNode(!0)}clearComponentCache(){this._componentCache.clear()}convertMarkdownLinkSnippets(e,t={}){let n=this.createElement("span");for(let r of k.splitMarkdownLink(e)){let i=r.text.includes("`")?this.convertMarkdownCodeSnippets(r.text):r.text;if(!r.isLink){n.append(i);continue}let a=new URL(r.linkHref);(["https://developers.google.com","https://web.dev","https://developer.chrome.com"].includes(a.origin)||t.alwaysAppendUtmSource)&&(a.searchParams.set("utm_source","lighthouse"),a.searchParams.set("utm_medium",this._lighthouseChannel));let s=this.createElement("a");s.rel="noopener",s.target="_blank",s.append(i),this.safelySetHref(s,a.href),n.append(s)}return n}safelySetHref(e,t){if(t=t||"",t.startsWith("#")){e.href=t;return}let n=["https:","http:"],r;try{r=new URL(t)}catch{}r&&n.includes(r.protocol)&&(e.href=r.href)}safelySetBlobHref(e,t){if(t.type!=="text/html"&&t.type!=="application/json")throw new Error("Unsupported blob type");let n=URL.createObjectURL(t);e.href=n}convertMarkdownCodeSnippets(e){let t=this.createElement("span");for(let n of k.splitMarkdownCodeSpans(e))if(n.isCode){let r=this.createElement("code");r.textContent=n.text,t.append(r)}else t.append(this._document.createTextNode(n.text));return t}setLighthouseChannel(e){this._lighthouseChannel=e}document(){return this._document}isDevTools(){return!!this._document.querySelector(".lh-devtools")}find(e,t){let n=t.querySelector(e);if(n===null)throw new Error(`query ${e} not found`);return n}findAll(e,t){return Array.from(t.querySelectorAll(e))}fireEventOn(e,t=this._document,n){let r=new CustomEvent(e,n?{detail:n}:void 0);t.dispatchEvent(r)}saveFile(e,t){let n=this.createElement("a");n.download=t,this.safelySetBlobHref(n,e),this._document.body.append(n),n.click(),this._document.body.removeChild(n),setTimeout(()=>URL.revokeObjectURL(n.href),500)}};var ee=0,g=class o{static i18n=null;static strings={};static reportJson=null;static apply(e){o.strings={...te,...e.providedStrings},o.i18n=e.i18n,o.reportJson=e.reportJson}static getUniqueSuffix(){return ee++}static resetUniqueSuffix(){ee=0}};var ne="data:image/jpeg;base64,";function re(o){o.configSettings.locale||(o.configSettings.locale="en"),o.configSettings.formFactor||(o.configSettings.formFactor=o.configSettings.emulatedFormFactor),o.finalDisplayedUrl=k.getFinalDisplayedUrl(o),o.mainDocumentUrl=k.getMainDocumentUrl(o);for(let n of Object.values(o.audits))if((n.scoreDisplayMode==="not_applicable"||n.scoreDisplayMode==="not-applicable")&&(n.scoreDisplayMode="notApplicable"),n.details){if((n.details.type===void 0||n.details.type==="diagnostic")&&(n.details.type="debugdata"),n.details.type==="filmstrip")for(let r of n.details.items)r.data.startsWith(ne)||(r.data=ne+r.data);if(n.details.type==="table")for(let r of n.details.headings){let{itemType:i,text:a}=r;i!==void 0&&(r.valueType=i,delete r.itemType),a!==void 0&&(r.label=a,delete r.text);let l=r.subItemsHeading?.itemType;r.subItemsHeading&&l!==void 0&&(r.subItemsHeading.valueType=l,delete r.subItemsHeading.itemType)}if(n.id==="third-party-summary"&&(n.details.type==="opportunity"||n.details.type==="table")){let{headings:r,items:i}=n.details;if(r[0].valueType==="link"){r[0].valueType="text";for(let a of i)typeof a.entity=="object"&&a.entity.type==="link"&&(a.entity=a.entity.text);n.details.isEntityGrouped=!0}}}let[e]=o.lighthouseVersion.split(".").map(Number),t=o.categories.performance;if(e<9&&t){o.categoryGroups||(o.categoryGroups={}),o.categoryGroups.hidden={title:""};for(let n of t.auditRefs)n.group?["load-opportunities","diagnostics"].includes(n.group)&&delete n.group:n.group="hidden"}if(o.environment||(o.environment={benchmarkIndex:0,networkUserAgent:o.userAgent,hostUserAgent:o.userAgent}),o.configSettings.screenEmulation||(o.configSettings.screenEmulation={width:-1,height:-1,deviceScaleFactor:-1,mobile:/mobile/i.test(o.environment.hostUserAgent),disabled:!1}),o.i18n||(o.i18n={}),o.audits["full-page-screenshot"]){let n=o.audits["full-page-screenshot"].details;n?o.fullPageScreenshot={screenshot:n.screenshot,nodes:n.nodes}:o.fullPageScreenshot=null,delete o.audits["full-page-screenshot"]}}var N=k.RATINGS,y=class o{static prepareReportResult(e){let t=JSON.parse(JSON.stringify(e));re(t);for(let r of Object.values(t.audits))r.details&&(r.details.type==="opportunity"||r.details.type==="table")&&!r.details.isEntityGrouped&&t.entities&&o.classifyEntities(t.entities,r.details);if(typeof t.categories!="object")throw new Error("No categories provided.");let n=new Map;for(let r of Object.values(t.categories))r.auditRefs.forEach(i=>{i.relevantAudits&&i.relevantAudits.forEach(a=>{let l=n.get(a)||[];l.push(i),n.set(a,l)})}),r.auditRefs.forEach(i=>{let a=t.audits[i.id];i.result=a,n.has(i.id)&&(i.relevantMetrics=n.get(i.id)),t.stackPacks&&t.stackPacks.forEach(l=>{l.descriptions[i.id]&&(i.stackPacks=i.stackPacks||[],i.stackPacks.push({title:l.title,iconDataURL:l.iconDataURL,description:l.descriptions[i.id]}))})});return t}static getUrlLocatorFn(e){let t=e.find(r=>r.valueType==="url")?.key;if(t&&typeof t=="string")return r=>{let i=r[t];if(typeof i=="string")return i};let n=e.find(r=>r.valueType==="source-location")?.key;if(n)return r=>{let i=r[n];if(typeof i=="object"&&i.type==="source-location")return i.url}}static classifyEntities(e,t){let{items:n,headings:r}=t;if(!n.length||n.some(a=>a.entity))return;let i=o.getUrlLocatorFn(r);if(i)for(let a of n){let l=i(a);if(!l)continue;let s="";try{s=k.parseURL(l).origin}catch{}if(!s)continue;let c=e.find(d=>d.origins.includes(s));c&&(a.entity=c.name)}}static getTableItemSortComparator(e){return(t,n)=>{for(let r of e){let i=t[r],a=n[r];if((typeof i!=typeof a||!["number","string"].includes(typeof i))&&console.warn(`Warning: Attempting to sort unsupported value type: ${r}.`),typeof i=="number"&&typeof a=="number"&&i!==a)return a-i;if(typeof i=="string"&&typeof a=="string"&&i!==a)return i.localeCompare(a)}return 0}}static getEmulationDescriptions(e){let t,n,r,i=e.throttling,a=g.i18n,l=g.strings;switch(e.throttlingMethod){case"provided":r=n=t=l.throttlingProvided;break;case"devtools":{let{cpuSlowdownMultiplier:h,requestLatencyMs:u}=i;t=`${a.formatNumber(h)}x slowdown (DevTools)`,n=`${a.formatMilliseconds(u)} HTTP RTT, ${a.formatKbps(i.downloadThroughputKbps)} down, ${a.formatKbps(i.uploadThroughputKbps)} up (DevTools)`,r=(()=>u===150*3.75&&i.downloadThroughputKbps===1.6*1024*.9&&i.uploadThroughputKbps===750*.9)()?l.runtimeSlow4g:l.runtimeCustom;break}case"simulate":{let{cpuSlowdownMultiplier:h,rttMs:u,throughputKbps:f}=i;t=`${a.formatNumber(h)}x slowdown (Simulated)`,n=`${a.formatMilliseconds(u)} TCP RTT, ${a.formatKbps(f)} throughput (Simulated)`,r=(()=>u===150&&f===1.6*1024)()?l.runtimeSlow4g:l.runtimeCustom;break}default:r=t=n=l.runtimeUnknown}let s=e.channel==="devtools"?!1:e.screenEmulation.disabled,c=e.channel==="devtools"?e.formFactor==="mobile":e.screenEmulation.mobile,d=l.runtimeMobileEmulation;s?d=l.runtimeNoEmulation:c||(d=l.runtimeDesktopEmulation);let p=s?void 0:`${e.screenEmulation.width}x${e.screenEmulation.height}, DPR ${e.screenEmulation.deviceScaleFactor}`;return{deviceEmulation:d,screenEmulation:p,cpuThrottling:t,networkThrottling:n,summary:r}}static showAsPassed(e){switch(e.scoreDisplayMode){case"manual":case"notApplicable":return!0;case"error":case"informative":return!1;case"numeric":case"binary":default:return Number(e.score)>=N.PASS.minScore}}static calculateRating(e,t){if(t==="manual"||t==="notApplicable")return N.PASS.label;if(t==="error")return N.ERROR.label;if(e===null)return N.FAIL.label;let n=N.FAIL.label;return e>=N.PASS.minScore?n=N.PASS.label:e>=N.AVERAGE.minScore&&(n=N.AVERAGE.label),n}static calculateCategoryFraction(e){let t=0,n=0,r=0,i=0;for(let a of e.auditRefs){let l=o.showAsPassed(a.result);if(!(a.group==="hidden"||a.result.scoreDisplayMode==="manual"||a.result.scoreDisplayMode==="notApplicable")){if(a.result.scoreDisplayMode==="informative"){l||++r;continue}++t,i+=a.weight,l&&n++}}return{numPassed:n,numPassableAudits:t,numInformative:r,totalWeight:i}}static isPluginCategory(e){return e.startsWith("lighthouse-plugin-")}static shouldDisplayAsFraction(e){return e==="timespan"||e==="snapshot"}},te={varianceDisclaimer:"Values are estimated and may vary. The [performance score is calculated](https://developer.chrome.com/docs/lighthouse/performance/performance-scoring/) directly from these metrics.",calculatorLink:"See calculator.",showRelevantAudits:"Show audits relevant to:",opportunityResourceColumnLabel:"Opportunity",opportunitySavingsColumnLabel:"Estimated Savings",errorMissingAuditInfo:"Report error: no audit information",errorLabel:"Error!",warningHeader:"Warnings: ",warningAuditsGroupTitle:"Passed audits but with warnings",passedAuditsGroupTitle:"Passed audits",notApplicableAuditsGroupTitle:"Not applicable",manualAuditsGroupTitle:"Additional items to manually check",toplevelWarningsMessage:"There were issues affecting this run of Lighthouse:",crcInitialNavigation:"Initial Navigation",crcLongestDurationLabel:"Maximum critical path latency:",snippetExpandButtonLabel:"Expand snippet",snippetCollapseButtonLabel:"Collapse snippet",lsPerformanceCategoryDescription:"[Lighthouse](https://developers.google.com/web/tools/lighthouse/) analysis of the current page on an emulated mobile network. Values are estimated and may vary.",labDataTitle:"Lab Data",thirdPartyResourcesLabel:"Show 3rd-party resources",viewTreemapLabel:"View Treemap",viewTraceLabel:"View Trace",dropdownPrintSummary:"Print Summary",dropdownPrintExpanded:"Print Expanded",dropdownCopyJSON:"Copy JSON",dropdownSaveHTML:"Save as HTML",dropdownSaveJSON:"Save as JSON",dropdownViewer:"Open in Viewer",dropdownSaveGist:"Save as Gist",dropdownDarkTheme:"Toggle Dark Theme",dropdownViewUnthrottledTrace:"View Unthrottled Trace",runtimeSettingsDevice:"Device",runtimeSettingsNetworkThrottling:"Network throttling",runtimeSettingsCPUThrottling:"CPU throttling",runtimeSettingsUANetwork:"User agent (network)",runtimeSettingsBenchmark:"Unthrottled CPU/Memory Power",runtimeSettingsAxeVersion:"Axe version",runtimeSettingsScreenEmulation:"Screen emulation",footerIssue:"File an issue",runtimeNoEmulation:"No emulation",runtimeMobileEmulation:"Emulated Moto G Power",runtimeDesktopEmulation:"Emulated Desktop",runtimeUnknown:"Unknown",runtimeSingleLoad:"Single page load",runtimeAnalysisWindow:"Initial page load",runtimeSingleLoadTooltip:"This data is taken from a single page load, as opposed to field data summarizing many sessions.",throttlingProvided:"Provided by environment",show:"Show",hide:"Hide",expandView:"Expand view",collapseView:"Collapse view",runtimeSlow4g:"Slow 4G throttling",runtimeCustom:"Custom throttling",firstPartyChipLabel:"1st party",openInANewTabTooltip:"Open in a new tab",unattributable:"Unattributable"};var R=class{constructor(e,t){this.dom=e,this.detailsRenderer=t}get _clumpTitles(){return{warning:g.strings.warningAuditsGroupTitle,manual:g.strings.manualAuditsGroupTitle,passed:g.strings.passedAuditsGroupTitle,notApplicable:g.strings.notApplicableAuditsGroupTitle}}renderAudit(e){let t=this.dom.createComponent("audit");return this.populateAuditValues(e,t)}populateAuditValues(e,t){let n=g.strings,r=this.dom.find(".lh-audit",t);r.id=e.result.id;let i=e.result.scoreDisplayMode;e.result.displayValue&&(this.dom.find(".lh-audit__display-text",r).textContent=e.result.displayValue);let a=this.dom.find(".lh-audit__title",r);a.append(this.dom.convertMarkdownCodeSnippets(e.result.title));let l=this.dom.find(".lh-audit__description",r);l.append(this.dom.convertMarkdownLinkSnippets(e.result.description));for(let h of e.relevantMetrics||[]){let u=this.dom.createChildOf(l,"span","lh-audit__adorn");u.title=`Relevant to ${h.result.title}`,u.textContent=h.acronym||h.id}e.stackPacks&&e.stackPacks.forEach(h=>{let u=this.dom.createElement("img","lh-audit__stackpack__img");u.src=h.iconDataURL,u.alt=h.title;let f=this.dom.convertMarkdownLinkSnippets(h.description,{alwaysAppendUtmSource:!0}),b=this.dom.createElement("div","lh-audit__stackpack");b.append(u,f),this.dom.find(".lh-audit__stackpacks",r).append(b)});let s=this.dom.find("details",r);if(e.result.details){let h=this.detailsRenderer.render(e.result.details);h&&(h.classList.add("lh-details"),s.append(h))}if(this.dom.find(".lh-chevron-container",r).append(this._createChevron()),this._setRatingClass(r,e.result.score,i),e.result.scoreDisplayMode==="error"){r.classList.add("lh-audit--error");let h=this.dom.find(".lh-audit__display-text",r);h.textContent=n.errorLabel,h.classList.add("lh-tooltip-boundary");let u=this.dom.createChildOf(h,"div","lh-tooltip lh-tooltip--error");u.textContent=e.result.errorMessage||n.errorMissingAuditInfo}else if(e.result.explanation){let h=this.dom.createChildOf(a,"div","lh-audit-explanation");h.textContent=e.result.explanation}let c=e.result.warnings;if(!c||c.length===0)return r;let d=this.dom.find("summary",s),p=this.dom.createChildOf(d,"div","lh-warnings");if(this.dom.createChildOf(p,"span").textContent=n.warningHeader,c.length===1)p.append(this.dom.createTextNode(c.join("")));else{let h=this.dom.createChildOf(p,"ul");for(let u of c){let f=this.dom.createChildOf(h,"li");f.textContent=u}}return r}injectFinalScreenshot(e,t,n){let r=t["final-screenshot"];if(!r||r.scoreDisplayMode==="error"||!r.details||r.details.type!=="screenshot")return null;let i=this.dom.createElement("img","lh-final-ss-image"),a=r.details.data;i.src=a,i.alt=r.title;let l=this.dom.find(".lh-category .lh-category-header",e),s=this.dom.createElement("div","lh-category-headercol"),c=this.dom.createElement("div","lh-category-headercol lh-category-headercol--separator"),d=this.dom.createElement("div","lh-category-headercol");s.append(...l.childNodes),s.append(n),d.append(i),l.append(s,c,d),l.classList.add("lh-category-header__finalscreenshot")}_createChevron(){let e=this.dom.createComponent("chevron");return this.dom.find("svg.lh-chevron",e)}_setRatingClass(e,t,n){let r=y.calculateRating(t,n);return e.classList.add(`lh-audit--${n.toLowerCase()}`),n!=="informative"&&e.classList.add(`lh-audit--${r}`),e}renderCategoryHeader(e,t,n){let r=this.dom.createComponent("categoryHeader"),i=this.dom.find(".lh-score__gauge",r),a=this.renderCategoryScore(e,t,n);if(i.append(a),e.description){let l=this.dom.convertMarkdownLinkSnippets(e.description);this.dom.find(".lh-category-header__description",r).append(l)}return r}renderAuditGroup(e){let t=this.dom.createElement("div","lh-audit-group"),n=this.dom.createElement("div","lh-audit-group__header");this.dom.createChildOf(n,"span","lh-audit-group__title").textContent=e.title,t.append(n);let r=null;return e.description&&(r=this.dom.convertMarkdownLinkSnippets(e.description),r.classList.add("lh-audit-group__description","lh-audit-group__footer"),t.append(r)),[t,r]}_renderGroupedAudits(e,t){let n=new Map,r="NotAGroup";n.set(r,[]);for(let a of e){let l=a.group||r;if(l==="hidden")continue;let s=n.get(l)||[];s.push(a),n.set(l,s)}let i=[];for(let[a,l]of n){if(a===r){for(let p of l)i.push(this.renderAudit(p));continue}let s=t[a],[c,d]=this.renderAuditGroup(s);for(let p of l)c.insertBefore(this.renderAudit(p),d);c.classList.add(`lh-audit-group--${a}`),i.push(c)}return i}renderUnexpandableClump(e,t){let n=this.dom.createElement("div");return this._renderGroupedAudits(e,t).forEach(i=>n.append(i)),n}renderClump(e,{auditRefs:t,description:n,openByDefault:r}){let i=this.dom.createComponent("clump"),a=this.dom.find(".lh-clump",i);r&&a.setAttribute("open","");let l=this.dom.find(".lh-audit-group__header",a),s=this._clumpTitles[e];this.dom.find(".lh-audit-group__title",l).textContent=s;let c=this.dom.find(".lh-audit-group__itemcount",a);c.textContent=`(${t.length})`;let d=t.map(this.renderAudit.bind(this));a.append(...d);let p=this.dom.find(".lh-audit-group",i);if(n){let h=this.dom.convertMarkdownLinkSnippets(n);h.classList.add("lh-audit-group__description","lh-audit-group__footer"),p.append(h)}return this.dom.find(".lh-clump-toggletext--show",p).textContent=g.strings.show,this.dom.find(".lh-clump-toggletext--hide",p).textContent=g.strings.hide,a.classList.add(`lh-clump--${e.toLowerCase()}`),p}renderCategoryScore(e,t,n){let r;if(n&&y.shouldDisplayAsFraction(n.gatherMode)?r=this.renderCategoryFraction(e):r=this.renderScoreGauge(e,t),n?.omitLabel&&this.dom.find(".lh-gauge__label,.lh-fraction__label",r).remove(),n?.onPageAnchorRendered){let i=this.dom.find("a",r);n.onPageAnchorRendered(i)}return r}renderScoreGauge(e,t){let n=this.dom.createComponent("gauge"),r=this.dom.find("a.lh-gauge__wrapper",n);y.isPluginCategory(e.id)&&r.classList.add("lh-gauge__wrapper--plugin");let i=Number(e.score),a=this.dom.find(".lh-gauge",n),l=this.dom.find("circle.lh-gauge-arc",a);l&&this._setGaugeArc(l,i);let s=Math.round(i*100),c=this.dom.find("div.lh-gauge__percentage",n);return c.textContent=s.toString(),e.score===null&&(c.classList.add("lh-gauge--error"),c.textContent="",c.title=g.strings.errorLabel),e.auditRefs.length===0||this.hasApplicableAudits(e)?r.classList.add(`lh-gauge__wrapper--${y.calculateRating(e.score)}`):(r.classList.add("lh-gauge__wrapper--not-applicable"),c.textContent="-",c.title=g.strings.notApplicableAuditsGroupTitle),this.dom.find(".lh-gauge__label",n).textContent=e.title,n}renderCategoryFraction(e){let t=this.dom.createComponent("fraction"),n=this.dom.find("a.lh-fraction__wrapper",t),{numPassed:r,numPassableAudits:i,totalWeight:a}=y.calculateCategoryFraction(e),l=r/i,s=this.dom.find(".lh-fraction__content",t),c=this.dom.createElement("span");c.textContent=`${r}/${i}`,s.append(c);let d=y.calculateRating(l);return a===0&&(d="null"),n.classList.add(`lh-fraction__wrapper--${d}`),this.dom.find(".lh-fraction__label",t).textContent=e.title,t}hasApplicableAudits(e){return e.auditRefs.some(t=>t.result.scoreDisplayMode!=="notApplicable")}_setGaugeArc(e,t){let n=2*Math.PI*Number(e.getAttribute("r")),r=Number(e.getAttribute("stroke-width")),i=.25*r/n;e.style.transform=`rotate(${-90+i*360}deg)`;let a=t*n-r/2;t===0&&(e.style.opacity="0"),t===1&&(a=n),e.style.strokeDasharray=`${Math.max(a,0)} ${n}`}_auditHasWarning(e){return!!e.result.warnings?.length}_getClumpIdForAuditRef(e){let t=e.result.scoreDisplayMode;return t==="manual"||t==="notApplicable"?t:y.showAsPassed(e.result)?this._auditHasWarning(e)?"warning":"passed":"failed"}render(e,t={},n){let r=this.dom.createElement("div","lh-category");r.id=e.id,r.append(this.renderCategoryHeader(e,t,n));let i=new Map;i.set("failed",[]),i.set("warning",[]),i.set("manual",[]),i.set("passed",[]),i.set("notApplicable",[]);for(let l of e.auditRefs){let s=this._getClumpIdForAuditRef(l),c=i.get(s);c.push(l),i.set(s,c)}for(let l of i.values())l.sort((s,c)=>c.weight-s.weight);let a=i.get("failed")?.length;for(let[l,s]of i){if(s.length===0)continue;if(l==="failed"){let h=this.renderUnexpandableClump(s,t);h.classList.add("lh-clump--failed"),r.append(h);continue}let c=l==="manual"?e.manualDescription:void 0,d=l==="warning"||l==="manual"&&a===0,p=this.renderClump(l,{auditRefs:s,description:c,openByDefault:d});r.append(p)}return r}};var I=class{static initTree(e){let t=0,n=Object.keys(e);return n.length>0&&(t=e[n[0]].request.startTime),{tree:e,startTime:t,transferSize:0}}static createSegment(e,t,n,r,i,a){let l=e[t],s=Object.keys(e),c=s.indexOf(t)===s.length-1,d=!!l.children&&Object.keys(l.children).length>0,p=Array.isArray(i)?i.slice(0):[];return typeof a<"u"&&p.push(!a),{node:l,isLastChild:c,hasChildren:d,startTime:n,transferSize:r+l.request.transferSize,treeMarkers:p}}static createChainNode(e,t,n){let r=e.createComponent("crcChain");e.find(".lh-crc-node",r).setAttribute("title",t.node.request.url);let i=e.find(".lh-crc-node__tree-marker",r);t.treeMarkers.forEach(p=>{let h=p?"lh-tree-marker lh-vert":"lh-tree-marker";i.append(e.createElement("span",h),e.createElement("span","lh-tree-marker"))});let a=t.isLastChild?"lh-tree-marker lh-up-right":"lh-tree-marker lh-vert-right",l=t.hasChildren?"lh-tree-marker lh-horiz-down":"lh-tree-marker lh-right";i.append(e.createElement("span",a),e.createElement("span","lh-tree-marker lh-right"),e.createElement("span",l));let s=t.node.request.url,c=n.renderTextURL(s),d=e.find(".lh-crc-node__tree-value",r);if(d.append(c),!t.hasChildren){let{startTime:p,endTime:h,transferSize:u}=t.node.request,f=e.createElement("span","lh-crc-node__chain-duration");f.textContent=" - "+g.i18n.formatMilliseconds((h-p)*1e3)+", ";let b=e.createElement("span","lh-crc-node__chain-duration");b.textContent=g.i18n.formatBytesToKiB(u,.01),d.append(f,b)}return r}static buildTree(e,t,n,r,i,a){if(r.append(H.createChainNode(e,n,a)),n.node.children)for(let l of Object.keys(n.node.children)){let s=H.createSegment(n.node.children,l,n.startTime,n.transferSize,n.treeMarkers,n.isLastChild);H.buildTree(e,t,s,r,i,a)}}static render(e,t,n){let r=e.createComponent("crc"),i=e.find(".lh-crc",r);e.find(".lh-crc-initial-nav",r).textContent=g.strings.crcInitialNavigation,e.find(".lh-crc__longest_duration_label",r).textContent=g.strings.crcLongestDurationLabel,e.find(".lh-crc__longest_duration",r).textContent=g.i18n.formatMilliseconds(t.longestChain.duration);let a=H.initTree(t.chains);for(let l of Object.keys(a.tree)){let s=H.createSegment(a.tree,l,a.startTime,a.transferSize);H.buildTree(e,r,s,i,t,n)}return e.find(".lh-crc-container",r)}},H=I;function Oe(o,e){return e.left<=o.width&&0<=e.right&&e.top<=o.height&&0<=e.bottom}function oe(o,e,t){return o<e?e:o>t?t:o}function Ve(o){return{x:o.left+o.width/2,y:o.top+o.height/2}}var P=class o{static getScreenshotPositions(e,t,n){let r=Ve(e),i=oe(r.x-t.width/2,0,n.width-t.width),a=oe(r.y-t.height/2,0,n.height-t.height);return{screenshot:{left:i,top:a},clip:{left:e.left-i,top:e.top-a}}}static renderClipPathInScreenshot(e,t,n,r,i){let a=e.find("clipPath",t),l=`clip-${g.getUniqueSuffix()}`;a.id=l,t.style.clipPath=`url(#${l})`;let s=n.top/i.height,c=s+r.height/i.height,d=n.left/i.width,p=d+r.width/i.width,h=[`0,0 1,0 1,${s} 0,${s}`,`0,${c} 1,${c} 1,1 0,1`,`0,${s} ${d},${s} ${d},${c} 0,${c}`,`${p},${s} 1,${s} 1,${c} ${p},${c}`];for(let u of h){let f=e.createElementNS("http://www.w3.org/2000/svg","polygon");f.setAttribute("points",u),a.append(f)}}static installFullPageScreenshot(e,t){e.style.setProperty("--element-screenshot-url",`url('${t.data}')`)}static installOverlayFeature(e){let{dom:t,rootEl:n,overlayContainerEl:r,fullPageScreenshot:i}=e,a="lh-screenshot-overlay--enabled";n.classList.contains(a)||(n.classList.add(a),n.addEventListener("click",l=>{let s=l.target;if(!s)return;let c=s.closest(".lh-node > .lh-element-screenshot");if(!c)return;let d=t.createElement("div","lh-element-screenshot__overlay");r.append(d);let p={width:d.clientWidth*.95,height:d.clientHeight*.8},h={width:Number(c.dataset.rectWidth),height:Number(c.dataset.rectHeight),left:Number(c.dataset.rectLeft),right:Number(c.dataset.rectLeft)+Number(c.dataset.rectWidth),top:Number(c.dataset.rectTop),bottom:Number(c.dataset.rectTop)+Number(c.dataset.rectHeight)},u=o.render(t,i.screenshot,h,p);if(!u){d.remove();return}d.append(u),d.addEventListener("click",()=>d.remove())}))}static _computeZoomFactor(e,t){let r={x:t.width/e.width,y:t.height/e.height},i=.75*Math.min(r.x,r.y);return Math.min(1,i)}static render(e,t,n,r){if(!Oe(t,n))return null;let i=e.createComponent("elementScreenshot"),a=e.find("div.lh-element-screenshot",i);a.dataset.rectWidth=n.width.toString(),a.dataset.rectHeight=n.height.toString(),a.dataset.rectLeft=n.left.toString(),a.dataset.rectTop=n.top.toString();let l=this._computeZoomFactor(n,r),s={width:r.width/l,height:r.height/l};s.width=Math.min(t.width,s.width),s.height=Math.min(t.height,s.height);let c={width:s.width*l,height:s.height*l},d=o.getScreenshotPositions(n,s,{width:t.width,height:t.height}),p=e.find("div.lh-element-screenshot__image",a);p.style.width=c.width+"px",p.style.height=c.height+"px",p.style.backgroundPositionY=-(d.screenshot.top*l)+"px",p.style.backgroundPositionX=-(d.screenshot.left*l)+"px",p.style.backgroundSize=`${t.width*l}px ${t.height*l}px`;let h=e.find("div.lh-element-screenshot__element-marker",a);h.style.width=n.width*l+"px",h.style.height=n.height*l+"px",h.style.left=d.clip.left*l+"px",h.style.top=d.clip.top*l+"px";let u=e.find("div.lh-element-screenshot__mask",a);return u.style.width=c.width+"px",u.style.height=c.height+"px",o.renderClipPathInScreenshot(e,u,d.clip,n,s),a}};var $e=["http://","https://","data:"],Be=["bytes","numeric","ms","timespanMs"],O=class{constructor(e,t={}){this._dom=e,this._fullPageScreenshot=t.fullPageScreenshot,this._entities=t.entities}render(e){switch(e.type){case"filmstrip":return this._renderFilmstrip(e);case"list":return this._renderList(e);case"table":case"opportunity":return this._renderTable(e);case"criticalrequestchain":return I.render(this._dom,e,this);case"screenshot":case"debugdata":case"treemap-data":return null;default:return this._renderUnknown(e.type,e)}}_renderBytes(e){let t=g.i18n.formatBytesToKiB(e.value,e.granularity||.1),n=this._renderText(t);return n.title=g.i18n.formatBytes(e.value),n}_renderMilliseconds(e){let t;return e.displayUnit==="duration"?t=g.i18n.formatDuration(e.value):t=g.i18n.formatMilliseconds(e.value,e.granularity||10),this._renderText(t)}renderTextURL(e){let t=e,n,r,i;try{let l=k.parseURL(t);n=l.file==="/"?l.origin:l.file,r=l.file==="/"||l.hostname===""?"":`(${l.hostname})`,i=t}catch{n=t}let a=this._dom.createElement("div","lh-text__url");if(a.append(this._renderLink({text:n,url:t})),r){let l=this._renderText(r);l.classList.add("lh-text__url-host"),a.append(l)}return i&&(a.title=t,a.dataset.url=t),a}_renderLink(e){let t=this._dom.createElement("a");if(this._dom.safelySetHref(t,e.url),!t.href){let n=this._renderText(e.text);return n.classList.add("lh-link"),n}return t.rel="noopener",t.target="_blank",t.textContent=e.text,t.classList.add("lh-link"),t}_renderText(e){let t=this._dom.createElement("div","lh-text");return t.textContent=e,t}_renderNumeric(e){let t=g.i18n.formatNumber(e.value,e.granularity||.1),n=this._dom.createElement("div","lh-numeric");return n.textContent=t,n}_renderThumbnail(e){let t=this._dom.createElement("img","lh-thumbnail"),n=e;return t.src=n,t.title=n,t.alt="",t}_renderUnknown(e,t){console.error(`Unknown details type: ${e}`,t);let n=this._dom.createElement("details","lh-unknown");return this._dom.createChildOf(n,"summary").textContent=`We don't know how to render audit details of type \`${e}\`. The Lighthouse version that collected this data is likely newer than the Lighthouse version of the report renderer. Expand for the raw JSON.`,this._dom.createChildOf(n,"pre").textContent=JSON.stringify(t,null,2),n}_renderTableValue(e,t){if(e==null)return null;if(typeof e=="object")switch(e.type){case"code":return this._renderCode(e.value);case"link":return this._renderLink(e);case"node":return this.renderNode(e);case"numeric":return this._renderNumeric(e);case"source-location":return this.renderSourceLocation(e);case"url":return this.renderTextURL(e.value);default:return this._renderUnknown(e.type,e)}switch(t.valueType){case"bytes":{let n=Number(e);return this._renderBytes({value:n,granularity:t.granularity})}case"code":{let n=String(e);return this._renderCode(n)}case"ms":{let n={value:Number(e),granularity:t.granularity,displayUnit:t.displayUnit};return this._renderMilliseconds(n)}case"numeric":{let n=Number(e);return this._renderNumeric({value:n,granularity:t.granularity})}case"text":{let n=String(e);return this._renderText(n)}case"thumbnail":{let n=String(e);return this._renderThumbnail(n)}case"timespanMs":{let n=Number(e);return this._renderMilliseconds({value:n})}case"url":{let n=String(e);return $e.some(r=>n.startsWith(r))?this.renderTextURL(n):this._renderCode(n)}default:return this._renderUnknown(t.valueType,e)}}_getDerivedSubItemsHeading(e){return e.subItemsHeading?{key:e.subItemsHeading.key||"",valueType:e.subItemsHeading.valueType||e.valueType,granularity:e.subItemsHeading.granularity||e.granularity,displayUnit:e.subItemsHeading.displayUnit||e.displayUnit,label:""}:null}_renderTableRow(e,t){let n=this._dom.createElement("tr");for(let r of t){if(!r||!r.key){this._dom.createChildOf(n,"td","lh-table-column--empty");continue}let i=e[r.key],a;if(i!=null&&(a=this._renderTableValue(i,r)),a){let l=`lh-table-column--${r.valueType}`;this._dom.createChildOf(n,"td",l).append(a)}else this._dom.createChildOf(n,"td","lh-table-column--empty")}return n}_renderTableRowsFromItem(e,t){let n=this._dom.createFragment();if(n.append(this._renderTableRow(e,t)),!e.subItems)return n;let r=t.map(this._getDerivedSubItemsHeading);if(!r.some(Boolean))return n;for(let i of e.subItems.items){let a=this._renderTableRow(i,r);a.classList.add("lh-sub-item-row"),n.append(a)}return n}_adornEntityGroupRow(e){let t=e.dataset.entity;if(!t)return;let n=this._entities?.find(i=>i.name===t);if(!n)return;let r=this._dom.find("td",e);if(n.category){let i=this._dom.createElement("span");i.classList.add("lh-audit__adorn"),i.textContent=n.category,r.append(" ",i)}if(n.isFirstParty){let i=this._dom.createElement("span");i.classList.add("lh-audit__adorn","lh-audit__adorn1p"),i.textContent=g.strings.firstPartyChipLabel,r.append(" ",i)}if(n.homepage){let i=this._dom.createElement("a");i.href=n.homepage,i.target="_blank",i.title=g.strings.openInANewTabTooltip,i.classList.add("lh-report-icon--external"),r.append(" ",i)}}_renderEntityGroupRow(e,t){let n={...t[0]};n.valueType="text";let r=[n,...t.slice(1)],i=this._dom.createFragment();return i.append(this._renderTableRow(e,r)),this._dom.find("tr",i).classList.add("lh-row--group"),i}_getEntityGroupItems(e){let{items:t,headings:n,sortedBy:r}=e;if(!t.length||e.isEntityGrouped||!t.some(d=>d.entity))return[];let i=new Set(e.skipSumming||[]),a=[];for(let d of n)!d.key||i.has(d.key)||Be.includes(d.valueType)&&a.push(d.key);let l=n[0].key;if(!l)return[];let s=new Map;for(let d of t){let p=typeof d.entity=="string"?d.entity:void 0,h=s.get(p)||{[l]:p||g.strings.unattributable,entity:p};for(let u of a)h[u]=Number(h[u]||0)+Number(d[u]||0);s.set(p,h)}let c=[...s.values()];return r&&c.sort(y.getTableItemSortComparator(r)),c}_renderTable(e){if(!e.items.length)return this._dom.createElement("span");let t=this._dom.createElement("table","lh-table"),n=this._dom.createChildOf(t,"thead"),r=this._dom.createChildOf(n,"tr");for(let l of e.headings){let c=`lh-table-column--${l.valueType||"text"}`,d=this._dom.createElement("div","lh-text");d.textContent=l.label,this._dom.createChildOf(r,"th",c).append(d)}let i=this._getEntityGroupItems(e),a=this._dom.createChildOf(t,"tbody");if(i.length)for(let l of i){let s=typeof l.entity=="string"?l.entity:void 0,c=this._renderEntityGroupRow(l,e.headings);for(let p of e.items.filter(h=>h.entity===s))c.append(this._renderTableRowsFromItem(p,e.headings));let d=this._dom.findAll("tr",c);s&&d.length&&(d.forEach(p=>p.dataset.entity=s),this._adornEntityGroupRow(d[0])),a.append(c)}else{let l=!0;for(let s of e.items){let c=this._renderTableRowsFromItem(s,e.headings),d=this._dom.findAll("tr",c),p=d[0];if(typeof s.entity=="string"&&(p.dataset.entity=s.entity),e.isEntityGrouped&&s.entity)p.classList.add("lh-row--group"),this._adornEntityGroupRow(p);else for(let h of d)h.classList.add(l?"lh-row--even":"lh-row--odd");l=!l,a.append(c)}}return t}_renderList(e){let t=this._dom.createElement("div","lh-list");return e.items.forEach(n=>{let r=this.render(n);r&&t.append(r)}),t}renderNode(e){let t=this._dom.createElement("span","lh-node");if(e.nodeLabel){let a=this._dom.createElement("div");a.textContent=e.nodeLabel,t.append(a)}if(e.snippet){let a=this._dom.createElement("div");a.classList.add("lh-node__snippet"),a.textContent=e.snippet,t.append(a)}if(e.selector&&(t.title=e.selector),e.path&&t.setAttribute("data-path",e.path),e.selector&&t.setAttribute("data-selector",e.selector),e.snippet&&t.setAttribute("data-snippet",e.snippet),!this._fullPageScreenshot)return t;let n=e.lhId&&this._fullPageScreenshot.nodes[e.lhId];if(!n||n.width===0||n.height===0)return t;let r={width:147,height:100},i=P.render(this._dom,this._fullPageScreenshot.screenshot,n,r);return i&&t.prepend(i),t}renderSourceLocation(e){if(!e.url)return null;let t=`${e.url}:${e.line+1}:${e.column}`,n;e.original&&(n=`${e.original.file||"<unmapped>"}:${e.original.line+1}:${e.original.column}`);let r;if(e.urlProvider==="network"&&n)r=this._renderLink({url:e.url,text:n}),r.title=`maps to generated location ${t}`;else if(e.urlProvider==="network"&&!n)r=this.renderTextURL(e.url),this._dom.find(".lh-link",r).textContent+=`:${e.line+1}:${e.column}`;else if(e.urlProvider==="comment"&&n)r=this._renderText(`${n} (from source map)`),r.title=`${t} (from sourceURL)`;else if(e.urlProvider==="comment"&&!n)r=this._renderText(`${t} (from sourceURL)`);else return null;return r.classList.add("lh-source-location"),r.setAttribute("data-source-url",e.url),r.setAttribute("data-source-line",String(e.line)),r.setAttribute("data-source-column",String(e.column)),r}_renderFilmstrip(e){let t=this._dom.createElement("div","lh-filmstrip");for(let n of e.items){let r=this._dom.createChildOf(t,"div","lh-filmstrip__frame"),i=this._dom.createChildOf(r,"img","lh-filmstrip__thumbnail");i.src=n.data,i.alt="Screenshot"}return t}_renderCode(e){let t=this._dom.createElement("pre","lh-code");return t.textContent=e,t}};var Y="\xA0";var $=class{constructor(e){e==="en-XA"&&(e="de"),this._locale=e,this._cachedNumberFormatters=new Map}_formatNumberWithGranularity(e,t,n={}){if(t!==void 0){let a=-Math.log10(t);Number.isInteger(a)||(console.warn(`granularity of ${t} is invalid. Using 1 instead`),t=1),t<1&&(n={...n},n.minimumFractionDigits=n.maximumFractionDigits=Math.ceil(a)),e=Math.round(e/t)*t,Object.is(e,-0)&&(e=0)}else Math.abs(e)<5e-4&&(e=0);let r,i=[n.minimumFractionDigits,n.maximumFractionDigits,n.style,n.unit,n.unitDisplay,this._locale].join("");return r=this._cachedNumberFormatters.get(i),r||(r=new Intl.NumberFormat(this._locale,n),this._cachedNumberFormatters.set(i,r)),r.format(e).replace(" ",Y)}formatNumber(e,t){return this._formatNumberWithGranularity(e,t)}formatInteger(e){return this._formatNumberWithGranularity(e,1)}formatPercent(e){return new Intl.NumberFormat(this._locale,{style:"percent"}).format(e)}formatBytesToKiB(e,t=void 0){return this._formatNumberWithGranularity(e/1024,t)+`${Y}KiB`}formatBytesToMiB(e,t=void 0){return this._formatNumberWithGranularity(e/1048576,t)+`${Y}MiB`}formatBytes(e,t=1){return this._formatNumberWithGranularity(e,t,{style:"unit",unit:"byte",unitDisplay:"long"})}formatBytesWithBestUnit(e,t=void 0){return e>=1048576?this.formatBytesToMiB(e,t):e>=1024?this.formatBytesToKiB(e,t):this._formatNumberWithGranularity(e,t,{style:"unit",unit:"byte",unitDisplay:"narrow"})}formatKbps(e,t=void 0){return this._formatNumberWithGranularity(e,t,{style:"unit",unit:"kilobit-per-second",unitDisplay:"short"})}formatMilliseconds(e,t=void 0){return this._formatNumberWithGranularity(e,t,{style:"unit",unit:"millisecond",unitDisplay:"short"})}formatSeconds(e,t=void 0){return this._formatNumberWithGranularity(e/1e3,t,{style:"unit",unit:"second",unitDisplay:"narrow"})}formatDateTime(e){let t={month:"short",day:"numeric",year:"numeric",hour:"numeric",minute:"numeric",timeZoneName:"short"},n;try{n=new Intl.DateTimeFormat(this._locale,t)}catch{t.timeZone="UTC",n=new Intl.DateTimeFormat(this._locale,t)}return n.format(new Date(e))}formatDuration(e){let t=e/1e3;if(Math.round(t)===0)return"None";let n=[],r={day:60*60*24,hour:60*60,minute:60,second:1};return Object.keys(r).forEach(i=>{let a=r[i],l=Math.floor(t/a);if(l>0){t-=l*a;let s=this._formatNumberWithGranularity(l,1,{style:"unit",unit:i,unitDisplay:"narrow"});n.push(s)}}),n.join(" ")}};var B=class extends R{_renderMetric(e){let t=this.dom.createComponent("metric"),n=this.dom.find(".lh-metric",t);n.id=e.result.id;let r=y.calculateRating(e.result.score,e.result.scoreDisplayMode);n.classList.add(`lh-metric--${r}`);let i=this.dom.find(".lh-metric__title",t);i.textContent=e.result.title;let a=this.dom.find(".lh-metric__value",t);a.textContent=e.result.displayValue||"";let l=this.dom.find(".lh-metric__description",t);if(l.append(this.dom.convertMarkdownLinkSnippets(e.result.description)),e.result.scoreDisplayMode==="error"){l.textContent="",a.textContent="Error!";let s=this.dom.createChildOf(l,"span");s.textContent=e.result.errorMessage||"Report error: no metric information"}else e.result.scoreDisplayMode==="notApplicable"&&(a.textContent="--");return n}_renderOpportunity(e,t){let n=this.dom.createComponent("opportunity"),r=this.populateAuditValues(e,n);if(r.id=e.result.id,!e.result.details||e.result.scoreDisplayMode==="error")return r;let i=e.result.details;if(i.overallSavingsMs===void 0)return r;let a=this.dom.find("span.lh-audit__display-text, div.lh-audit__display-text",r),l=`${i.overallSavingsMs/t*100}%`;if(this.dom.find("div.lh-sparkline__bar",r).style.width=l,a.textContent=g.i18n.formatSeconds(i.overallSavingsMs,.01),e.result.displayValue){let s=e.result.displayValue;this.dom.find("div.lh-load-opportunity__sparkline",r).title=s,a.title=s}return r}_getWastedMs(e){if(e.result.details){let t=e.result.details;if(typeof t.overallSavingsMs!="number")throw new Error("non-opportunity details passed to _getWastedMs");return t.overallSavingsMs}else return Number.MIN_VALUE}_getScoringCalculatorHref(e){let t=e.filter(p=>p.group==="metrics"),n=e.find(p=>p.id==="interactive"),r=e.find(p=>p.id==="first-cpu-idle"),i=e.find(p=>p.id==="first-meaningful-paint");n&&t.push(n),r&&t.push(r),i&&t.push(i);let a=p=>Math.round(p*100)/100,s=[...t.map(p=>{let h;return typeof p.result.numericValue=="number"?(h=p.id==="cumulative-layout-shift"?a(p.result.numericValue):Math.round(p.result.numericValue),h=h.toString()):h="null",[p.acronym||p.id,h]})];g.reportJson&&(s.push(["device",g.reportJson.configSettings.formFactor]),s.push(["version",g.reportJson.lighthouseVersion]));let c=new URLSearchParams(s),d=new URL("https://googlechrome.github.io/lighthouse/scorecalc/");return d.hash=c.toString(),d.href}_classifyPerformanceAudit(e){return e.group?null:e.result.details?.overallSavingsMs!==void 0?"load-opportunity":"diagnostic"}render(e,t,n){let r=g.strings,i=this.dom.createElement("div","lh-category");i.id=e.id,i.append(this.renderCategoryHeader(e,t,n));let a=e.auditRefs.filter(m=>m.group==="metrics");if(a.length){let[m,w]=this.renderAuditGroup(t.metrics),v=this.dom.createElement("input","lh-metrics-toggle__input"),x=`lh-metrics-toggle${g.getUniqueSuffix()}`;v.setAttribute("aria-label","Toggle the display of metric descriptions"),v.type="checkbox",v.id=x,m.prepend(v);let E=this.dom.find(".lh-audit-group__header",m),A=this.dom.createChildOf(E,"label","lh-metrics-toggle__label");A.htmlFor=x;let C=this.dom.createChildOf(A,"span","lh-metrics-toggle__labeltext--show"),L=this.dom.createChildOf(A,"span","lh-metrics-toggle__labeltext--hide");C.textContent=g.strings.expandView,L.textContent=g.strings.collapseView;let S=this.dom.createElement("div","lh-metrics-container");if(m.insertBefore(S,w),a.forEach(z=>{S.append(this._renderMetric(z))}),i.querySelector(".lh-gauge__wrapper")){let z=this.dom.find(".lh-category-header__description",i),M=this.dom.createChildOf(z,"div","lh-metrics__disclaimer"),T=this.dom.convertMarkdownLinkSnippets(r.varianceDisclaimer);M.append(T);let F=this.dom.createChildOf(M,"a","lh-calclink");F.target="_blank",F.textContent=r.calculatorLink,this.dom.safelySetHref(F,this._getScoringCalculatorHref(e.auditRefs))}m.classList.add("lh-audit-group--metrics"),i.append(m)}let l=this.dom.createChildOf(i,"div","lh-filmstrip-container"),c=e.auditRefs.find(m=>m.id==="screenshot-thumbnails")?.result;if(c?.details){l.id=c.id;let m=this.detailsRenderer.render(c.details);m&&l.append(m)}let d=e.auditRefs.filter(m=>this._classifyPerformanceAudit(m)==="load-opportunity").filter(m=>!y.showAsPassed(m.result)).sort((m,w)=>this._getWastedMs(w)-this._getWastedMs(m)),p=a.filter(m=>!!m.relevantAudits);if(p.length&&this.renderMetricAuditFilter(p,i),d.length){let w=d.map(S=>this._getWastedMs(S)),v=Math.max(...w),x=Math.max(Math.ceil(v/1e3)*1e3,2e3),[E,A]=this.renderAuditGroup(t["load-opportunities"]),C=this.dom.createComponent("opportunityHeader");this.dom.find(".lh-load-opportunity__col--one",C).textContent=r.opportunityResourceColumnLabel,this.dom.find(".lh-load-opportunity__col--two",C).textContent=r.opportunitySavingsColumnLabel;let L=this.dom.find(".lh-load-opportunity__header",C);E.insertBefore(L,A),d.forEach(S=>E.insertBefore(this._renderOpportunity(S,x),A)),E.classList.add("lh-audit-group--load-opportunities"),i.append(E)}let h=e.auditRefs.filter(m=>this._classifyPerformanceAudit(m)==="diagnostic").filter(m=>!y.showAsPassed(m.result)).sort((m,w)=>{let v=m.result.scoreDisplayMode==="informative"?100:Number(m.result.score),x=w.result.scoreDisplayMode==="informative"?100:Number(w.result.score);return v-x});if(h.length){let[m,w]=this.renderAuditGroup(t.diagnostics);h.forEach(v=>m.insertBefore(this.renderAudit(v),w)),m.classList.add("lh-audit-group--diagnostics"),i.append(m)}let u=e.auditRefs.filter(m=>this._classifyPerformanceAudit(m)&&y.showAsPassed(m.result));if(!u.length)return i;let f={auditRefs:u,groupDefinitions:t},b=this.renderClump("passed",f);i.append(b);let _=[];if(["performance-budget","timing-budget"].forEach(m=>{let w=e.auditRefs.find(v=>v.id===m);if(w?.result.details){let v=this.detailsRenderer.render(w.result.details);v&&(v.id=m,v.classList.add("lh-details","lh-details--budget","lh-audit"),_.push(v))}}),_.length>0){let[m,w]=this.renderAuditGroup(t.budgets);_.forEach(v=>m.insertBefore(v,w)),m.classList.add("lh-audit-group--budgets"),i.append(m)}return i}renderMetricAuditFilter(e,t){let n=this.dom.createElement("div","lh-metricfilter"),r=this.dom.createChildOf(n,"span","lh-metricfilter__text");r.textContent=g.strings.showRelevantAudits;let i=[{acronym:"All"},...e],a=g.getUniqueSuffix();for(let l of i){let s=`metric-${l.acronym}-${a}`,c=this.dom.createChildOf(n,"input","lh-metricfilter__radio");c.type="radio",c.name=`metricsfilter-${a}`,c.id=s;let d=this.dom.createChildOf(n,"label","lh-metricfilter__label");d.htmlFor=s,d.title=l.result?.title,d.textContent=l.acronym||l.id,l.acronym==="All"&&(c.checked=!0,d.classList.add("lh-metricfilter__label--active")),t.append(n),c.addEventListener("input",p=>{for(let u of t.querySelectorAll("label.lh-metricfilter__label"))u.classList.toggle("lh-metricfilter__label--active",u.htmlFor===s);t.classList.toggle("lh-category--filtered",l.acronym!=="All");for(let u of t.querySelectorAll("div.lh-audit")){if(l.acronym==="All"){u.hidden=!1;continue}u.hidden=!0,l.relevantAudits&&l.relevantAudits.includes(u.id)&&(u.hidden=!1)}let h=t.querySelectorAll("div.lh-audit-group, details.lh-audit-group");for(let u of h){u.hidden=!1;let f=Array.from(u.querySelectorAll("div.lh-audit")),b=!!f.length&&f.every(_=>_.hidden);u.hidden=b}})}}};var G=class o extends R{render(e,t={}){let n=this.dom.createElement("div","lh-category");n.id=e.id,n.append(this.renderCategoryHeader(e,t));let r=e.auditRefs,i=r.filter(c=>c.result.scoreDisplayMode!=="manual"),a=this._renderAudits(i,t);n.append(a);let l=r.filter(c=>c.result.scoreDisplayMode==="manual"),s=this.renderClump("manual",{auditRefs:l,description:e.manualDescription,openByDefault:!0});return n.append(s),n}renderCategoryScore(e,t){if(e.score===null)return super.renderScoreGauge(e,t);let n=this.dom.createComponent("gaugePwa"),r=this.dom.find("a.lh-gauge--pwa__wrapper",n),i=n.querySelector("svg");if(!i)throw new Error("no SVG element found in PWA score gauge template");o._makeSvgReferencesUnique(i);let a=this._getGroupIds(e.auditRefs),l=this._getPassingGroupIds(e.auditRefs);if(l.size===a.size)r.classList.add("lh-badged--all");else for(let s of l)r.classList.add(`lh-badged--${s}`);return this.dom.find(".lh-gauge__label",n).textContent=e.title,r.title=this._getGaugeTooltip(e.auditRefs,t),n}_getGroupIds(e){let t=e.map(n=>n.group).filter(n=>!!n);return new Set(t)}_getPassingGroupIds(e){let t=this._getGroupIds(e);for(let n of e)!y.showAsPassed(n.result)&&n.group&&t.delete(n.group);return t}_getGaugeTooltip(e,t){let n=this._getGroupIds(e),r=[];for(let i of n){let a=e.filter(d=>d.group===i),l=a.length,s=a.filter(d=>y.showAsPassed(d.result)).length,c=t[i].title;r.push(`${c}: ${s}/${l}`)}return r.join(", ")}_renderAudits(e,t){let n=this.renderUnexpandableClump(e,t),r=this._getPassingGroupIds(e);for(let i of r)this.dom.find(`.lh-audit-group--${i}`,n).classList.add("lh-badged");return n}static _makeSvgReferencesUnique(e){let t=e.querySelector("defs");if(!t)return;let n=g.getUniqueSuffix(),r=t.querySelectorAll("[id]");for(let i of r){let a=i.id,l=`${a}-${n}`;i.id=l;let s=e.querySelectorAll(`use[href="#${a}"]`);for(let d of s)d.setAttribute("href",`#${l}`);let c=e.querySelectorAll(`[fill="url(#${a})"]`);for(let d of c)d.setAttribute("fill",`url(#${l})`)}}};var W=class{constructor(e){this._dom=e,this._opts={}}renderReport(e,t,n){if(!this._dom.rootEl&&t){console.warn("Please adopt the new report API in renderer/api.js.");let i=t.closest(".lh-root");i?this._dom.rootEl=i:(t.classList.add("lh-root","lh-vars"),this._dom.rootEl=t)}else this._dom.rootEl&&t&&(this._dom.rootEl=t);n&&(this._opts=n),this._dom.setLighthouseChannel(e.configSettings.channel||"unknown");let r=y.prepareReportResult(e);return this._dom.rootEl.textContent="",this._dom.rootEl.append(this._renderReport(r)),this._dom.rootEl}_renderReportTopbar(e){let t=this._dom.createComponent("topbar"),n=this._dom.find("a.lh-topbar__url",t);return n.textContent=e.finalDisplayedUrl,n.title=e.finalDisplayedUrl,this._dom.safelySetHref(n,e.finalDisplayedUrl),t}_renderReportHeader(){let e=this._dom.createComponent("heading"),t=this._dom.createComponent("scoresWrapper");return this._dom.find(".lh-scores-wrapper-placeholder",e).replaceWith(t),e}_renderReportFooter(e){let t=this._dom.createComponent("footer");return this._renderMetaBlock(e,t),this._dom.find(".lh-footer__version_issue",t).textContent=g.strings.footerIssue,this._dom.find(".lh-footer__version",t).textContent=e.lighthouseVersion,t}_renderMetaBlock(e,t){let n=y.getEmulationDescriptions(e.configSettings||{}),r=e.userAgent.match(/(\w*Chrome\/[\d.]+)/),i=Array.isArray(r)?r[1].replace("/"," ").replace("Chrome","Chromium"):"Chromium",a=e.configSettings.channel,l=e.environment.benchmarkIndex.toFixed(0),s=e.environment.credits?.["axe-core"],c=[`${g.strings.runtimeSettingsBenchmark}: ${l}`,`${g.strings.runtimeSettingsCPUThrottling}: ${n.cpuThrottling}`];n.screenEmulation&&c.push(`${g.strings.runtimeSettingsScreenEmulation}: ${n.screenEmulation}`),s&&c.push(`${g.strings.runtimeSettingsAxeVersion}: ${s}`);let d=[["date",`Captured at ${g.i18n.formatDateTime(e.fetchTime)}`],["devices",`${n.deviceEmulation} with Lighthouse ${e.lighthouseVersion}`,c.join(`
|
|
2480
|
+
`)],["samples-one",g.strings.runtimeSingleLoad,g.strings.runtimeSingleLoadTooltip],["stopwatch",g.strings.runtimeAnalysisWindow],["networkspeed",`${n.summary}`,`${g.strings.runtimeSettingsNetworkThrottling}: ${n.networkThrottling}`],["chrome",`Using ${i}`+(a?` with ${a}`:""),`${g.strings.runtimeSettingsUANetwork}: "${e.environment.networkUserAgent}"`]],p=this._dom.find(".lh-meta__items",t);for(let[h,u,f]of d){let b=this._dom.createChildOf(p,"li","lh-meta__item");if(b.textContent=u,f){b.classList.add("lh-tooltip-boundary");let _=this._dom.createChildOf(b,"div","lh-tooltip");_.textContent=f}b.classList.add("lh-report-icon",`lh-report-icon--${h}`)}}_renderReportWarnings(e){if(!e.runWarnings||e.runWarnings.length===0)return this._dom.createElement("div");let t=this._dom.createComponent("warningsToplevel"),n=this._dom.find(".lh-warnings__msg",t);n.textContent=g.strings.toplevelWarningsMessage;let r=[];for(let i of e.runWarnings){let a=this._dom.createElement("li");a.append(this._dom.convertMarkdownLinkSnippets(i)),r.push(a)}return this._dom.find("ul",t).append(...r),t}_renderScoreGauges(e,t,n){let r=[],i=[],a=[];for(let l of Object.values(e.categories)){let s=n[l.id]||t,c=s.renderCategoryScore(l,e.categoryGroups||{},{gatherMode:e.gatherMode}),d=this._dom.find("a.lh-gauge__wrapper, a.lh-fraction__wrapper",c);d&&(this._dom.safelySetHref(d,`#${l.id}`),d.addEventListener("click",p=>{if(!d.matches('[href^="#"]'))return;let h=d.getAttribute("href"),u=this._dom.rootEl;if(!h||!u)return;let f=this._dom.find(h,u);p.preventDefault(),f.scrollIntoView()}),this._opts.onPageAnchorRendered?.(d)),y.isPluginCategory(l.id)?a.push(c):s.renderCategoryScore===t.renderCategoryScore?r.push(c):i.push(c)}return[...r,...i,...a]}_renderReport(e){g.apply({providedStrings:e.i18n.rendererFormattedStrings,i18n:new $(e.configSettings.locale),reportJson:e});let t=new O(this._dom,{fullPageScreenshot:e.fullPageScreenshot??void 0,entities:e.entities}),n=new R(this._dom,t),r={performance:new B(this._dom,t),pwa:new G(this._dom,t)},i=this._dom.createElement("div");i.append(this._renderReportHeader());let a=this._dom.createElement("div","lh-container"),l=this._dom.createElement("div","lh-report");l.append(this._renderReportWarnings(e));let s;Object.keys(e.categories).length===1?i.classList.add("lh-header--solo-category"):s=this._dom.createElement("div","lh-scores-header");let d=this._dom.createElement("div");if(d.classList.add("lh-scorescale-wrap"),d.append(this._dom.createComponent("scorescale")),s){let f=this._dom.find(".lh-scores-container",i);s.append(...this._renderScoreGauges(e,n,r)),f.append(s,d);let b=this._dom.createElement("div","lh-sticky-header");b.append(...this._renderScoreGauges(e,n,r)),a.append(b)}let p=this._dom.createElement("div","lh-categories");l.append(p);let h={gatherMode:e.gatherMode};for(let f of Object.values(e.categories)){let b=r[f.id]||n;b.dom.createChildOf(p,"div","lh-category-wrapper").append(b.render(f,e.categoryGroups,h))}n.injectFinalScreenshot(p,e.audits,d);let u=this._dom.createFragment();return this._opts.omitGlobalStyles||u.append(this._dom.createComponent("styles")),this._opts.omitTopbar||u.append(this._renderReportTopbar(e)),u.append(a),l.append(this._renderReportFooter(e)),a.append(i,l),e.fullPageScreenshot&&P.installFullPageScreenshot(this._dom.rootEl,e.fullPageScreenshot.screenshot),u}};function U(o,e){let t=o.rootEl;typeof e>"u"?t.classList.toggle("lh-dark"):t.classList.toggle("lh-dark",e)}var Ge=typeof btoa<"u"?btoa:o=>Buffer.from(o).toString("base64"),We=typeof atob<"u"?atob:o=>Buffer.from(o,"base64").toString();async function je(o,e){let t=new TextEncoder().encode(o);if(e.gzip)if(typeof CompressionStream<"u"){let i=new CompressionStream("gzip"),a=i.writable.getWriter();a.write(t),a.close();let l=await new Response(i.readable).arrayBuffer();t=new Uint8Array(l)}else t=window.pako.gzip(o);let n="",r=5e3;for(let i=0;i<t.length;i+=r)n+=String.fromCharCode(...t.subarray(i,i+r));return Ge(n)}function qe(o,e){let t=We(o),n=Uint8Array.from(t,r=>r.charCodeAt(0));return e.gzip?window.pako.ungzip(n,{to:"string"}):new TextDecoder().decode(n)}var ie={toBase64:je,fromBase64:qe};function Z(){let o=window.location.host.endsWith(".vercel.app"),e=new URLSearchParams(window.location.search).has("dev");return o?`https://${window.location.host}/gh-pages`:e?"http://localhost:7333":"https://googlechrome.github.io/lighthouse"}function Q(o){let e=o.generatedTime,t=o.fetchTime||e;return`${o.lighthouseVersion}-${o.finalDisplayedUrl}-${t}`}function Ke(o,e,t){let n=new URL(e).origin;window.addEventListener("message",function i(a){a.origin===n&&r&&a.data.opened&&(r.postMessage(o,n),window.removeEventListener("message",i))});let r=window.open(e,t)}async function ae(o,e,t){let n=new URL(e),r=!!window.CompressionStream;n.hash=await ie.toBase64(JSON.stringify(o),{gzip:r}),r&&n.searchParams.set("gzip","1"),window.open(n.toString(),t)}async function le(o){let e="viewer-"+Q(o),t=Z()+"/viewer/";await ae({lhr:o},t,e)}async function se(o){let e="viewer-"+Q(o),t=Z()+"/viewer/";Ke({lhr:o},t,e)}function ce(o){if(!o.audits["script-treemap-data"].details)throw new Error("no script treemap data found");let t={lhr:{mainDocumentUrl:o.mainDocumentUrl,finalUrl:o.finalUrl,finalDisplayedUrl:o.finalDisplayedUrl,audits:{"script-treemap-data":o.audits["script-treemap-data"]},configSettings:{locale:o.configSettings.locale}}},n=Z()+"/treemap/",r="treemap-"+Q(o);ae(t,n,r)}var j=class{constructor(e){this._dom=e,this._toggleEl,this._menuEl,this.onDocumentKeyDown=this.onDocumentKeyDown.bind(this),this.onToggleClick=this.onToggleClick.bind(this),this.onToggleKeydown=this.onToggleKeydown.bind(this),this.onMenuFocusOut=this.onMenuFocusOut.bind(this),this.onMenuKeydown=this.onMenuKeydown.bind(this),this._getNextMenuItem=this._getNextMenuItem.bind(this),this._getNextSelectableNode=this._getNextSelectableNode.bind(this),this._getPreviousMenuItem=this._getPreviousMenuItem.bind(this)}setup(e){this._toggleEl=this._dom.find(".lh-topbar button.lh-tools__button",this._dom.rootEl),this._toggleEl.addEventListener("click",this.onToggleClick),this._toggleEl.addEventListener("keydown",this.onToggleKeydown),this._menuEl=this._dom.find(".lh-topbar div.lh-tools__dropdown",this._dom.rootEl),this._menuEl.addEventListener("keydown",this.onMenuKeydown),this._menuEl.addEventListener("click",e)}close(){this._toggleEl.classList.remove("lh-active"),this._toggleEl.setAttribute("aria-expanded","false"),this._menuEl.contains(this._dom.document().activeElement)&&this._toggleEl.focus(),this._menuEl.removeEventListener("focusout",this.onMenuFocusOut),this._dom.document().removeEventListener("keydown",this.onDocumentKeyDown)}open(e){this._toggleEl.classList.contains("lh-active")?e.focus():this._menuEl.addEventListener("transitionend",()=>{e.focus()},{once:!0}),this._toggleEl.classList.add("lh-active"),this._toggleEl.setAttribute("aria-expanded","true"),this._menuEl.addEventListener("focusout",this.onMenuFocusOut),this._dom.document().addEventListener("keydown",this.onDocumentKeyDown)}onToggleClick(e){e.preventDefault(),e.stopImmediatePropagation(),this._toggleEl.classList.contains("lh-active")?this.close():this.open(this._getNextMenuItem())}onToggleKeydown(e){switch(e.code){case"ArrowUp":e.preventDefault(),this.open(this._getPreviousMenuItem());break;case"ArrowDown":case"Enter":case" ":e.preventDefault(),this.open(this._getNextMenuItem());break;default:}}onMenuKeydown(e){let t=e.target;switch(e.code){case"ArrowUp":e.preventDefault(),this._getPreviousMenuItem(t).focus();break;case"ArrowDown":e.preventDefault(),this._getNextMenuItem(t).focus();break;case"Home":e.preventDefault(),this._getNextMenuItem().focus();break;case"End":e.preventDefault(),this._getPreviousMenuItem().focus();break;default:}}onDocumentKeyDown(e){e.keyCode===27&&this.close()}onMenuFocusOut(e){let t=e.relatedTarget;this._menuEl.contains(t)||this.close()}_getNextSelectableNode(e,t){let n=e.filter(i=>!(!(i instanceof HTMLElement)||i.hasAttribute("disabled")||window.getComputedStyle(i).display==="none")),r=t?n.indexOf(t)+1:0;return r>=n.length&&(r=0),n[r]}_getNextMenuItem(e){let t=Array.from(this._menuEl.childNodes);return this._getNextSelectableNode(t,e)}_getPreviousMenuItem(e){let t=Array.from(this._menuEl.childNodes).reverse();return this._getNextSelectableNode(t,e)}};var q=class{constructor(e,t){this.lhr,this._reportUIFeatures=e,this._dom=t,this._dropDownMenu=new j(this._dom),this._copyAttempt=!1,this.topbarEl,this.categoriesEl,this.stickyHeaderEl,this.highlightEl,this.onDropDownMenuClick=this.onDropDownMenuClick.bind(this),this.onKeyUp=this.onKeyUp.bind(this),this.onCopy=this.onCopy.bind(this),this.collapseAllDetails=this.collapseAllDetails.bind(this)}enable(e){this.lhr=e,this._dom.rootEl.addEventListener("keyup",this.onKeyUp),this._dom.document().addEventListener("copy",this.onCopy),this._dropDownMenu.setup(this.onDropDownMenuClick),this._setUpCollapseDetailsAfterPrinting(),this._dom.find(".lh-topbar__logo",this._dom.rootEl).addEventListener("click",()=>U(this._dom)),this._setupStickyHeader()}onDropDownMenuClick(e){e.preventDefault();let t=e.target;if(!(!t||!t.hasAttribute("data-action"))){switch(t.getAttribute("data-action")){case"copy":this.onCopyButtonClick();break;case"print-summary":this.collapseAllDetails(),this._print();break;case"print-expanded":this.expandAllDetails(),this._print();break;case"save-json":{let n=JSON.stringify(this.lhr,null,2);this._reportUIFeatures._saveFile(new Blob([n],{type:"application/json"}));break}case"save-html":{let n=this._reportUIFeatures.getReportHtml();try{this._reportUIFeatures._saveFile(new Blob([n],{type:"text/html"}))}catch(r){this._dom.fireEventOn("lh-log",this._dom.document(),{cmd:"error",msg:"Could not export as HTML. "+r.message})}break}case"open-viewer":{this._dom.isDevTools()?le(this.lhr):se(this.lhr);break}case"save-gist":{this._reportUIFeatures.saveAsGist();break}case"toggle-dark":{U(this._dom);break}case"view-unthrottled-trace":this._reportUIFeatures._opts.onViewTrace?.()}this._dropDownMenu.close()}}onCopy(e){this._copyAttempt&&e.clipboardData&&(e.preventDefault(),e.clipboardData.setData("text/plain",JSON.stringify(this.lhr,null,2)),this._dom.fireEventOn("lh-log",this._dom.document(),{cmd:"log",msg:"Report JSON copied to clipboard"})),this._copyAttempt=!1}onCopyButtonClick(){this._dom.fireEventOn("lh-analytics",this._dom.document(),{cmd:"send",fields:{hitType:"event",eventCategory:"report",eventAction:"copy"}});try{this._dom.document().queryCommandSupported("copy")&&(this._copyAttempt=!0,this._dom.document().execCommand("copy")||(this._copyAttempt=!1,this._dom.fireEventOn("lh-log",this._dom.document(),{cmd:"warn",msg:"Your browser does not support copy to clipboard."})))}catch(e){this._copyAttempt=!1,this._dom.fireEventOn("lh-log",this._dom.document(),{cmd:"log",msg:e.message})}}onKeyUp(e){(e.ctrlKey||e.metaKey)&&e.keyCode===80&&this._dropDownMenu.close()}expandAllDetails(){this._dom.findAll(".lh-categories details",this._dom.rootEl).map(t=>t.open=!0)}collapseAllDetails(){this._dom.findAll(".lh-categories details",this._dom.rootEl).map(t=>t.open=!1)}_print(){this._reportUIFeatures._opts.onPrintOverride?this._reportUIFeatures._opts.onPrintOverride(this._dom.rootEl):self.print()}resetUIState(){this._dropDownMenu.close()}_getScrollParent(e){let{overflowY:t}=window.getComputedStyle(e);return t!=="visible"&&t!=="hidden"?e:e.parentElement?this._getScrollParent(e.parentElement):document}_setUpCollapseDetailsAfterPrinting(){"onbeforeprint"in self?self.addEventListener("afterprint",this.collapseAllDetails):self.matchMedia("print").addListener(t=>{t.matches?this.expandAllDetails():this.collapseAllDetails()})}_setupStickyHeader(){this.topbarEl=this._dom.find("div.lh-topbar",this._dom.rootEl),this.categoriesEl=this._dom.find("div.lh-categories",this._dom.rootEl),window.requestAnimationFrame(()=>window.requestAnimationFrame(()=>{try{this.stickyHeaderEl=this._dom.find("div.lh-sticky-header",this._dom.rootEl)}catch{return}this.highlightEl=this._dom.createChildOf(this.stickyHeaderEl,"div","lh-highlighter");let e=this._getScrollParent(this._dom.find(".lh-container",this._dom.rootEl));e.addEventListener("scroll",()=>this._updateStickyHeader());let t=e instanceof window.Document?document.documentElement:e;new window.ResizeObserver(()=>this._updateStickyHeader()).observe(t)}))}_updateStickyHeader(){if(!this.stickyHeaderEl)return;let e=this.topbarEl.getBoundingClientRect().bottom,t=this.categoriesEl.getBoundingClientRect().top,n=e>=t,i=Array.from(this._dom.rootEl.querySelectorAll(".lh-category")).filter(p=>p.getBoundingClientRect().top-window.innerHeight/2<0),a=i.length>0?i.length-1:0,l=this.stickyHeaderEl.querySelectorAll(".lh-gauge__wrapper, .lh-fraction__wrapper"),s=l[a],c=l[0].getBoundingClientRect().left,d=s.getBoundingClientRect().left-c;this.highlightEl.style.transform=`translate(${d}px)`,this.stickyHeaderEl.classList.toggle("lh-sticky-header--visible",n)}};function Je(o,e){let t=e?new Date(e):new Date,n=t.toLocaleTimeString("en-US",{hour12:!1}),r=t.toLocaleDateString("en-US",{year:"numeric",month:"2-digit",day:"2-digit"}).split("/");r.unshift(r.pop());let i=r.join("-");return`${o}_${i}_${n}`.replace(/[/?<>\\:*|"]/g,"-")}function de(o){let e=new URL(o.finalDisplayedUrl).hostname;return Je(e,o.fetchTime)}function Ye(o){return Array.from(o.tBodies[0].rows)}var K=class{constructor(e,t={}){this.json,this._dom=e,this._opts=t,this._topbar=t.omitTopbar?null:new q(this,e),this.onMediaQueryChange=this.onMediaQueryChange.bind(this)}initFeatures(e){this.json=e,this._fullPageScreenshot=k.getFullPageScreenshot(e),this._topbar&&(this._topbar.enable(e),this._topbar.resetUIState()),this._setupMediaQueryListeners(),this._setupThirdPartyFilter(),this._setupElementScreenshotOverlay(this._dom.rootEl);let t=this._dom.isDevTools()||this._opts.disableDarkMode||this._opts.disableAutoDarkModeAndFireworks;!t&&window.matchMedia("(prefers-color-scheme: dark)").matches&&U(this._dom,!0);let r=["performance","accessibility","best-practices","seo"].every(s=>{let c=e.categories[s];return c&&c.score===1}),i=this._opts.disableFireworks||this._opts.disableAutoDarkModeAndFireworks;if(r&&!i&&(this._enableFireworks(),t||U(this._dom,!0)),e.categories.performance&&e.categories.performance.auditRefs.some(s=>!!(s.group==="metrics"&&e.audits[s.id].errorMessage))){let s=this._dom.find("input.lh-metrics-toggle__input",this._dom.rootEl);s.checked=!0}this.json.audits["script-treemap-data"]&&this.json.audits["script-treemap-data"].details&&this.addButton({text:g.strings.viewTreemapLabel,icon:"treemap",onClick:()=>ce(this.json)}),this._opts.onViewTrace&&(e.configSettings.throttlingMethod==="simulate"?this._dom.find('a[data-action="view-unthrottled-trace"]',this._dom.rootEl).classList.remove("lh-hidden"):this.addButton({text:g.strings.viewTraceLabel,onClick:()=>this._opts.onViewTrace?.()})),this._opts.getStandaloneReportHTML&&this._dom.find('a[data-action="save-html"]',this._dom.rootEl).classList.remove("lh-hidden");for(let s of this._dom.findAll("[data-i18n]",this._dom.rootEl)){let d=s.getAttribute("data-i18n");s.textContent=g.strings[d]}}addButton(e){let t=this._dom.rootEl.querySelector(".lh-audit-group--metrics");if(!t)return;let n=t.querySelector(".lh-buttons");n||(n=this._dom.createChildOf(t,"div","lh-buttons"));let r=["lh-button"];e.icon&&(r.push("lh-report-icon"),r.push(`lh-report-icon--${e.icon}`));let i=this._dom.createChildOf(n,"button",r.join(" "));return i.textContent=e.text,i.addEventListener("click",e.onClick),i}resetUIState(){this._topbar&&this._topbar.resetUIState()}getReportHtml(){if(!this._opts.getStandaloneReportHTML)throw new Error("`getStandaloneReportHTML` is not set");return this.resetUIState(),this._opts.getStandaloneReportHTML()}saveAsGist(){throw new Error("Cannot save as gist from base report")}_enableFireworks(){this._dom.find(".lh-scores-container",this._dom.rootEl).classList.add("lh-score100")}_setupMediaQueryListeners(){let e=self.matchMedia("(max-width: 500px)");e.addListener(this.onMediaQueryChange),this.onMediaQueryChange(e)}_resetUIState(){this._topbar&&this._topbar.resetUIState()}onMediaQueryChange(e){this._dom.rootEl.classList.toggle("lh-narrow",e.matches)}_setupThirdPartyFilter(){let e=["uses-rel-preconnect","third-party-facades"],t=["legacy-javascript"];Array.from(this._dom.rootEl.querySelectorAll("table.lh-table")).filter(i=>i.querySelector("td.lh-table-column--url, td.lh-table-column--source-location")).filter(i=>{let a=i.closest(".lh-audit");if(!a)throw new Error(".lh-table not within audit");return!e.includes(a.id)}).forEach(i=>{let a=Ye(i),l=a.filter(_=>!_.classList.contains("lh-sub-item-row")),s=this._getThirdPartyRows(l,k.getFinalDisplayedUrl(this.json)),c=a.some(_=>_.classList.contains("lh-row--even")),d=this._dom.createComponent("3pFilter"),p=this._dom.find("input",d);p.addEventListener("change",_=>{let m=_.target instanceof HTMLInputElement&&!_.target.checked,w=!0,v=l[0];for(;v;){let x=m&&s.includes(v);do v.classList.toggle("lh-row--hidden",x),c&&(v.classList.toggle("lh-row--even",!x&&w),v.classList.toggle("lh-row--odd",!x&&!w)),v=v.nextElementSibling;while(v&&v.classList.contains("lh-sub-item-row"));x||(w=!w)}});let h=s.filter(_=>!_.classList.contains("lh-row--group")).length;this._dom.find(".lh-3p-filter-count",d).textContent=`${h}`,this._dom.find(".lh-3p-ui-string",d).textContent=g.strings.thirdPartyResourcesLabel;let u=s.length===l.length,f=!s.length;if((u||f)&&(this._dom.find("div.lh-3p-filter",d).hidden=!0),!i.parentNode)return;i.parentNode.insertBefore(d,i);let b=i.closest(".lh-audit");if(!b)throw new Error(".lh-table not within audit");t.includes(b.id)&&!u&&p.click()})}_setupElementScreenshotOverlay(e){this._fullPageScreenshot&&P.installOverlayFeature({dom:this._dom,rootEl:e,overlayContainerEl:e,fullPageScreenshot:this._fullPageScreenshot})}_getThirdPartyRows(e,t){let n=k.getRootDomain(t),r=this.json.entities?.find(a=>a.isFirstParty===!0)?.name,i=[];for(let a of e){if(r){if(!a.dataset.entity||a.dataset.entity===r)continue}else{let l=a.querySelector("div.lh-text__url");if(!l)continue;let s=l.dataset.url;if(!s||!(k.getRootDomain(s)!==n))continue}i.push(a)}return i}_saveFile(e){let t=e.type.match("json")?".json":".html",n=de({finalDisplayedUrl:k.getFinalDisplayedUrl(this.json),fetchTime:this.json.fetchTime})+t;this._opts.onSaveFileOverride?this._opts.onSaveFileOverride(e,n):this._dom.saveFile(e,n)}};function pe(o,e={}){let t=document.createElement("article");t.classList.add("lh-root","lh-vars");let n=new V(t.ownerDocument,t);return new W(n).renderReport(o,t,e),new K(n,e).initFeatures(o),t}var J=class{constructor(e){this.el=e;let t=document.createElement("style");if(t.textContent=`
|
|
2481
|
+
#lh-log {
|
|
2482
|
+
position: fixed;
|
|
2483
|
+
background-color: #323232;
|
|
2484
|
+
color: #fff;
|
|
2485
|
+
min-height: 48px;
|
|
2486
|
+
min-width: 288px;
|
|
2487
|
+
padding: 16px 24px;
|
|
2488
|
+
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
|
|
2489
|
+
border-radius: 2px;
|
|
2490
|
+
margin: 12px;
|
|
2491
|
+
font-size: 14px;
|
|
2492
|
+
cursor: default;
|
|
2493
|
+
transition: transform 0.3s, opacity 0.3s;
|
|
2494
|
+
transform: translateY(100px);
|
|
2495
|
+
opacity: 0;
|
|
2496
|
+
bottom: 0;
|
|
2497
|
+
left: 0;
|
|
2498
|
+
z-index: 3;
|
|
2499
|
+
display: flex;
|
|
2500
|
+
flex-direction: row;
|
|
2501
|
+
justify-content: center;
|
|
2502
|
+
align-items: center;
|
|
2503
|
+
}
|
|
2504
|
+
|
|
2505
|
+
#lh-log.lh-show {
|
|
2506
|
+
opacity: 1;
|
|
2507
|
+
transform: translateY(0);
|
|
2508
|
+
}
|
|
2509
|
+
`,!this.el.parentNode)throw new Error("element needs to be in the DOM");this.el.parentNode.insertBefore(t,this.el),this._id=void 0}log(e,t=!0){this._id&&clearTimeout(this._id),this.el.textContent=e,this.el.classList.add("lh-show"),t&&(this._id=setTimeout(()=>{this.el.classList.remove("lh-show")},7e3))}warn(e){this.log("Warning: "+e)}error(e){this.log(e),setTimeout(()=>{throw new Error(e)},0)}hide(){this._id&&clearTimeout(this._id),this.el.classList.remove("lh-show")}};function Ze(){let o=window.__LIGHTHOUSE_JSON__,e=pe(o,{getStandaloneReportHTML(){return document.documentElement.outerHTML}});document.body.append(e),document.addEventListener("lh-analytics",t=>{window.ga&&ga(t.detail.cmd,t.detail.fields)}),document.addEventListener("lh-log",t=>{let n=document.querySelector("div#lh-log");if(!n)return;let r=new J(n),i=t.detail;switch(i.cmd){case"log":r.log(i.msg);break;case"warn":r.warn(i.msg);break;case"error":r.error(i.msg);break;case"hide":r.hide();break}})}window.__initLighthouseReport__=Ze;})();
|
|
170
2510
|
/**
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
2511
|
+
* @license
|
|
2512
|
+
* Copyright 2017 The Lighthouse Authors. All Rights Reserved.
|
|
2513
|
+
*
|
|
2514
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
2515
|
+
* you may not use this file except in compliance with the License.
|
|
2516
|
+
* You may obtain a copy of the License at
|
|
2517
|
+
*
|
|
2518
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
2519
|
+
*
|
|
2520
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
2521
|
+
* distributed under the License is distributed on an "AS-IS" BASIS,
|
|
2522
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
2523
|
+
* See the License for the specific language governing permissions and
|
|
2524
|
+
* limitations under the License.
|
|
2525
|
+
*/
|
|
186
2526
|
/**
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
class D{constructor(e){this._dom=e,this._toggleEl,this._menuEl,this.onDocumentKeyDown=this.onDocumentKeyDown.bind(this),this.onToggleClick=this.onToggleClick.bind(this),this.onToggleKeydown=this.onToggleKeydown.bind(this),this.onMenuFocusOut=this.onMenuFocusOut.bind(this),this.onMenuKeydown=this.onMenuKeydown.bind(this),this._getNextMenuItem=this._getNextMenuItem.bind(this),this._getNextSelectableNode=this._getNextSelectableNode.bind(this),this._getPreviousMenuItem=this._getPreviousMenuItem.bind(this)}setup(e){this._toggleEl=this._dom.find(".lh-topbar button.lh-tools__button",this._dom.rootEl),this._toggleEl.addEventListener("click",this.onToggleClick),this._toggleEl.addEventListener("keydown",this.onToggleKeydown),this._menuEl=this._dom.find(".lh-topbar div.lh-tools__dropdown",this._dom.rootEl),this._menuEl.addEventListener("keydown",this.onMenuKeydown),this._menuEl.addEventListener("click",e)}close(){this._toggleEl.classList.remove("lh-active"),this._toggleEl.setAttribute("aria-expanded","false"),this._menuEl.contains(this._dom.document().activeElement)&&this._toggleEl.focus(),this._menuEl.removeEventListener("focusout",this.onMenuFocusOut),this._dom.document().removeEventListener("keydown",this.onDocumentKeyDown)}open(e){this._toggleEl.classList.contains("lh-active")?e.focus():this._menuEl.addEventListener("transitionend",(()=>{e.focus()}),{once:!0}),this._toggleEl.classList.add("lh-active"),this._toggleEl.setAttribute("aria-expanded","true"),this._menuEl.addEventListener("focusout",this.onMenuFocusOut),this._dom.document().addEventListener("keydown",this.onDocumentKeyDown)}onToggleClick(e){e.preventDefault(),e.stopImmediatePropagation(),this._toggleEl.classList.contains("lh-active")?this.close():this.open(this._getNextMenuItem())}onToggleKeydown(e){switch(e.code){case"ArrowUp":e.preventDefault(),this.open(this._getPreviousMenuItem());break;case"ArrowDown":case"Enter":case" ":e.preventDefault(),this.open(this._getNextMenuItem())}}onMenuKeydown(e){const t=e.target;switch(e.code){case"ArrowUp":e.preventDefault(),this._getPreviousMenuItem(t).focus();break;case"ArrowDown":e.preventDefault(),this._getNextMenuItem(t).focus();break;case"Home":e.preventDefault(),this._getNextMenuItem().focus();break;case"End":e.preventDefault(),this._getPreviousMenuItem().focus()}}onDocumentKeyDown(e){27===e.keyCode&&this.close()}onMenuFocusOut(e){const t=e.relatedTarget;this._menuEl.contains(t)||this.close()}_getNextSelectableNode(e,t){const n=e.filter((e=>e instanceof HTMLElement&&(!e.hasAttribute("disabled")&&"none"!==window.getComputedStyle(e).display)));let r=t?n.indexOf(t)+1:0;return r>=n.length&&(r=0),n[r]}_getNextMenuItem(e){const t=Array.from(this._menuEl.childNodes);return this._getNextSelectableNode(t,e)}_getPreviousMenuItem(e){const t=Array.from(this._menuEl.childNodes).reverse();return this._getNextSelectableNode(t,e)}}
|
|
2527
|
+
* @license Copyright 2023 The Lighthouse Authors. All Rights Reserved.
|
|
2528
|
+
* Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
2529
|
+
* Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
|
|
2530
|
+
*/
|
|
192
2531
|
/**
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
2532
|
+
* @license Copyright 2020 The Lighthouse Authors. All Rights Reserved.
|
|
2533
|
+
* Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
2534
|
+
* Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
|
|
2535
|
+
*/
|
|
197
2536
|
/**
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
2537
|
+
* @license
|
|
2538
|
+
* Copyright 2018 The Lighthouse Authors. All Rights Reserved.
|
|
2539
|
+
*
|
|
2540
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
2541
|
+
* you may not use this file except in compliance with the License.
|
|
2542
|
+
* You may obtain a copy of the License at
|
|
2543
|
+
*
|
|
2544
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
2545
|
+
*
|
|
2546
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
2547
|
+
* distributed under the License is distributed on an "AS-IS" BASIS,
|
|
2548
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
2549
|
+
* See the License for the specific language governing permissions and
|
|
2550
|
+
* limitations under the License.
|
|
2551
|
+
*/
|
|
202
2552
|
/**
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
2553
|
+
* @license
|
|
2554
|
+
* Copyright 2017 The Lighthouse Authors. All Rights Reserved.
|
|
2555
|
+
*
|
|
2556
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
2557
|
+
* you may not use this file except in compliance with the License.
|
|
2558
|
+
* You may obtain a copy of the License at
|
|
2559
|
+
*
|
|
2560
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
2561
|
+
*
|
|
2562
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
2563
|
+
* distributed under the License is distributed on an "AS-IS" BASIS,
|
|
2564
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
2565
|
+
* See the License for the specific language governing permissions and
|
|
2566
|
+
* limitations under the License.
|
|
2567
|
+
*
|
|
2568
|
+
* Dummy text for ensuring report robustness: <\/script> pre$`post %%LIGHTHOUSE_JSON%%
|
|
2569
|
+
* (this is handled by terser)
|
|
2570
|
+
*/
|
|
218
2571
|
/**
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
2572
|
+
* @license Copyright 2021 The Lighthouse Authors. All Rights Reserved.
|
|
2573
|
+
* Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
2574
|
+
* Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
|
|
2575
|
+
*/
|
|
223
2576
|
/**
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
class U{constructor(e){this.el=e;const t=document.createElement("style");if(t.textContent="\n #lh-log {\n position: fixed;\n background-color: #323232;\n color: #fff;\n min-height: 48px;\n min-width: 288px;\n padding: 16px 24px;\n box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);\n border-radius: 2px;\n margin: 12px;\n font-size: 14px;\n cursor: default;\n transition: transform 0.3s, opacity 0.3s;\n transform: translateY(100px);\n opacity: 0;\n bottom: 0;\n left: 0;\n z-index: 3;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n }\n \n #lh-log.lh-show {\n opacity: 1;\n transform: translateY(0);\n }\n ",!this.el.parentNode)throw new Error("element needs to be in the DOM");this.el.parentNode.insertBefore(t,this.el),this._id=void 0}log(e,t=!0){this._id&&clearTimeout(this._id),this.el.textContent=e,this.el.classList.add("lh-show"),t&&(this._id=setTimeout((()=>{this.el.classList.remove("lh-show")}),7e3))}warn(e){this.log("Warning: "+e)}error(e){this.log(e),setTimeout((()=>{throw new Error(e)}),0)}hide(){this._id&&clearTimeout(this._id),this.el.classList.remove("lh-show")}}
|
|
2577
|
+
* @license
|
|
2578
|
+
* Copyright 2021 The Lighthouse Authors. All Rights Reserved.
|
|
2579
|
+
*
|
|
2580
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
2581
|
+
* you may not use this file except in compliance with the License.
|
|
2582
|
+
* You may obtain a copy of the License at
|
|
2583
|
+
*
|
|
2584
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
2585
|
+
*
|
|
2586
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
2587
|
+
* distributed under the License is distributed on an "AS-IS" BASIS,
|
|
2588
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
2589
|
+
* See the License for the specific language governing permissions and
|
|
2590
|
+
* limitations under the License.
|
|
2591
|
+
*/
|
|
240
2592
|
/**
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
2593
|
+
* @license Copyright 2017 The Lighthouse Authors. All Rights Reserved.
|
|
2594
|
+
* Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
2595
|
+
* Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
|
|
2596
|
+
*/
|