fix: add loading circle and format html
This commit is contained in:
parent
c0516b3395
commit
3b3ee59dfb
1 changed files with 86 additions and 19 deletions
|
@ -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
|
||||||
|
@ -22,20 +23,23 @@
|
||||||
|
|
||||||
<!-- 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"
|
||||||
|
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">
|
<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"
|
||||||
|
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">
|
<meta property="twitter:image" content="https://pavouk.caras.cafe/banner.png">
|
||||||
|
|
||||||
|
|
||||||
|
@ -57,8 +61,70 @@
|
||||||
</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
|
||||||
|
@ -74,4 +140,5 @@
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
Loading…
Reference in a new issue