remove icons and legend (#171)

GoogleChrome · Feb 22, 2024 · 0a18214 · 0a18214
1 parent 93a24b6
commit 0a18214
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 102 deletions.
diff --git a/src/browser_action/core.css b/src/browser_action/core.css
@@ -143,47 +143,6 @@
   white-space: nowrap;
 }
 
-.web-vitals-chrome-extension-popup .core-web-vital-icon,
-.web-vitals-chrome-extension-popup .pending-core-web-vital-icon,
-.web-vitals-chrome-extension-popup .experimental-icon {
-  display: none;
-  vertical-align: middle;
-  margin-inline-start: 0.5rem;
-  fill: #06f;
-}
-
-.web-vitals-chrome-extension-popup .pending-core-web-vital-icon {
-  fill: gray;
-}
-
-.web-vitals-chrome-extension-popup #legend .core-web-vital-icon,
-.web-vitals-chrome-extension-popup #legend .pending-core-web-vital-icon,
-.web-vitals-chrome-extension-popup #legend .experimental-icon {
-  display: inline-block;
-  margin-inline-start: 0;
-  margin-inline-end: 0.5rem;
-}
-
-.web-vitals-chrome-extension-popup .core-web-vital-metric .core-web-vital-icon {
-  display: inline-block;
-}
-
-.web-vitals-chrome-extension-popup .pending-core-web-vital-metric .pending-core-web-vital-icon {
-  display: inline-block;
-}
-
-.web-vitals-chrome-extension-popup .experimental-metric .experimental-icon {
-  display: inline-block;
-}
-
-
-.web-vitals-chrome-extension-popup #legend {
-  display: flex;
-  justify-content: space-between;
-  border: 1px solid var(--color-dark-grey);
-  padding: 0.5rem;
-}
-
 .web-vitals-chrome-extension-popup .metric-performance {
   position: relative;
 }

diff --git a/src/browser_action/metric.js b/src/browser_action/metric.js
@@ -1,6 +1,6 @@
 export class Metric {
 
-  constructor({id, name, local, background, thresholds, experimental, coreWebVital, pendingCoreWebVital}) {
+  constructor({id, name, local, background, thresholds}) {
     this.id = id;
     this.abbr = id.toUpperCase();
     this.name = name;
@@ -10,9 +10,6 @@ export class Metric {
     this.digitsOfPrecision = 3;
     // This will be replaced with field data, if available.
     this.distribution = [1/3, 1/3, 1/3];
-    this.experimental = experimental || false;
-    this.coreWebVital = coreWebVital || false;
-    this.pendingCoreWebVital = pendingCoreWebVital || false;
   }
 
   formatValue(value) {
@@ -169,8 +166,7 @@ export class LCP extends Metric {
       name: 'Largest Contentful Paint',
       local,
       background,
-      thresholds,
-      coreWebVital: true
+      thresholds
     });
   }
 
@@ -209,8 +205,7 @@ export class FID extends Metric {
       name: 'First Input Delay',
       local,
       background,
-      thresholds,
-      coreWebVital: true
+      thresholds
     });
   }
 
@@ -248,8 +243,7 @@ export class INP extends Metric {
       name: 'Interaction to Next Paint',
       local,
       background,
-      thresholds,
-      pendingCoreWebVital: true
+      thresholds
     });
   }
 
@@ -290,8 +284,7 @@ export class CLS extends Metric {
       name: 'Cumulative Layout Shift',
       local,
       background,
-      thresholds,
-      coreWebVital: true
+      thresholds
     });
   }
 
@@ -359,8 +352,7 @@ export class TTFB extends Metric {
       name: 'Time to First Byte',
       local,
       background,
-      thresholds,
-      experimental: true
+      thresholds
     });
   }
 

diff --git a/src/browser_action/popup.html b/src/browser_action/popup.html
@@ -18,22 +18,6 @@ <h1>Metrics</h1>
           <div class="metric">
             <div class="metric-info">
               <div class="metric-name">Metric Name</div>
