report: redefine gauge percentage positioning (#15486)

GoogleChrome · Sep 20, 2023 · 1602beb · 1602beb
1 parent 6e73dae
commit 1602beb
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 8 deletions.
diff --git a/report/assets/styles.css b/report/assets/styles.css
@@ -1335,12 +1335,12 @@
 .lh-gauge__percentage {
   width: 100%;
   height: var(--gauge-circle-size);
+  line-height: var(--gauge-circle-size);
   position: absolute;
   font-family: var(--report-font-family-monospace);
   font-size: calc(var(--gauge-circle-size) * 0.34 + 1.3px);
-  line-height: 0;
   text-align: center;
-  top: calc(var(--score-container-padding) + var(--gauge-circle-size) / 2);
+  top: var(--score-container-padding);
 }
 
 .lh-category .lh-gauge__percentage {

diff --git a/report/assets/templates.html b/report/assets/templates.html
@@ -194,10 +194,6 @@
       left: 0px;
       right: 0px;
     }
-
-    .lh-gauge__wrapper:first-of-type {
-      contain: none;
-    }
   </style>
   <div class="lh-scores-wrapper">
     <div class="lh-scores-container">

diff --git a/report/renderer/components.js b/report/renderer/components.js