fix(replay): Remove extra space below replay viewer and chapters components (#34421)

static/app/views/replays/details.tsx

@@ -16,7 +16,6 @@ import ReplayPlayer from 'sentry/components/replays/replayPlayer';
 import useFullscreen from 'sentry/components/replays/useFullscreen';
 import {t} from 'sentry/locale';
 import {PageContent} from 'sentry/styles/organization';
-import space from 'sentry/styles/space';
 import useReplayData from 'sentry/utils/replays/useReplayData';
 import {useRouteContext} from 'sentry/utils/useRouteContext';
 
@@ -90,7 +89,7 @@ function ReplayDetails() {
       >
         <Layout.Body>
           <ReplayLayout ref={fullscreenRef}>
-            <Panel>
+            <PanelNoMargin>
               <PanelHeader>
                 <ReplayCurrentUrl />
               </PanelHeader>
@@ -105,14 +104,14 @@ function ReplayDetails() {
               <PanelBody withPadding>
                 <ReplayController toggleFullscreen={toggleFullscreen} />
               </PanelBody>
-            </Panel>
+            </PanelNoMargin>
           </ReplayLayout>
-          <Side>
+          <Layout.Side>
             <UserActionsNavigator
               crumbs={replay.getRawCrumbs()}
               event={replay.getEvent()}
             />
-          </Side>
+          </Layout.Side>
           <Layout.Main fullWidth>
             <Panel>
               <ReplayTimeline />
@@ -125,6 +124,10 @@ function ReplayDetails() {
   );
 }
 
+const PanelNoMargin = styled(Panel)`
+  margin-bottom: 0;
+`;
+
 const PanelHeader = styled(_PanelHeader)`
   display: block;
   padding: 0;
@@ -152,8 +155,4 @@ const ReplayLayout = styled(Layout.Main)`
   }
 `;
 
-const Side = styled(Layout.Side)`
-  padding-bottom: ${space(2)};
-`;
-
 export default ReplayDetails;