fix: add loading circle and format html
This commit is contained in:
Matyáš Caras
parent
c0516b3395
commit
3b3ee59dfb
1 changed files with 86 additions and 19 deletions
103
web/index.html
103
web/index.html
|
|
@ -1,5 +1,6 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<!--
|
||||
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">
|
||||
|
||||
<!-- Primary Meta Tags -->
|
||||
<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="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.">
|
||||
|
||||
<!-- Open Graph / Facebook -->
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://pavouk.caras.cafe/">
|
||||
<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:image" content="https://pavouk.caras.cafe/banner.png">
|
||||
<!-- Open Graph / Facebook -->
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://pavouk.caras.cafe/">
|
||||
<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:image" content="https://pavouk.caras.cafe/banner.png">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta property="twitter:card" content="summary_large_image">
|
||||
<meta property="twitter:url" content="https://pavouk.caras.cafe/">
|
||||
<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:image" content="https://pavouk.caras.cafe/banner.png">
|
||||
<!-- Twitter -->
|
||||
<meta property="twitter:card" content="summary_large_image">
|
||||
<meta property="twitter:url" content="https://pavouk.caras.cafe/">
|
||||
<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:image" content="https://pavouk.caras.cafe/banner.png">
|
||||
|
||||
|
||||
<!-- iOS meta tags & icons -->
|
||||
|
|
@ -46,7 +50,7 @@
|
|||
<link rel="apple-touch-icon" href="icon.png">
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/png" href="icon.png"/>
|
||||
<link rel="icon" type="image/png" href="icon.png" />
|
||||
|
||||
<title>Pavouk | subnetování</title>
|
||||
<link rel="manifest" href="manifest.json">
|
||||
|
|
@ -57,21 +61,84 @@
|
|||
</script>
|
||||
<!-- This script adds the flutter initialization JS code -->
|
||||
<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>
|
||||
|
||||
<body>
|
||||
<div class="center">
|
||||
<div class="lds-ring">
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
window.addEventListener('load', function(ev) {
|
||||
window.addEventListener('load', function (ev) {
|
||||
// Download main.dart.js
|
||||
_flutter.loader.loadEntrypoint({
|
||||
serviceWorker: {
|
||||
serviceWorkerVersion: serviceWorkerVersion,
|
||||
}
|
||||
}).then(function(engineInitializer) {
|
||||
}).then(function (engineInitializer) {
|
||||
return engineInitializer.initializeEngine();
|
||||
}).then(function(appRunner) {
|
||||
}).then(function (appRunner) {
|
||||
return appRunner.runApp();
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in a new issue