muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-24 20:36:40 +07:00
Code Packages Activity Actions

(nextjs) fixed fonts

Browse source
This commit is contained in:
Fedor Katurov 2022-01-19 11:37:26 +07:00
parent d30cad9caa
commit c469722a86
3 changed files with 119 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/components/main/MainPreloader/index.tsx Normal file
View file

@ -0,0 +1,18 @@
import React, { VFC } from 'react';
interface MainPreloaderProps {}
const MainPreloader: VFC<MainPreloaderProps> = () => (
<div id="main_loader">
<div id="preload_shade">
<span></span>
<span></span>
<span></span>
</div>
<div>СМИРЕННО</div>
<div>ОЖИДАЙТЕ</div>
</div>
);
export { MainPreloader };

62
src/components/main/MainPreloader/styles.module.scss Normal file
View file

@ -0,0 +1,62 @@
@keyframes erdball {
0% {
transform: translate(0, 100%);
}
100% {
transform: translate(0, 0);
}
}
.main_loader {
position: fixed;
width: 100%;
height: 100%;
background: #222222;
top: 0;
left: 0;
z-index: 100;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
font: 600 22px 'Montserrat';
color: white;
& > div {
margin: 3px 0;
}
}
.preload_shade {
width: 120px;
height: 120px;
box-shadow: white 0 0 0 3px;
border-radius: 100%;
overflow: hidden;
position: relative;
margin-bottom: 15px !important;
& > span {
width: 100%;
height: 100%;
box-shadow: white 0 0 0 2px;
border-radius: 100%;
overflow: hidden;
position: absolute;
top: 0;
left: 0;
animation: erdball 3s infinite;
will-change: transform;
&:nth-child(2) {
animation-delay: -1s;
}
&:nth-child(3) {
animation-delay: -2s;
}
}
}
#preload_shade>

39
src/pages/_document.tsx Normal file
View file

@ -0,0 +1,39 @@
import Document, { Html, Head, Main, NextScript } from 'next/document';
class MyDocument extends Document {
static async getInitialProps(ctx) {
const initialProps = await Document.getInitialProps(ctx);
return { ...initialProps };
}
render() {
return (
<Html>
<Head>
<meta charSet="utf-8" />
<meta httpEquiv="content-language" content="ru" />
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
<meta name="theme-color" content="#222222" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, user-scalable=0"
/>
<link
href="https://fonts.googleapis.com/css?family=Montserrat:400,500,600,700,800&display=swap&subset=cyrillic"
rel="stylesheet"
/>
<title>Убежище</title>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
}
export default MyDocument;