Initial next app
This commit is contained in:
@@ -1,8 +1,8 @@
|
||||
import '../styles/globals.css'
|
||||
import type { AppProps } from 'next/app'
|
||||
import '../styles/globals.scss';
|
||||
import type { AppProps } from 'next/app';
|
||||
|
||||
function MyApp({ Component, pageProps }: AppProps) {
|
||||
return <Component {...pageProps} />
|
||||
return <Component {...pageProps} />;
|
||||
}
|
||||
|
||||
export default MyApp
|
||||
export default MyApp;
|
||||
|
||||
43
pages/components/Footer.tsx
Normal file
43
pages/components/Footer.tsx
Normal file
@@ -0,0 +1,43 @@
|
||||
import Link from 'next/link';
|
||||
import React from 'react';
|
||||
import styles from '../../styles/Footer.module.scss';
|
||||
|
||||
export const Footer = () => {
|
||||
return (
|
||||
<footer>
|
||||
<div className={styles.mobileMiddle}>
|
||||
<Link href='/#nav-bar'>
|
||||
<img src='small-logo.png' alt='small logo' />
|
||||
</Link>
|
||||
</div>
|
||||
<div className={styles.container}>
|
||||
<div className={styles.left}>
|
||||
Livonsaari & Palva & Velkuanmaa
|
||||
<br />
|
||||
Naantalin saaristo
|
||||
<br />
|
||||
</div>
|
||||
<div className={styles.middle}>
|
||||
<Link href='/#nav-bar'>
|
||||
<img src='small-logo.png' alt='small logo' />
|
||||
</Link>
|
||||
</div>
|
||||
<div className={styles.right}>
|
||||
Katariina Vuorinen <br />
|
||||
<a className='generic-link' href='mailto:runosaari@gmail.com'>
|
||||
runosaari@gmail.com
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<a
|
||||
className='generic-link'
|
||||
href='https://github.com/codevictory/runosaari.net'
|
||||
>
|
||||
lähdekoodi
|
||||
</a>
|
||||
by codevictory
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
};
|
||||
29
pages/components/Header.tsx
Normal file
29
pages/components/Header.tsx
Normal file
@@ -0,0 +1,29 @@
|
||||
import Link from 'next/link';
|
||||
import React from 'react';
|
||||
import styles from '../../styles/Header.module.scss';
|
||||
|
||||
export const Header = () => {
|
||||
return (
|
||||
<header>
|
||||
<nav className={styles.mainNavBar}>
|
||||
<Link href='/'>Etusivu</Link>
|
||||
<Link href='/program'>Ohjelma</Link>
|
||||
<Link href='/performers'>Esiintyjät</Link>
|
||||
<Link href='/info'>Info</Link>
|
||||
<Link href='/safety'>Turvallisuus</Link>
|
||||
<Link href='/archive'>Arkisto</Link>
|
||||
</nav>
|
||||
<h1 className={styles.mobileMainTitle}>
|
||||
<Link href='/'>Runosaari 2022</Link>
|
||||
</h1>
|
||||
<nav className={styles.mobileMainNavBar} id='nav-bar'>
|
||||
<Link href='/#logo-start'>Etusivu</Link>
|
||||
<Link href='/program#program-start'>Ohjelma</Link>
|
||||
<Link href='/performers#performers-start'>Esiintyjät</Link>
|
||||
<Link href='/info#contact-start'>Info</Link>
|
||||
<Link href='/safety#safety-start'>Turvallisuus</Link>
|
||||
<Link href='/archive#archive-start'>Arkisto</Link>
|
||||
</nav>
|
||||
</header>
|
||||
);
|
||||
};
|
||||
127
pages/index.tsx
127
pages/index.tsx
@@ -1,72 +1,67 @@
|
||||
import type { NextPage } from 'next'
|
||||
import Head from 'next/head'
|
||||
import Image from 'next/image'
|
||||
import styles from '../styles/Home.module.css'
|
||||
import type { NextPage } from 'next';
|
||||
import { Footer } from './components/Footer';
|
||||
import { Header } from './components/Header';
|
||||
import styles from '../styles/Home.module.scss';
|
||||
|
||||
const Home: NextPage = () => {
|
||||
return (
|
||||
<div className={styles.container}>
|
||||
<Head>
|
||||
<title>Create Next App</title>
|
||||
<meta name="description" content="Generated by create next app" />
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
</Head>
|
||||
<>
|
||||
<Header />
|
||||
<main>
|
||||
<section className={styles.logo} id='logo-start'>
|
||||
<img src='runosaari-logo.jpg' alt='Runosaari logo' />
|
||||
<div id='logo-credits'>
|
||||
<div>@Sanna Hukkanen</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<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.tsx</code>
|
||||
</p>
|
||||
|
||||
<div className={styles.grid}>
|
||||
<a href="https://nextjs.org/docs" className={styles.card}>
|
||||
<h2>Documentation →</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 →</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 →</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 →</h2>
|
||||
<p>
|
||||
Instantly deploy your Next.js site to a public URL with Vercel.
|
||||
</p>
|
||||
</a>
|
||||
</div>
|
||||
<section className={styles.main}>
|
||||
<h1 id='main-title'>Runosaari 2022</h1>
|
||||
<h2>
|
||||
<span className={styles.timeAndPlace}>
|
||||
~ 20.-23.7. Livonsaari & Velkuanmaa ~
|
||||
</span>
|
||||
<br />
|
||||
Eksymisretki omaan luontoosi, metsänpeiton suojaan!
|
||||
</h2>
|
||||
<p>
|
||||
Lumi ja jää vähenee, vedenpinta nousee ja pandemian aallot viistävät
|
||||
meidänkin rantojamme. Peurojen kurittaman monimuotoisuuden keskelle
|
||||
nousee RUNOSAARI täynnä ihmetystä ja kysymyksiä: onko
|
||||
tulevaisuudella tulevaisuutta? Kuinka luontoon lomittuminen voi olla
|
||||
mahdollista? Jos eksymme metsänpeittoon, voimmeko löytää jonnekin?
|
||||
</p>
|
||||
<p>
|
||||
Uusi poikkitaiteellinen runofestivaali järjestetään toista kertaa
|
||||
Livonsaaressa, Palvassa ja Velkuanmaassa 20.-23.7.2022! Ohjelmassa
|
||||
runous yhdistyy elävään musiikkiin ja erilaisiin taiteellisiin
|
||||
työpajoihin. Livonsaaren perinteinen Seurantalo pikniknurmikkoineen
|
||||
ja lähimetsineen tarjoaa puitteet lavaesiintyjille, työpajoille ja
|
||||
elävälle musiikille. Cafe Laiturissa runous kohtaa yleisön meren
|
||||
äärellä. Velkuanmaan pastoraali-idylli kahden lossin takana
|
||||
viettelee saaristoluonnon syvyyksiin, ja runoiltapäivässä saamme
|
||||
nauttia soitosta ja runoudesta Saaristohotelli Vaihelan leppoisalla
|
||||
terassilla.
|
||||
</p>
|
||||
<p>
|
||||
Runosaari-festivaaliin osallistuu toistakymmentä maamme eturivin
|
||||
runoilijaa, muusikoita, työpajan vetäjiä ja muita esiintyjiä ke
|
||||
20.7.– la 23.7.2022.
|
||||
</p>
|
||||
<p>
|
||||
Tapahtuman järjestää Runosaari-työryhmä. Yhteistyössä: Runoviikko
|
||||
ry, Kirjan talo – Bokens hus ry, Livonsaaren kyläyhdistys ry,
|
||||
Velkuan saaristolaisyhdistys ry, Aviador Kustannus, Enostone
|
||||
Kustannus, Cafe Laituri ja Saaristohotelli Vaihela.
|
||||
</p>
|
||||
<p>
|
||||
<i>[Ohjelmaa päivitetään]</i>
|
||||
</p>
|
||||
</section>
|
||||
</main>
|
||||
<Footer />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
<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>
|
||||
)
|
||||
}
|
||||
|
||||
export default Home
|
||||
export default Home;
|
||||
|
||||
Reference in New Issue
Block a user