Update folder structure for pages and some components

components/Footer/index.tsx

@@ -0,0 +1,53 @@
+import { FC, useContext } from 'react';
+import { DarkModeContext } from '../../components/DarkMode';
+import { StyledFooter } from './styles';
+import IconButton from '../../components/IconButton';
+
+const Footer: FC = () => {
+	const { dark } = useContext(DarkModeContext);
+
+	return (
+		<StyledFooter>
+			<div className='contact'>
+				<IconButton
+					icon={dark ? '/icons/light-github.svg' : '/icons/dark-github.svg'}
+					width={16}
+					height={16}
+					href='https://github.com/hazemKrimi'
+					target='_blank'
+				/>
+				<IconButton
+					icon={dark ? '/icons/light-twitter.svg' : '/icons/dark-twitter.svg'}
+					width={16}
+					height={16}
+					href='https://twitter.com/HazemKrimi'
+					target='_blank'
+				/>
+				<IconButton
+					icon={dark ? '/icons/light-linkedin.svg' : '/icons/dark-linkedin.svg'}
+					width={16}
+					height={16}
+					href='https://linkedin.com/in/hazemkrimi'
+					target='_blank'
+				/>
+				<IconButton
+					icon={dark ? '/icons/light-codepen.svg' : '/icons/dark-codepen.svg'}
+					width={16}
+					height={16}
+					href='https://codepen.io/hazemkrimi'
+					target='_blank'
+				/>
+				<IconButton
+					icon={dark ? '/icons/light-dribbble.svg' : '/icons/dark-dribbble.svg'}
+					width={16}
+					height={16}
+					href='https://dribbble.com/HazemKrimi'
+					target='_blank'
+				/>
+			</div>
+			<p>Hazem Krimi &copy; {new Date().getFullYear()}</p>
+		</StyledFooter>
+	);
+};
+
+export default Footer;