mirror of
https://github.com/Steffo99/festa.git
synced 2024-12-22 22:54:22 +00:00
Improve page style
This commit is contained in:
parent
6fa2685bf1
commit
85f43ca59a
4 changed files with 31 additions and 5 deletions
|
@ -1,6 +1,7 @@
|
||||||
import '../styles/globals.css'
|
import '../styles/globals.css'
|
||||||
import '../styles/telegram.css'
|
import '../styles/telegram.css'
|
||||||
import '../styles/postcard.css'
|
import '../styles/postcard.css'
|
||||||
|
import "../styles/index.css"
|
||||||
import type { AppProps } from 'next/app'
|
import type { AppProps } from 'next/app'
|
||||||
import { LoginContext } from '../contexts/login'
|
import { LoginContext } from '../contexts/login'
|
||||||
import { useState } from 'react'
|
import { useState } from 'react'
|
||||||
|
|
|
@ -4,7 +4,7 @@ import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
|
||||||
|
|
||||||
export async function getStaticProps(context: NextPageContext) {
|
export async function getStaticProps(context: NextPageContext) {
|
||||||
return {props: {
|
return {props: {
|
||||||
...(await serverSideTranslations(context.locale ?? "it-IT", ["common"]))
|
...(await serverSideTranslations(context.locale, ["common"]))
|
||||||
}}
|
}}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -12,13 +12,13 @@ const Page: NextPage = () => {
|
||||||
const {t} = useTranslation("common")
|
const {t} = useTranslation("common")
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div className="index-layout">
|
||||||
<h1>
|
<h1 class="index-title">
|
||||||
{t("title")}
|
{t("title")}
|
||||||
</h1>
|
</h1>
|
||||||
<p>
|
<h2>
|
||||||
{t("description")}
|
{t("description")}
|
||||||
</p>
|
</h2>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -16,10 +16,15 @@ a:visited {
|
||||||
color: #aa44ff;
|
color: #aa44ff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
@media (prefers-color-scheme: light) {
|
@media (prefers-color-scheme: light) {
|
||||||
body {
|
body {
|
||||||
background-color: white;
|
background-color: white;
|
||||||
color: black;
|
color: black;
|
||||||
|
text-shadow: 2px 2px 2px white;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -27,5 +32,6 @@ a:visited {
|
||||||
body {
|
body {
|
||||||
background-color: black;
|
background-color: black;
|
||||||
color: white;
|
color: white;
|
||||||
|
text-shadow: 2px 2px 2px black;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
19
styles/index.css
Normal file
19
styles/index.css
Normal file
|
@ -0,0 +1,19 @@
|
||||||
|
.index-layout {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: 639px) {
|
||||||
|
.index-title {
|
||||||
|
font-size: 5em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (min-width: 640px) {
|
||||||
|
.index-title {
|
||||||
|
font-size: 10em;
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in a new issue