Merge pull request #5070 from ethereum/fix-debugger-bottom

Fix issue with bottom of Debugger

libs/remix-ui/debugger-ui/src/lib/debugger-ui.css

@@ -20,7 +20,8 @@
 .debuggerPanels {
   overflow-y: auto;
   height: fit-content;
+
 }
 .jumpToFunctionClick span {
   cursor: pointer;
-}
+}

libs/remix-ui/debugger-ui/src/lib/debugger-ui.tsx

@@ -400,7 +400,7 @@ export const DebuggerUI = (props: DebuggerUIProps) => {
   return (
     <div>
       <Toaster message={state.toastMessage} />
-      <div className="px-2" ref={debuggerTopRef}>
+      <div className="px-2 pb-3" ref={debuggerTopRef}>
         <div>
           <div className="mt-2 mb-2 debuggerConfig custom-control custom-checkbox">
             <CustomTooltip tooltipId="debuggerGenSourceCheckbox" tooltipText={<FormattedMessage id="debugger.debugWithGeneratedSources" />} placement="bottom-start">
@@ -471,6 +471,7 @@ export const DebuggerUI = (props: DebuggerUIProps) => {
             currentTransaction={state.currentTransaction}
           />
         )}
+        <div id="bottomSpacer" className="p-1 mt-3"></div>
       </div>
     </div>
   )