Initial commit

2026-05-02 02:10:27 +00:00 · 2021-01-04 14:31:06 +01:00
parent 15d215b278
commit 4708e5d074
15 changed files with 1041 additions and 263 deletions
@@ -1,7 +0,0 @@
-import '../styles/globals.css'
-
-function MyApp({ Component, pageProps }) {
-  return <Component {...pageProps} />
-}
-
-export default MyApp
@@ -0,0 +1,39 @@
+import type { AppProps } from 'next/app';
+import styled, { createGlobalStyle } from 'styled-components';
+import Head from 'next/head';
+
+const GlobalStyle = createGlobalStyle`
+  body {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+		font-family: 'Source Code Pro', monospace;
+		font-size: '17px';
+  }
+`;
+
+const Container = styled.div`
+	width: 85%;
+	margin: auto;
+`;
+
+const App = ({ Component, pageProps }: AppProps) => {
+	return (
+		<>
+			<Head>
+				<link rel='preconnect' href='https://fonts.gstatic.com' />
+				<link
+					href='https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@400;700&display=swap'
+					rel='stylesheet'
+				/>
+				<title>Hazem Krimi</title>
+			</Head>
+			<GlobalStyle />
+			<Container>
+				<Component {...pageProps} />
+			</Container>
+		</>
+	);
+};
+
+export default App;
@@ -0,0 +1,31 @@
+import Document from 'next/document';
+import { ServerStyleSheet } from 'styled-components';
+
+class Doc extends Document {
+	static async getInitialProps(ctx) {
+		const sheet = new ServerStyleSheet();
+		const originalRenderPage = ctx.renderPage;
+
+		try {
+			ctx.renderPage = () =>
+				originalRenderPage({
+					enhanceApp: App => props => sheet.collectStyles(<App {...props} />)
+				});
+
+			const initialProps = await Document.getInitialProps(ctx);
+			return {
+				...initialProps,
+				styles: (
+					<>
+						{initialProps.styles}
+						{sheet.getStyleElement()}
+					</>
+				)
+			};
+		} finally {
+			sheet.seal();
+		}
+	}
+}
+
+export default Doc;
@@ -1,6 +0,0 @@
-// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
-
-export default (req, res) => {
-  res.statusCode = 200
-  res.json({ name: 'John Doe' })
-}
@@ -1,65 +0,0 @@
-import Head from 'next/head'
-import styles from '../styles/Home.module.css'
-
-export default function Home() {
-  return (
-    <div className={styles.container}>
-      <Head>
-        <title>Create Next App</title>
-        <link rel="icon" href="/favicon.ico" />
-      </Head>
-
-      <main className={styles.main}>
-        <h1 className={styles.title}>
-          Welcome to <a href="https://nextjs.org">Next.js!</a>
-        </h1>
-
-        <p className={styles.description}>
-          Get started by editing{' '}
-          <code className={styles.code}>pages/index.js</code>
-        </p>
-
-        <div className={styles.grid}>
-          <a href="https://nextjs.org/docs" className={styles.card}>
-            <h3>Documentation &rarr;</h3>
-            <p>Find in-depth information about Next.js features and API.</p>
-          </a>
-
-          <a href="https://nextjs.org/learn" className={styles.card}>
-            <h3>Learn &rarr;</h3>
-            <p>Learn about Next.js in an interactive course with quizzes!</p>
-          </a>
-
-          <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
-            className={styles.card}
-          >
-            <h3>Examples &rarr;</h3>
-            <p>Discover and deploy boilerplate example Next.js projects.</p>
-          </a>
-
-          <a
-            href="https://vercel.com/import?filter=next.js&utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
-            className={styles.card}
-          >
-            <h3>Deploy &rarr;</h3>
-            <p>
-              Instantly deploy your Next.js site to a public URL with Vercel.
-            </p>
-          </a>
-        </div>
-      </main>
-
-      <footer className={styles.footer}>
-        <a
-          href="https://vercel.com?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Powered by{' '}
-          <img src="/vercel.svg" alt="Vercel Logo" className={styles.logo} />
-        </a>
-      </footer>
-    </div>
-  )
-}
@@ -0,0 +1,7 @@
+import { FC } from 'react';
+
+const Home: FC = () => {
+	return <h2>Hazem Krimi's Website</h2>;
+};
+
+export default Home;