replace index & start on Header

This commit is contained in:
2022-05-06 12:53:40 +02:00
parent c9a152fd6a
commit 1876f0d390
4 changed files with 27 additions and 192 deletions

3
components/Header.js Normal file
View File

@@ -0,0 +1,3 @@
export default function Home() {
return <></>;
}

View File

@@ -1,69 +1,27 @@
import Head from "next/head"; import Header from "../components/Header.js";
import Image from "next/image";
import styles from "../styles/Home.module.css";
export default function Home() { export default function Home() {
return ( return (
<div className={styles.container}> <>
<Head> <Header />
<title>Create Next App</title> <style jsx>{`
<meta name="description" content="Generated by create next app" /> h1,
<link rel="icon" href="/favicon.ico" /> p {
</Head> margin: 1rem;
}
<main className={styles.main}> p {
<h1 className={styles.title}> border-left: 0.2rem solid black;
Welcome to <a href="https://nextjs.org">Next.js!</a> padding-left: 1rem;
</h1> }
`}</style>
<p className={styles.description}> <h1>Strona w przebudowie.</h1>
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}>
<h2>Documentation &rarr;</h2>
<p>Find in-depth information about Next.js features and API.</p>
</a>
<a href="https://nextjs.org/learn" className={styles.card}>
<h2>Learn &rarr;</h2>
<p>Learn about Next.js in an interactive course with quizzes!</p>
</a>
<a
href="https://github.com/vercel/next.js/tree/canary/examples"
className={styles.card}
>
<h2>Examples &rarr;</h2>
<p>Discover and deploy boilerplate example Next.js projects.</p>
</a>
<a
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
className={styles.card}
>
<h2>Deploy &rarr;</h2>
<p> <p>
Instantly deploy your Next.js site to a public URL with Vercel. Tutaj powstaje Gractwo experience godny Twoich oczu. <br /> Zakładając,
że zaraz nie dostanę od Ciebie - drogi internauto - wiadomości, że żaden
taki nie jest. <br />
I'm onto you. <br />
<br />~ jamesen
</p> </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{" "}
<span className={styles.logo}>
<Image src="/vercel.svg" alt="Vercel Logo" width={72} height={16} />
</span>
</a>
</footer>
</div>
); );
} }

View File

@@ -1,116 +0,0 @@
.container {
padding: 0 2rem;
}
.main {
min-height: 100vh;
padding: 4rem 0;
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.footer {
display: flex;
flex: 1;
padding: 2rem 0;
border-top: 1px solid #eaeaea;
justify-content: center;
align-items: center;
}
.footer a {
display: flex;
justify-content: center;
align-items: center;
flex-grow: 1;
}
.title a {
color: #0070f3;
text-decoration: none;
}
.title a:hover,
.title a:focus,
.title a:active {
text-decoration: underline;
}
.title {
margin: 0;
line-height: 1.15;
font-size: 4rem;
}
.title,
.description {
text-align: center;
}
.description {
margin: 4rem 0;
line-height: 1.5;
font-size: 1.5rem;
}
.code {
background: #fafafa;
border-radius: 5px;
padding: 0.75rem;
font-size: 1.1rem;
font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
Bitstream Vera Sans Mono, Courier New, monospace;
}
.grid {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
max-width: 800px;
}
.card {
margin: 1rem;
padding: 1.5rem;
text-align: left;
color: inherit;
text-decoration: none;
border: 1px solid #eaeaea;
border-radius: 10px;
transition: color 0.15s ease, border-color 0.15s ease;
max-width: 300px;
}
.card:hover,
.card:focus,
.card:active {
color: #0070f3;
border-color: #0070f3;
}
.card h2 {
margin: 0 0 1rem 0;
font-size: 1.5rem;
}
.card p {
margin: 0;
font-size: 1.25rem;
line-height: 1.5;
}
.logo {
height: 1em;
margin-left: 0.5rem;
}
@media (max-width: 600px) {
.grid {
width: 100%;
flex-direction: column;
}
}

View File

@@ -1,16 +1,6 @@
html, * {
body {
padding: 0;
margin: 0; margin: 0;
padding: 0;
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
} }
a {
color: inherit;
text-decoration: none;
}
* {
box-sizing: border-box;
}