-
-              <svg class="experimental-icon" width="14" height="12" fill="none" xmlns="http://www.w3.org/2000/svg">
-                <title>Experimental metric</title>
-                <path d="M2.333 12c-.566 0-.969-.253-1.208-.758-.239-.506-.18-.975.175-1.409l3.7-4.5v-4h-.667a.646.646 0 0 1-.475-.192.645.645 0 0 1-.191-.474c0-.19.063-.348.191-.476A.647.647 0 0 1 4.333 0h5.334c.189 0 .347.064.474.191a.646.646 0 0 1 .192.476.643.643 0 0 1-.192.474.643.643 0 0 1-.474.192H9v4l3.7 4.5c.356.434.414.903.175 1.409-.239.505-.642.758-1.208.758H2.333Zm0-1.333h9.334l-4-4.867V1.333H6.333V5.8l-4 4.867Z"/>
-              </svg>
-
-              <svg class="core-web-vital-icon" width="14" height="14" viewBox="0 0 96 96" fill="none" xmlns="http://www.w3.org/2000/svg">
-                <title>Core Web Vital metric</title>
-                <circle cx="48" cy="48" r="48"/>
-              </svg>
-
-              <svg class="pending-core-web-vital-icon" width="14" height="14" viewBox="0 0 96 96" fill="none" xmlns="http://www.w3.org/2000/svg">
-                <title>Pending Core Web Vital metric</title>
-                <circle cx="48" cy="48" r="48"/>
-              </svg>
-
             </div>
 
             <div class="metric-performance metadata">
@@ -63,34 +47,6 @@ <h1>Metrics</h1>
 
     <footer class="metadata">
 
-      <div id="legend">
-
-        <span>
-          <svg class="core-web-vital-icon" width="14" height="14" viewBox="0 0 96 96" fill="none" xmlns="http://www.w3.org/2000/svg">
-            <title>Core Web Vital metric</title>
-            <circle cx="48" cy="48" r="48"/>
-          </svg>
-          Core Web Vital metric
-        </span>
-
-        <span>
-          <svg class="pending-core-web-vital-icon" width="14" height="14" viewBox="0 0 96 96" fill="none" xmlns="http://www.w3.org/2000/svg">
-            <title>Pending Core Web Vital metric</title>
-            <circle cx="48" cy="48" r="48"/>
-          </svg>
-          Pending Core Web Vital metric
-        </span>
-
-        <span>
-          <svg class="experimental-icon" width="14" height="12" fill="none" xmlns="http://www.w3.org/2000/svg">
-            <title>Experimental metric</title>
-            <path d="M2.333 12c-.566 0-.969-.253-1.208-.758-.239-.506-.18-.975.175-1.409l3.7-4.5v-4h-.667a.646.646 0 0 1-.475-.192.645.645 0 0 1-.191-.474c0-.19.063-.348.191-.476A.647.647 0 0 1 4.333 0h5.334c.189 0 .347.064.474.191a.646.646 0 0 1 .192.476.643.643 0 0 1-.192.474.643.643 0 0 1-.474.192H9v4l3.7 4.5c.356.434.414.903.175 1.409-.239.505-.642.758-1.208.758H2.333Zm0-1.333h9.334l-4-4.867V1.333H6.333V5.8l-4 4.867Z"/>
-          </svg>
-          Experimental metric
-        </span>
-
-      </div>
-
       <div id="device-page-wrapper">
         <span class="device-icon">
           <svg id="device-icon-desktop" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" aria-label="Desktop field data">

diff --git a/src/browser_action/popup.js b/src/browser_action/popup.js
@@ -157,9 +157,6 @@ class Popup {
     local.style.marginLeft = metric.getRelativePosition(metric.local);
     localValue.innerText = metric.formatValue(metric.local);
     metricElement.classList.toggle(assessment, !!assessment);
-    metricElement.classList.toggle('experimental-metric', metric.experimental);
-    metricElement.classList.toggle('core-web-vital-metric', metric.coreWebVital);
-    metricElement.classList.toggle('pending-core-web-vital-metric', metric.pendingCoreWebVital);
     infoElement.title = info;
     infoElement.classList.toggle('hidden', info == '');