fixed spinner size and position during loading logs (#15846)

Author: dizel852

airbyte-webapp/src/components/JobItem/JobItem.module.scss

@@ -0,0 +1,10 @@
+@use "../../scss/colors";
+
+.logsLoadingContainer {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: colors.$white;
+  padding: 6px 0;
+  min-height: 58px;
+}

airbyte-webapp/src/components/JobItem/JobItem.tsx

@@ -11,6 +11,7 @@ import ContentWrapper from "./components/ContentWrapper";
 import ErrorDetails from "./components/ErrorDetails";
 import JobLogs from "./components/JobLogs";
 import MainInfo from "./components/MainInfo";
+import styles from "./JobItem.module.scss";
 
 const Item = styled.div<{ isFailed: boolean }>`
   border-bottom: 1px solid ${({ theme }) => theme.greyColor20};
@@ -22,13 +23,6 @@ const Item = styled.div<{ isFailed: boolean }>`
   }
 `;
 
-const LoadLogs = styled.div`
-  background: ${({ theme }) => theme.whiteColor};
-  text-align: center;
-  padding: 6px 0;
-  min-height: 58px;
-`;
-
 interface JobItemProps {
   job: SynchronousJobRead | JobsWithJobs;
 }
@@ -74,9 +68,9 @@ export const JobItem: React.FC<JobItemProps> = ({ job }) => {
         <div>
           <Suspense
             fallback={
-              <LoadLogs>
-                <Spinner />
-              </LoadLogs>
+              <div className={styles.logsLoadingContainer}>
+                <Spinner small />
+              </div>
             }
           >
             {isOpen && (