Добавил спиннер (#5)

This commit is contained in:
2024-03-28 18:26:26 +03:00
parent f09536f4aa
commit b858d70675
3 changed files with 352 additions and 205 deletions

View File

@@ -4,6 +4,7 @@ import { Global, css } from '@emotion/react'
import { BrowserRouter } from 'react-router-dom';
import ruLocale from 'dayjs/locale/ru';
import dayjs from 'dayjs';
import { ChakraProvider } from '@chakra-ui/react'
import { Dashboard } from './dashboard';
@@ -11,72 +12,74 @@ dayjs.locale('ru', ruLocale);
const App = ({ store }) => {
return(
<BrowserRouter>
<Helmet>
<meta name="viewport" content="width=device-width, user-scalable=no" />
<title>Журнал</title>
</Helmet>
<Global
styles={css`
* { box-sizing: border-box; }
html {
height: 100%;
max-width: 100%;
overflow: hidden;
}
body {
color: #000;
/* background: radial-gradient(circle at top right, rgb(154 227 33), rgb(33 160 56)); */
background: radial-gradient(
farthest-side at bottom left,
rgba(35, 235, 4, 0.709),
rgba(255, 255, 255, 0) 65%
),
radial-gradient(
farthest-corner at bottom center,
rgba(244, 244, 8, 0.6),
rgba(255, 255, 255, 0) 40%
),
radial-gradient(
farthest-side at bottom right,
rgba(0, 195, 255, 0.648),
rgba(255, 255, 255, 0) 65%
);
height: 100%;
font-family: KiyosunaSans, Montserrat, RFKrabuler, sans-serif;
font-weight: 600;
}
#app {
height: 100%;
overflow-y: auto;
}
<ChakraProvider>
<BrowserRouter>
<Helmet>
<meta name="viewport" content="width=device-width, user-scalable=no" />
<title>Журнал</title>
</Helmet>
<Global
styles={css`
html {
height: 100%;
max-width: 100%;
overflow: hidden;
}
body {
color: #000;
/* background: radial-gradient(circle at top right, rgb(154 227 33), rgb(33 160 56)); */
background: radial-gradient(
farthest-side at bottom left,
rgba(35, 235, 4, 0.709),
rgba(255, 255, 255, 0) 65%
),
radial-gradient(
farthest-corner at bottom center,
rgba(244, 244, 8, 0.6),
rgba(255, 255, 255, 0) 40%
),
radial-gradient(
farthest-side at bottom right,
rgba(0, 195, 255, 0.648),
rgb(239 244 246) 65%
/* rgba(255, 255, 255, 0) 65% */
);
height: 100%;
font-family: KiyosunaSans, Montserrat, RFKrabuler, sans-serif;
font-weight: 600;
}
#app {
height: 100%;
overflow-y: auto;
}
@font-face {
font-family: 'KiyosunaSans';
src: url('${__webpack_public_path__ + '/remote-assets/KiyosunaSans/KiyosunaSans-B.otf'}');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'KiyosunaSans';
src: url('${__webpack_public_path__ + '/remote-assets/KiyosunaSans/KiyosunaSans-L.otf'}');
font-weight: lighter;
font-style: normal;
}
@font-face {
font-family: 'RFKrabuler';
src: url('${__webpack_public_path__ + '/remote-assets/RF-Krabuler/WEB/RFKrabuler-Regular.eot'}');
src:
url('${__webpack_public_path__ + '/remote-assets/RF-Krabuler/WEB/RFKrabuler-Regular.woff2'}') format('woff2'),
url('${__webpack_public_path__ + '/remote-assets/RF-Krabuler/WEB/RFKrabuler-Regular.woff'}') format('woff'),
url('${__webpack_public_path__ + '/remote-assets/RF-Krabuler/TTF/RF-Krabuler-Regular.ttf'}') format('truetype');
font-weight: normal;
font-style: normal;
}
`}
/>
<Dashboard store={store} />
</BrowserRouter>
@font-face {
font-family: 'KiyosunaSans';
src: url('${__webpack_public_path__ + '/remote-assets/KiyosunaSans/KiyosunaSans-B.otf'}');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'KiyosunaSans';
src: url('${__webpack_public_path__ + '/remote-assets/KiyosunaSans/KiyosunaSans-L.otf'}');
font-weight: lighter;
font-style: normal;
}
@font-face {
font-family: 'RFKrabuler';
src: url('${__webpack_public_path__ + '/remote-assets/RF-Krabuler/WEB/RFKrabuler-Regular.eot'}');
src:
url('${__webpack_public_path__ + '/remote-assets/RF-Krabuler/WEB/RFKrabuler-Regular.woff2'}') format('woff2'),
url('${__webpack_public_path__ + '/remote-assets/RF-Krabuler/WEB/RFKrabuler-Regular.woff'}') format('woff'),
url('${__webpack_public_path__ + '/remote-assets/RF-Krabuler/TTF/RF-Krabuler-Regular.ttf'}') format('truetype');
font-weight: normal;
font-style: normal;
}
`}
/>
<Dashboard store={store} />
</BrowserRouter>
</ChakraProvider>
)
}