Refactor code style for consistency and readability

- Updated import statements to use double quotes instead of single quotes across multiple files.
- Reformatted JSX return statements for better alignment and readability.
- Added missing newlines at the end of files where necessary.
- Adjusted component structure for improved clarity in the Landing, Blog, BestPractices, and Projects pages.
- Enhanced error boundary component for better error handling.
- Updated theme overrides for Material-UI components to maintain consistent styling.

src/layouts/common/backToTop/BackToTop.jsx

@@ -1,60 +1,61 @@
-import React from 'react';
+import React from "react";
 
-import { Grid, Grow, useScrollTrigger } from '@mui/material';
-import KeyboardArrowUpIcon from '@mui/icons-material/KeyboardArrowUp';
-import { useTheme } from '@mui/material/styles';
+import { Grid, Grow, useScrollTrigger } from "@mui/material";
+import KeyboardArrowUpIcon from "@mui/icons-material/KeyboardArrowUp";
+import { useTheme } from "@mui/material/styles";
 
 function ScrollTop(props) {
-	const { children, window } = props;
+  const { children, window } = props;
 
-	// Note that you normally won't need to set the window ref as useScrollTrigger
-	// will default to window.
-	// This is only being set here because the demo is in an iframe.
-	const trigger = useScrollTrigger({
-		target: window ? window() : undefined,
-		disableHysteresis: true,
-		threshold: 100,
-	});
+  // Note that you normally won't need to set the window ref as useScrollTrigger
+  // will default to window.
+  // This is only being set here because the demo is in an iframe.
+  const trigger = useScrollTrigger({
+    target: window ? window() : undefined,
+    disableHysteresis: true,
+    threshold: 100,
+  });
 
-	const handleClick = (event) => {
-		const anchor = (event.target.ownerDocument || document).querySelector(
-			'#back-to-top-anchor'
-		);
+  const handleClick = (event) => {
+    const anchor = (event.target.ownerDocument || document).querySelector(
+      "#back-to-top-anchor",
+    );
 
-		if (anchor) {
-			anchor.scrollIntoView({ behavior: 'smooth', block: 'center' });
-		}
-	};
+    if (anchor) {
+      anchor.scrollIntoView({ behavior: "smooth", block: "center" });
+    }
+  };
 
-	return (
-		<Grow in={trigger}>
-			<div onClick={handleClick} role='presentation'>
-				{children}
-			</div>
-		</Grow>
-	);
+  return (
+    <Grow in={trigger}>
+      <div onClick={handleClick} role="presentation">
+        {children}
+      </div>
+    </Grow>
+  );
 }
 
 const BackToTop = (props) => {
-	const theme = useTheme();
-	return (
-		<Grid
-			sx={{
-				position: 'fixed',
-				bottom: theme.spacing(2),
-				left: theme.spacing(1),
-			}}
-			id='footer'>
-			<ScrollTop {...props}>
-				<KeyboardArrowUpIcon
-					sx={{
-						width: '5rem',
-						height: '5rem',
-						[theme.breakpoints.down('md')]: { width: '3rem', height: '3rem' },
-					}}
-				/>
-			</ScrollTop>
-		</Grid>
-	);
+  const theme = useTheme();
+  return (
+    <Grid
+      sx={{
+        position: "fixed",
+        bottom: theme.spacing(2),
+        left: theme.spacing(1),
+      }}
+      id="footer"
+    >
+      <ScrollTop {...props}>
+        <KeyboardArrowUpIcon
+          sx={{
+            width: "5rem",
+            height: "5rem",
+            [theme.breakpoints.down("md")]: { width: "3rem", height: "3rem" },
+          }}
+        />
+      </ScrollTop>
+    </Grid>
+  );
 };
 export default BackToTop;