diff --git a/lighthouse-core/report/html/templates.html b/lighthouse-core/report/html/templates.html index ffa2f896fd4c..2e6d9cc3238c 100644 --- a/lighthouse-core/report/html/templates.html +++ b/lighthouse-core/report/html/templates.html @@ -262,6 +262,14 @@ height: var(--lh-tools-icon-size); cursor: pointer; margin-right: 5px; + /* This is actually a button element, but we want to style it like a transparent div. */ + display: flex; + background: none; + color: inherit; + border: none; + padding: 0; + font: inherit; + outline: inherit; } /* Some features in the tools dropdown menu don't work in the DevTools @@ -278,13 +286,10 @@ .dark .lh-tools__button svg { filter: invert(1); } - .lh-tools__button:focus, - .lh-tools__button.active { - outline: none; - } .lh-tools__button.active + .lh-tools__dropdown { opacity: 1; clip: rect(-1px, 187px, 242px, -3px); + visibility: visible; } .lh-tools__dropdown { position: absolute; @@ -298,6 +303,7 @@ box-shadow: 1px 1px 3px #ccc; min-width: 125px; clip: rect(0, 164px, 0, 0); + visibility: hidden; opacity: 0; transition: all 200ms cubic-bezier(0,0,0.2,1); } @@ -366,12 +372,12 @@
+