From d4edc2cf1d97b4613fb2d851ad2c1c3a80ac0f18 Mon Sep 17 00:00:00 2001
From: Tony Anziano <toanzian@microsoft.com>
Date: Thu, 18 Apr 2019 16:01:50 -0700
Subject: [PATCH] Fixed invisible scrollbar styling in log panel.

---
 CHANGELOG.md                                               | 1 +
 .../app/client/src/ui/editor/emulator/parts/log/log.scss   | 7 ++++++-
 packages/app/client/src/ui/styles/themes/dark.css          | 2 +-
 packages/app/client/src/ui/styles/themes/high-contrast.css | 2 +-
 packages/app/client/src/ui/styles/themes/light.css         | 4 +---
 5 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 567a038bb..6a3236d68 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,6 +15,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - [client] Fixed issue where BOM wasn't being stripped from transcripts opened via the File menu in PR [1425](https://github.com/Microsoft/BotFramework-Emulator/pull/1425)
 - [client] Fixed issue where tab icon glyphs weren't working on Mac in PR [1428](https://github.com/Microsoft/BotFramework-Emulator/pull/1428)
 - [client] Fixed issue where cancelling out of opening a transcript was creating a broken livechat window in PR [1441](https://github.com/Microsoft/BotFramework-Emulator/pull/1441)
+- [client] Fixed invisible scrollbar styling in log panel in PR [1442](https://github.com/Microsoft/BotFramework-Emulator/pull/1442)
 
 ## Removed
 - [main] Removed custom user agent string from outgoing requests in PR [1427](https://github.com/Microsoft/BotFramework-Emulator/pull/1427)
diff --git a/packages/app/client/src/ui/editor/emulator/parts/log/log.scss b/packages/app/client/src/ui/editor/emulator/parts/log/log.scss
index 5e5b34f7f..e0ea73e14 100644
--- a/packages/app/client/src/ui/editor/emulator/parts/log/log.scss
+++ b/packages/app/client/src/ui/editor/emulator/parts/log/log.scss
@@ -1,6 +1,7 @@
 .log {
   height: 100%;
-  overflow: auto;
+  overflow-y: auto;
+  overflow-x: hidden;
   user-select: text;
   padding: 0;
   box-sizing: border-box;
@@ -69,4 +70,8 @@
       margin-left: 0;
     }
   }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: var(--scrollbar-color);
+  }
 }
diff --git a/packages/app/client/src/ui/styles/themes/dark.css b/packages/app/client/src/ui/styles/themes/dark.css
index 66759a57a..74b16d620 100644
--- a/packages/app/client/src/ui/styles/themes/dark.css
+++ b/packages/app/client/src/ui/styles/themes/dark.css
@@ -33,7 +33,7 @@ html {
   --webchat-selected-actvity-border: #0E369C;
   --webchat-selected-activity-text: var(--neutral-1);
   --webchat-timestamp-text: var(--neutral-6);
-  --webchat-scrollbar-color: var(--neutral-13);
+  --webchat-scrollbar-color: var(--scrollbar-color);
 
   /* sendbox */
   --webchat-sendbox-bg: var(--neutral-14);
diff --git a/packages/app/client/src/ui/styles/themes/high-contrast.css b/packages/app/client/src/ui/styles/themes/high-contrast.css
index 326a61202..0212cc66a 100644
--- a/packages/app/client/src/ui/styles/themes/high-contrast.css
+++ b/packages/app/client/src/ui/styles/themes/high-contrast.css
@@ -33,7 +33,7 @@ html {
   --webchat-selected-actvity-border: #F38518;
   --webchat-selected-activity-text: var(--neutral-1);
   --webchat-timestamp-text: var(--neutral-1);
-  --webchat-scrollbar-color: var(--neutral-6);
+  --webchat-scrollbar-color: var(--scrollbar-color);
 
   /* sendbox */
   --webchat-sendbox-bg: var(--tab-active-tab-bg);
diff --git a/packages/app/client/src/ui/styles/themes/light.css b/packages/app/client/src/ui/styles/themes/light.css
index 646affab5..183d6a50a 100644
--- a/packages/app/client/src/ui/styles/themes/light.css
+++ b/packages/app/client/src/ui/styles/themes/light.css
@@ -13,10 +13,8 @@ html {
   /* Alert colors */
   --info-bg: #D6ECF2;
   --info-outline: #007ACC;
-
   --warning-bg: #F6F5D2;
   --warning-outline: #B89500;
-
   --error-text: #A1260D;
   --error-bg: #F2DEDE;
   --error-outline: #BE1100;
@@ -33,7 +31,7 @@ html {
   --webchat-selected-actvity-border: #00BCF2;
   --webchat-selected-activity-text: var(--neutral-1);
   --webchat-timestamp-text: var(--neutral-6);
-  --webchat-scrollbar-color: var(--neutral-5);
+  --webchat-scrollbar-color: var(--scrollbar-color);
 
   /* sendbox */
   --webchat-sendbox-bg: var(--neutral-1);