chore: terminal css fixes

Author: shivani170

src/components/ClusterNodes/ClusterTerminal.tsx

@@ -759,7 +759,7 @@ node-details-full-screen
         ]
 
         return (
-            <div className="mr-16">
+            <div>
                 <TabGroup tabs={tabs} size={ComponentSizeType.medium} />
             </div>
         )

src/components/v2/appDetails/k8Resource/nodeDetail/NodeDetailTabs/terminal/TerminalWrapper.component.tsx

@@ -32,7 +32,7 @@ export default function TerminalWrapper({
 }: TerminalWrapperProps) {
     const firstStrip = () => {
         return (
-            <div className="flex left w-100">
+            <div className="flex left w-100 dc__gap-10">
                 {selectionListData.firstRow.map((ele) => {
                     return terminalStripTypeData(ele)
                 })}
@@ -77,7 +77,7 @@ export default function TerminalWrapper({
         <div className={className} data-testid={dataTestId}>
             <div className="flex bcn-0 pl-20 h-32 terminal-action-strip dc__zi-11">{firstStrip()}</div>
             {selectionListData.secondRow && (
-                <div className="flex left bcn-0 pl-20 dc__border-top terminal-action-strip">{secondStrip()}</div>
+                <div className="flex left bcn-0 pl-20 dc__border-top terminal-action-strip dc__gap-12">{secondStrip()}</div>
             )}
             {typeof selectionListData.tabSwitcher.terminalTabWrapper === 'function'
                 ? selectionListData.tabSwitcher.terminalTabWrapper(renderTerminalView())

src/components/v2/appDetails/k8Resource/nodeDetail/NodeDetailTabs/terminal/terminal.utils.tsx

@@ -60,7 +60,7 @@ const creatableSelectWrapper = (selectData: SelectWrapperType) => {
                     iconClassName="icon-dim-16 fcn-6"
                 />
             )}
-            <div className="cn-6 ml-8 mr-4">{selectData.title}</div>
+            <div className="cn-6">{selectData.title}</div>
             <div>
                 <CreatableSelect
                     placeholder={selectData.placeholder}
@@ -126,15 +126,15 @@ const connectionButton = (connectData: ConnectionButtonType) => {
             content={connectData.connectTerminal ? 'Disconnect and terminate pod' : 'Connect to terminal'}
         >
             {connectData.connectTerminal ? (
-                <span className="flex mr-8">
+                <span className="flex">
                     <Disconnect
                         className="icon-dim-16 mr-4 cursor"
                         data-testid="node-details-terminal-disconnect"
                         onClick={connectData.closeTerminalModal}
                     />
                 </span>
             ) : (
-                <span className="flex mr-8">
+                <span className="flex">
                     <Connect
                         className="icon-dim-16 mr-4 cursor"
                         data-testid="node-details-terminal-connect"
@@ -195,19 +195,19 @@ const connectionSwitch = (switchProps: ConnectionSwitchType) => {
     }
     return (
         <>
-            <span className="bcn-2 mr-8 h-32" style={{ width: '1px' }} />
+            <span className="bcn-2 h-32" style={{ width: '1px' }} />
             <Tippy
                 className="default-tt cursor"
                 arrow={false}
                 placement="bottom"
                 content={switchProps.toggleButton ? 'Disconnect from pod' : 'Reconnect to pod'}
             >
                 {switchProps.toggleButton ? (
-                    <span className="mr-8 flex" data-testid="disconnect-button">
+                    <span className="flex" data-testid="disconnect-button">
                         <Stop className="icon-dim-16 fcr-5 mr-4 cursor" onClick={switchProps.stopTerminalConnection} />
                     </span>
                 ) : (
-                    <span className="mr-8 flex" data-testid="play-button">
+                    <span className="flex" data-testid="play-button">
                         <Play className="icon-dim-16 fcg-5 mr-4 cursor" onClick={switchProps.resumePodConnection} />
                     </span>
                 )}
@@ -222,7 +222,7 @@ const clearTerminal = (clearProps: ClearTerminalType) => {
     }
     return (
         <Tippy className="default-tt" arrow={false} placement="bottom" content="Clear">
-            <div className="flex mr-8" data-testid={clearProps.dataTestId}>
+            <div className="flex" data-testid={clearProps.dataTestId}>
                 <Abort className="icon-dim-16 mr-4 fcn-6 cursor" onClick={clearProps.setTerminalCleared} />
             </div>
         </Tippy>
@@ -235,7 +235,7 @@ const debugModeToggleButton = (selectData: DebugModeType) => {
     }
     return (
         <>
-            <span className="bcn-2 mr-8 h-32" style={{ width: '1px' }} />
+            <span className="bcn-2 h-32" style={{ width: '1px' }} />
             {selectData.showInfoTippy && (
                 <InfoIconTippy
                     heading="Debug mode"
@@ -247,7 +247,7 @@ const debugModeToggleButton = (selectData: DebugModeType) => {
                 />
             )}
             <span>Debug Mode</span>
-            <span className="toggle-icon-dim ml-8">
+            <span className="toggle-icon-dim">
                 <Toggle onSelect={selectData.onToggle} dataTestId="toggle-debug-mode" selected={selectData.isEnabled} />
             </span>
         </>
@@ -314,7 +314,7 @@ const manifestEditButtons = ({
 
     return (
         <>
-            <span className="bcn-2 mr-8 h-32" style={{ width: '1px' }} />
+            <span className="bcn-2 h-32" style={{ width: '1px' }} />
             {renderButtons()}
             {buttonSelectionState !== EditModeType.NON_EDIT && (
                 <span