ti/hereconnect
1
0
Fork 0
Code Issues 26 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

add preloader to app
Deploy app frontend / app frontend (push) Successful in 2m52s
Details

Browse Source
This commit is contained in:
Vasilii Mikhailovskii
2024-12-15 11:11:35 +02:00
parent 714f5b7b51
commit ae5da9f6d7
4 changed files with 23 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/frontend/index.html
+8 -2
View File
@@ -11,9 +11,15 @@
<meta name="apple-mobile-web-app-title" content="НаСвязи"> <meta name="apple-mobile-web-app-title" content="НаСвязи">
<meta name="theme-color" content="#ffffff" media="(prefers-color-scheme: light)" /> <meta name="theme-color" content="#ffffff" media="(prefers-color-scheme: light)" />
<meta name="theme-color" content="#121212" media="(prefers-color-scheme: dark)" /> <meta name="theme-color" content="#121212" media="(prefers-color-scheme: dark)" />
<link rel="stylesheet" href="/css/preloader.css" />
</head> </head>
<body> <body class="preloader">
<div id="app"></div> <div id="loader">
<div class="spinner"></div>
</div>
<div id="app">
</div>
<script type="module" src="/src/main.ts"></script> <script type="module" src="/src/main.ts"></script>
</body> </body>
</html> </html>
apps/frontend/public/css/preloader.css
+10 -1
View File
@@ -1,5 +1,9 @@
/* Общие стили */ /* Общие стили */
body { body.preloader #app {
display: none;
}
body.preloader {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@@ -9,6 +13,11 @@ body {
} }
#loader { #loader {
display: none;
}
body.preloader #loader {
display: block;
text-align: center; text-align: center;
padding: 7.5vh 7.5vw; padding: 7.5vh 7.5vw;
} }
apps/frontend/public/preloader.html
+1 -1
View File
@@ -8,7 +8,7 @@
<title>Загрузка… — НаСвязи</title> <title>Загрузка… — НаСвязи</title>
<link rel="stylesheet" href="/css/preloader.css" /> <link rel="stylesheet" href="/css/preloader.css" />
</head> </head>
<body> <body class="preloader">
<div id="loader"> <div id="loader">
<div id="offline-message" style="display: none;"> <div id="offline-message" style="display: none;">
<h1>Нет подключения к интернету</h1> <h1>Нет подключения к интернету</h1>
apps/frontend/src/router/index.ts
+4
View File
@@ -139,4 +139,8 @@ const router = createRouter({
}, },
}) })
router.isReady().then(() => {
document.body.classList.remove('preloader')
})
export default router export default router