hernik/pavouk
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases 3 Wiki Activity

fix: add loading circle and format html

Browse source
This commit is contained in:
Matyáš Caras 2022-11-08 17:39:02 +01:00
parent c0516b3395
commit 3b3ee59dfb
1 changed files with 86 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

103
web/index.html
View file

@ -1,5 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<!-- <!--
If you are serving your web app in a path other than the root, change the If you are serving your web app in a path other than the root, change the
@ -21,22 +22,25 @@
<meta name="theme-color" content="#ff4c4c"> <meta name="theme-color" content="#ff4c4c">
<!-- Primary Meta Tags --> <!-- Primary Meta Tags -->
<meta name="title" content="Pavouk | subnetování"> <meta name="title" content="Pavouk | subnetování">
<meta name="description" content="S pavoukem si můžete nechat vygenerovat náhodnou síť s náhodným počtem subnetů/podsítí, každý s náhodným počtem hostů, případně nechat vyřešit vlastní příklad."> <meta name="description"
content="S pavoukem si můžete nechat vygenerovat náhodnou síť s náhodným počtem subnetů/podsítí, každý s náhodným počtem hostů, případně nechat vyřešit vlastní příklad.">
<!-- Open Graph / Facebook --> <!-- Open Graph / Facebook -->
<meta property="og:type" content="website"> <meta property="og:type" content="website">
<meta property="og:url" content="https://pavouk.caras.cafe/"> <meta property="og:url" content="https://pavouk.caras.cafe/">
<meta property="og:title" content="Pavouk | subnetování"> <meta property="og:title" content="Pavouk | subnetování">
<meta property="og:description" content="S pavoukem si můžete nechat vygenerovat náhodnou síť s náhodným počtem subnetů/podsítí, každý s náhodným počtem hostů, případně nechat vyřešit vlastní příklad."> <meta property="og:description"
<meta property="og:image" content="https://pavouk.caras.cafe/banner.png"> content="S pavoukem si můžete nechat vygenerovat náhodnou síť s náhodným počtem subnetů/podsítí, každý s náhodným počtem hostů, případně nechat vyřešit vlastní příklad.">
<meta property="og:image" content="https://pavouk.caras.cafe/banner.png">
<!-- Twitter --> <!-- Twitter -->
<meta property="twitter:card" content="summary_large_image"> <meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://pavouk.caras.cafe/"> <meta property="twitter:url" content="https://pavouk.caras.cafe/">
<meta property="twitter:title" content="Pavouk | subnetování"> <meta property="twitter:title" content="Pavouk | subnetování">
<meta property="twitter:description" content="S pavoukem si můžete nechat vygenerovat náhodnou síť s náhodným počtem subnetů/podsítí, každý s náhodným počtem hostů, případně nechat vyřešit vlastní příklad."> <meta property="twitter:description"
<meta property="twitter:image" content="https://pavouk.caras.cafe/banner.png"> content="S pavoukem si můžete nechat vygenerovat náhodnou síť s náhodným počtem subnetů/podsítí, každý s náhodným počtem hostů, případně nechat vyřešit vlastní příklad.">
<meta property="twitter:image" content="https://pavouk.caras.cafe/banner.png">
<!-- iOS meta tags & icons --> <!-- iOS meta tags & icons -->
@ -46,7 +50,7 @@
<link rel="apple-touch-icon" href="icon.png"> <link rel="apple-touch-icon" href="icon.png">
<!-- Favicon --> <!-- Favicon -->
<link rel="icon" type="image/png" href="icon.png"/> <link rel="icon" type="image/png" href="icon.png" />
<title>Pavouk | subnetování</title> <title>Pavouk | subnetování</title>
<link rel="manifest" href="manifest.json"> <link rel="manifest" href="manifest.json">
@ -57,21 +61,84 @@
</script> </script>
<!-- This script adds the flutter initialization JS code --> <!-- This script adds the flutter initialization JS code -->
<script src="flutter.js" defer></script> <script src="flutter.js" defer></script>
<style>
.lds-ring {
display: inline-block;
position: relative;
width: 80px;
height: 80px;
}
.lds-ring div {
box-sizing: border-box;
display: block;
position: absolute;
width: 64px;
height: 64px;
margin: 8px;
border: 8px solid #fff;
border-radius: 50%;
animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
border-color: #000 transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
animation-delay: -0.15s;
}
@keyframes lds-ring {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.center {
margin: 0;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%)
}
</style>
</head> </head>
<body> <body>
<div class="center">
<div class="lds-ring">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>
<script> <script>
window.addEventListener('load', function(ev) { window.addEventListener('load', function (ev) {
// Download main.dart.js // Download main.dart.js
_flutter.loader.loadEntrypoint({ _flutter.loader.loadEntrypoint({
serviceWorker: { serviceWorker: {
serviceWorkerVersion: serviceWorkerVersion, serviceWorkerVersion: serviceWorkerVersion,
} }
}).then(function(engineInitializer) { }).then(function (engineInitializer) {
return engineInitializer.initializeEngine(); return engineInitializer.initializeEngine();
}).then(function(appRunner) { }).then(function (appRunner) {
return appRunner.runApp(); return appRunner.runApp();
}); });
}); });
</script> </script>
</body> </body>
</html> </html>