Fixed color contrast issues on welcome page.

microsoft · Aug 27, 2019 · 600d958 · 600d958
1 parent 3dcbad5
commit 600d958
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 6 deletions.
diff --git a/packages/app/client/src/ui/editor/recentBotsList/recentBotsList.scss b/packages/app/client/src/ui/editor/recentBotsList/recentBotsList.scss
@@ -53,6 +53,10 @@
     background-color: var(--my-bots-entry-bg);
     border: var(--my-bots-entry-border);
 
+    .recent-bot-path {
+      color: var(--my-bots-entry-hover-color);
+    }
+
     .recent-bot-action-bar {
       display: block;
     }
@@ -93,7 +97,7 @@
     width: 0;
 
     &:after {
-      color: var(--tab-icon-color);
+      color: var(--my-bots-entry-color);
       content: "\2716";
       font-size: 12px;
       height: 16px;
@@ -123,7 +127,6 @@
   display: inline-block;
   line-height: 22px;
   margin-left: 8px;
-  opacity: 0.5;
   user-select: text;
 }
 

diff --git a/packages/app/client/src/ui/editor/recentBotsList/recentBotsList.scss.d.ts b/packages/app/client/src/ui/editor/recentBotsList/recentBotsList.scss.d.ts
@@ -2,8 +2,8 @@
 export const marginFix: string;
 export const noBots: string;
 export const recentBot: string;
+export const recentBotPath: string;
 export const recentBotActionBar: string;
 export const recentBotsList: string;
-export const recentBotPath: string;
 export const section: string;
 export const well: string;
diff --git a/packages/app/client/src/ui/styles/themes/dark.css b/packages/app/client/src/ui/styles/themes/dark.css
@@ -183,7 +183,7 @@ html {
 
   /* Welcome page */
   --welcome-page-bg: var(--tab-active-tab-bg);
-  --welcome-page-ver: var(--neutral-8);
+  --welcome-page-ver: var(--neutral-6);
   --welcome-how-to-border: var(--neutral-6);
   --welcome-how-to-test: var(--p-button-bg);
   --welcome-beta-label: var(--warning-outline);

diff --git a/packages/app/client/src/ui/styles/themes/light.css b/packages/app/client/src/ui/styles/themes/light.css
@@ -182,7 +182,7 @@ html {
 
   /* Welcome page */
   --welcome-page-bg: var(--tab-active-tab-bg);
-  --welcome-page-ver: var(--neutral-8);
+  --welcome-page-ver: #717171;
   --welcome-how-to-border: var(--neutral-6);
   --welcome-how-to-test: var(--p-button-bg);
   --welcome-beta-label: var(--warning-outline);
@@ -191,7 +191,8 @@ html {
   --my-bots-entry-bg: var(--neutral-4);
   --my-bots-entry-border: 1px solid transparent;
   --my-bots-entry-color: var(--neutral-12);
-  --my-bots-path-color: var(--neutral-12);
+  --my-bots-path-color: var(--neutral-10);
+  --my-bots-path-hover-color: var(--neutral-11);
   --my-bots-scrollbar-color: rgba(136, 136, 136, 0.5);
 
   /* Status Bar */