Aarni Halinen
156 lines
3.5 KiB
TypeScript
156 lines
3.5 KiB
TypeScript
import React from "react";
|
|
// import App from "next/app";
|
|
import type { AppProps /* , AppContext' */ } from "next/app";
|
|
import Head from "next/head";
|
|
import styled, { createGlobalStyle } from "styled-components";
|
|
import { colors } from "@theme/colors";
|
|
|
|
import "react-mde/lib/styles/css/react-mde-all.css";
|
|
|
|
const fontFamily = "'Montserrat', sans-serif";
|
|
const fontSize = 12; // 16px
|
|
const lineHeight = 1.5;
|
|
|
|
const GlobalCommonStyles = createGlobalStyle`
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
html {
|
|
font-family: ${fontFamily};
|
|
/* 12px */
|
|
font-size: ${fontSize * 0.75}pt;
|
|
line-height: ${lineHeight};
|
|
|
|
@media screen and (min-width: 1200px) {
|
|
/* 16px */
|
|
font-size: ${fontSize}pt;
|
|
}
|
|
|
|
@media screen and (min-width: 1920px) {
|
|
/* 20px */
|
|
font-size: ${fontSize * 1.25}pt;
|
|
}
|
|
|
|
@media screen and (min-width: 2560px) {
|
|
/* 24px */
|
|
font-size: ${fontSize * 1.5}pt;
|
|
}
|
|
}
|
|
|
|
body {
|
|
padding: 0;
|
|
background-color: ${colors.darkBlue};
|
|
}
|
|
|
|
p {
|
|
font-size: 1.2rem;
|
|
font-weight: 300;
|
|
word-break: break-word;
|
|
hyphens: auto;
|
|
}
|
|
|
|
h1 {
|
|
line-height: 1.15;
|
|
font-size: 2.5rem;
|
|
font-weight: 200;
|
|
margin-block-start: 0;
|
|
margin-block-end: 0;
|
|
}
|
|
|
|
h2 {
|
|
font-size: 1.2rem;
|
|
font-weight: 700;
|
|
letter-spacing: 0.1em;
|
|
margin-block-start: 0;
|
|
margin-block-end: 0;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
h3 {
|
|
font-size: 2rem;
|
|
font-weight: 200;
|
|
margin-block-start: 0;
|
|
margin-block-end: 0;
|
|
}
|
|
|
|
h4 {
|
|
font-size: 1rem;
|
|
font-weight: 700;
|
|
letter-spacing: 0.1em;
|
|
margin-block-start: 0;
|
|
margin-block-end: 0;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
h5 {
|
|
font-size: 1.125rem;
|
|
font-weight: 600;
|
|
margin-block-start: 0;
|
|
margin-block-end: 0;
|
|
}
|
|
|
|
h6 {
|
|
font-size: 0.8rem;
|
|
letter-spacing: 0.1em;
|
|
font-weight: 800;
|
|
margin-block-start: 0;
|
|
margin-block-end: 0;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
li {
|
|
font-weight: 600;
|
|
}
|
|
|
|
|
|
a {
|
|
text-decoration: underline;
|
|
color: ${colors.blue1};
|
|
}
|
|
|
|
a:hover {
|
|
text-decoration: none;
|
|
}
|
|
`;
|
|
|
|
const AppContainer = styled.div`
|
|
position: relative;
|
|
min-height: 100vh;
|
|
display: flex;
|
|
flex-flow: column nowrap;
|
|
color: ${colors.black};
|
|
background-color: ${colors.white};
|
|
`;
|
|
|
|
const Web20App = ({ Component, pageProps }: AppProps) => (
|
|
<>
|
|
<Head>
|
|
<meta httpEquiv="Content-Type" content="text/html; charset=utf-8" />
|
|
<link href="https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,800,900&display=swap" rel="stylesheet" />
|
|
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>Aalto-yliopiston Sähköinsinöörikilta ry</title>
|
|
<meta name="description" content="Aalto-yliopiston Sähköinsinöörikilta ry on Otaniemessä vaikuttava opiskelijajärjestö, joka on perustettu vuonna 1921. Kilta järjestää kaikenlaista toimintaa liittyen opintoihin ja vapaa-ajan viettoon." />
|
|
<meta name="keywords" content="SIK AYY" />
|
|
</Head>
|
|
<GlobalCommonStyles />
|
|
<AppContainer>
|
|
<Component {...pageProps} />
|
|
</AppContainer>
|
|
</>
|
|
);
|
|
|
|
// Only uncomment this method if you have blocking data requirements for
|
|
// every single page in your application. This disables the ability to
|
|
// perform automatic static optimization, causing every page in your app to
|
|
// be server-side rendered.
|
|
//
|
|
// export const getInitialProps = async (appContext: AppContext) => {
|
|
// // calls page's `getInitialProps` and fills `appProps.pageProps`
|
|
// const appProps = await App.getInitialProps(appContext);
|
|
// return { ...appProps }
|
|
// }
|
|
|
|
export default Web20App;
|