3 files changed, 14 insertions, 0 deletions

diff --git a/packages/theme/src/themes/dark/index.ts b/packages/theme/src/themes/dark/index.ts
index bd9f001e8..cb1b33f2d 100644
--- a/packages/theme/src/themes/dark/index.ts
+++ b/packages/theme/src/themes/dark/index.ts
@@ -118,3 +118,13 @@ export const announcements = merge({}, defaultStyles.announcements, {
     background: legacyStyles.darkThemeGrayDark,
   },
 });
+
+// Todos
+export const todos = merge({}, defaultStyles.todos, {
+  todosLayer: {
+    borderLeftColor: legacyStyles.darkThemeGrayDarker,
+  },
+  dragIndicator: {
+    background: legacyStyles.themeGrayLight,
+  },
+});
diff --git a/packages/theme/src/themes/default/index.ts b/packages/theme/src/themes/default/index.ts
index 4a49a4de0..d524b8ea7 100644
--- a/packages/theme/src/themes/default/index.ts
+++ b/packages/theme/src/themes/default/index.ts
@@ -210,6 +210,9 @@ export const announcements = {
 
 // Todos
 export const todos = {
+  todosLayer: {
+    borderLeftColor: legacyStyles.themeGrayDark,
+  },
   dragIndicator: {
     background: legacyStyles.themeGrayLight,
   },
diff --git a/src/features/todos/components/TodosWebview.js b/src/features/todos/components/TodosWebview.js
index 1657bebd8..bc32ae728 100644
--- a/src/features/todos/components/TodosWebview.js
+++ b/src/features/todos/components/TodosWebview.js
@@ -9,6 +9,7 @@ const styles = theme => ({
   root: {
     background: theme.colorBackground,
     position: 'relative',
+    borderLeft: [1, 'solid', theme.todos.todosLayer.borderLeftColor],
   },
   webview: {
     height: '100%',