Merge 9f87cd0 into 7997c47

microsoft · Aug 27, 2019 · 587f0e9 · 587f0e9
2 parents 7997c47 + 9f87cd0
commit 587f0e9
Show file tree

Hide file tree

Showing 6 changed files with 20 additions and 7 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -21,6 +21,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
   - [1780](https://github.com/microsoft/BotFramework-Emulator/pull/1780)
   - [1781](https://github.com/microsoft/BotFramework-Emulator/pull/1781)
   - [1782](https://github.com/microsoft/BotFramework-Emulator/pull/1782)
+  - [1783](https://github.com/microsoft/BotFramework-Emulator/pull/1783)
 
 ## v4.5.2 - 2019 - 07 - 17
 ## Fixed

diff --git a/packages/app/client/src/ui/editor/welcomePage/welcomePage.scss b/packages/app/client/src/ui/editor/welcomePage/welcomePage.scss
@@ -69,11 +69,6 @@
   font-size: 13px;
   white-space: normal;
 
-  &:focus {
-    outline: var(--p-button-border-focus);
-
-  }
-
   &:hover {
     text-decoration: underline;
   }

diff --git a/packages/app/client/src/ui/styles/globals.scss b/packages/app/client/src/ui/styles/globals.scss
@@ -75,7 +75,9 @@
   }
 
   *:focus {
-    outline: var(--p-button-border-focus);
+    outline-width: var(--global-focus-outline-width);
+    outline-style: var(--global-focus-outline-style);
+    outline-color: var(--global-focus-outline-color);
   }
 
   ::-webkit-scrollbar {

diff --git a/packages/app/client/src/ui/styles/themes/dark.css b/packages/app/client/src/ui/styles/themes/dark.css
@@ -1,4 +1,9 @@
 html {
+  /* Globals */
+  --global-focus-outline-width: 1px;
+  --global-focus-outline-style: solid;
+  --global-focus-outline-color: #75BEFF;
+
   /* Highlight colors */
   --list-item-color: var(--neutral-3);
   --list-item-selected-color: var(--neutral-2);

diff --git a/packages/app/client/src/ui/styles/themes/high-contrast.css b/packages/app/client/src/ui/styles/themes/high-contrast.css
@@ -1,4 +1,9 @@
 html {
+  /* Globals */
+  --global-focus-outline-width: 1px;
+  --global-focus-outline-style: solid;
+  --global-focus-outline-color: #F38518;
+
   /* Highlight colors */
   --list-item-color: var(--neutral-1);
   --list-item-selected-color: var(--neutral-2);
@@ -105,7 +110,7 @@ html {
   --p-button-color: var(--neutral-2);
   --p-button-border: 1px solid #72C3DF;
   --p-button-border-focus: 1px solid #F38518;
-  --p-button-border-hover: 1px solid #72C3DF;
+  --p-button-border-hover: 1px solid rgb(2, 2, 2);
   --p-button-border-active: var(--p-button-border);
   --p-button-border-disabled: var(--p-button-border);
   --p-button-opacity-disabled: .4;

diff --git a/packages/app/client/src/ui/styles/themes/light.css b/packages/app/client/src/ui/styles/themes/light.css
@@ -1,4 +1,9 @@
 html {
+  /* Globals */
+  --global-focus-outline-width: 1px;
+  --global-focus-outline-style: solid;
+  --global-focus-outline-color: #1177BB;
+
   /* Highlight colors */
   --list-item-color: var(--neutral-9);
   --list-item-selected-color: var(--neutral-2);