fix overflowing gutter and dark mode base color (#4051)

CHANGELOG.md

@@ -1,5 +1,9 @@
 # Upcoming Release
 
+## Bug Fixes
+
+- Code component visual updates by [@pngwn](https://github.com/pngwn) in [PR 4051](https://github.com/gradio-app/gradio/pull/4051)
+
 ## New Features:
 
 - Min and max value for gr.Number by [@artegoser](https://github.com/artegoser) and [@dawoodkhan82] (https://github.com/dawoodkhan82) in [PR 3991](https://github.com/gradio-app/gradio/pull/3991)
@@ -9,7 +13,7 @@
 
 - Fixes issue with `matplotlib` not rendering correctly if the backend was not set to `Agg` by [@abidlabs](https://github.com/abidlabs) in [PR 4029](https://github.com/gradio-app/gradio/pull/4029)
 - Fixes bug where rendering the same `gr.State` across different Interfaces/Blocks within
-a larger Blocks would not work by [@abidlabs](https://github.com/abidlabs) in [PR 4030](https://github.com/gradio-app/gradio/pull/4030)
+  a larger Blocks would not work by [@abidlabs](https://github.com/abidlabs) in [PR 4030](https://github.com/gradio-app/gradio/pull/4030)
 
 ## Documentation Changes:
 
@@ -31,7 +35,6 @@ No changes to highlight.
 
 No changes to highlight.
 
-
 # 3.28.1
 
 ## New Features:
@@ -104,8 +107,7 @@ No changes to highlight.
 - Add DESCRIPTION.md to image_segmentation demo by [@aliabd](https://github.com/aliabd) in [PR 3866](https://github.com/gradio-app/gradio/pull/3866)
 - Fix error in running `gr.themes.builder()` by [@deepkyu](https://github.com/deepkyu) in [PR 3869](https://github.com/gradio-app/gradio/pull/3869)
 - Fixed a JavaScript TypeError when loading custom JS with `_js` and setting `outputs` to `None` in `gradio.Blocks()` by [@DavG25](https://github.com/DavG25) in [PR 3883](https://github.com/gradio-app/gradio/pull/3883)
-- Fixed bg_background_fill theme property to expand to whole background, block_radius to affect form elements as well, and added block_label_shadow theme property  by [@aliabid94](https://github.com/aliabid94) in [PR 3590](https://github.com/gradio-app/gradio/pull/3590)
-
+- Fixed bg_background_fill theme property to expand to whole background, block_radius to affect form elements as well, and added block_label_shadow theme property by [@aliabid94](https://github.com/aliabid94) in [PR 3590](https://github.com/gradio-app/gradio/pull/3590)
 
 ## Contributors Shoutout:
 

js/code/interactive/Code.svelte

@@ -132,7 +132,7 @@
 		".cm-content": {
 			paddingTop: "5px",
 			paddingBottom: "5px",
-
+			color: "var(--body-text-color)",
 			fontFamily: "var(--font-mono)",
 			minHeight: "100%"
 		},
@@ -144,6 +144,12 @@
 		},
 		".cm-focused": {
 			outline: "none"
+		},
+		".cm-scroller": {
+			height: "auto"
+		},
+		".cm-cursor": {
+			borderLeftColor: "var(--body-text-color)"
 		}
 	});