fixup! fix(docs-infra): improve focus styles in topnav and footer

gkalpak · gkalpak · commit a088d0089dcb · 2020-02-19T19:33:06.000+02:00
diff --git a/aio/src/styles/1-layouts/_footer.scss b/aio/src/styles/1-layouts/_footer.scss
@@ -36,10 +36,9 @@ footer {
     }
 
     &:focus {
-      outline-color: rgba($white, 0.8);
-      outline-offset: 2px;
       // `outline-offset` is not applied on Chrome on Windows, if `outline-style` is `auto.
-      outline-style: solid;
+      outline: 1px solid rgba($white, 0.8);
+      outline-offset: 2px;
     }
   }
 
diff --git a/aio/src/styles/1-layouts/_top-menu.scss b/aio/src/styles/1-layouts/_top-menu.scss
@@ -99,10 +99,9 @@ aio-shell.folder-tutorial mat-toolbar.mat-toolbar {
   padding: 8px 0;
 
   &:focus {
-    outline-color: $focus-outline-ondark;
-    outline-offset: 4px;
     // `outline-offset` is not applied on Chrome on Windows, if `outline-style` is `auto.
-    outline-style: solid;
+    outline: 1px solid $focus-outline-ondark;
+    outline-offset: 4px;
   }
 
   @media screen and (max-width: 991px) {
@@ -245,10 +244,9 @@ aio-search-box.search-container {
       margin: 0 -16px;
 
       &:focus {
-        outline-color: $focus-outline-ondark;
-        outline-offset: -16px;
         // `outline-offset` is not applied on Chrome on Windows, if `outline-style` is `auto.
-        outline-style: solid;
+        outline: 1px solid $focus-outline-ondark;
+        outline-offset: -16px;
       }
 
       @media screen and (max-width: 480px) {

Original file line number	Diff line number	Diff line change
`@@ -36,10 +36,9 @@ footer {`
`36`	`36`	`}`
`37`	`37`
`38`	`38`	`&:focus {`
`39`		`- outline-color: rgba($white, 0.8);`
`40`		`- outline-offset: 2px;`
`41`	`39`	// `outline-offset` is not applied on Chrome on Windows, if `outline-style` is `auto.
`42`		`- outline-style: solid;`
	`40`	`+ outline: 1px solid rgba($white, 0.8);`
	`41`	`+ outline-offset: 2px;`
`43`	`42`	`}`
`44`	`43`	`}`
`45`	`44`