From 47b5d1dd9348f2b8d0e22029ac254204c94ef6c7 Mon Sep 17 00:00:00 2001
From: Shahmir Varqha <Sham9871@gmail.com>
Date: Sat, 7 Dec 2024 00:27:14 +0800
Subject: [PATCH] fix: make scratchpad scrollable (#3076)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## 📝 Summary

<!--
Provide a concise summary of what this pull request is addressing.

If this PR fixes any issues, list them here by number (e.g., Fixes
#123).
-->
Fixes #3073 . Each individual part can be scrolled (code editor, output
area, console output) and the whole scratchpad can be scrolled too. I
think it maintains the feel of scratchpad while handling long inputs /
outputs.

I'm not sure if it breaks anything else, so plan to test it locally a
while.

<img width="300" alt="Screenshot 2024-12-06 at 7 26 57 PM"
src="https://github.com/user-attachments/assets/0c777a17-8eca-4070-8ce2-bb5d7bf181ef">

## 🔍 Description of Changes

<!--
Detail the specific changes made in this pull request. Explain the
problem addressed and how it was resolved. If applicable, provide before
and after comparisons, screenshots, or any relevant details to help
reviewers understand the changes easily.
-->

## 📋 Checklist

- [X] I have read the [contributor
guidelines](https://github.com/marimo-team/marimo/blob/main/CONTRIBUTING.md).
- [ ] For large changes, or changes that affect the public API: this
change was discussed or approved through an issue, on
[Discord](https://marimo.io/discord?ref=pr), or the community
[discussions](https://github.com/marimo-team/marimo/discussions) (Please
provide a link if applicable).
- [ ] I have added tests for the changes made.
- [X] I have run the code and verified that it works as expected.

## 📜 Reviewers

<!--
Tag potential reviewers from the community or maintainers who might be
interested in reviewing this pull request.

Your PR will be reviewed more quickly if you can figure out the right
person to tag with @ -->

@akshayka OR @mscolnick
---
 frontend/src/components/scratchpad/scratchpad.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/components/scratchpad/scratchpad.tsx b/frontend/src/components/scratchpad/scratchpad.tsx
index 292e9b0be2c..9d914a91157 100644
--- a/frontend/src/components/scratchpad/scratchpad.tsx
+++ b/frontend/src/components/scratchpad/scratchpad.tsx
@@ -269,7 +269,7 @@ export const ScratchPad: React.FC = () => {
           </Button>
         </Tooltip>
       </div>
-      <div className="flex-1 divide-y relative">
+      <div className="flex-1 divide-y relative overflow-hidden flex flex-col">
         {renderBody()}
         {renderHistory()}
       </div>