-
Notifications
You must be signed in to change notification settings - Fork 0
/
paginaOffline.html
106 lines (101 loc) · 5 KB
/
paginaOffline.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="dodgerblue">
<meta content="8751899160-bmc7qpi981l19htokhlq8pdoc8g39b7g.apps.googleusercontent.com"
name="google-signin-client_id">
<!--Meta tag per iOS-->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta content="black" name="apple-mobile-web-app-status-bar-style">
<meta name="apple-mobile-web-app-title" content="MIIDM App">
<link rel="apple-touch-icon" href="res/logo.png">
<link rel = "manifest" href = "manifest.json" />
<title>Sei offline!</title>
<style>
@keyframes sali {
to{bottom: 1rem;}
}
body {
background-color: dodgerblue;
font-family: "Open Sans";
color: white;
}
h1 {
text-align: center;
}
p {
width: 80%;
margin-left: 10%;
}
#container_immagine {
padding-top: 5vh;
max-width: 50%;
height: auto;
margin: 0 auto;
}
#container_immagine svg {
max-width: 90%;
margin: 0 auto;
}
button {
background-color: white;
color: dodgerblue;
height: 5rem;
font-size: 1.5rem;
line-height: 5rem;
text-align: center;
border-radius: 10px;
font-weight: bold;
width: 90%;
display: block;
font-family: "Open Sans";
border: none;
outline: 0;
position: absolute;
bottom: -6rem;
left: 5%;
animation: sali .75s forwards;
animation-delay: 1s;
}
</style>
</head>
<body>
<div id = "container_immagine">
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 511.96 511.96" style="enable-background:new 0 0 511.96 511.96;" xml:space="preserve">
<circle style="fill:#F4D44E;" cx="256" cy="255.96" r="255.96"/>
<path style="fill:#E8C842;" d="M172.398,451.935C11.247,358.894,1.46,131.055,150.506,23.523
C103.321,44.752,62.118,80.456,34.272,128.687c-70.551,122.199-28.683,278.452,93.515,349.004
c89.928,51.919,198.295,42.951,277.38-14.107C332.804,496.142,246.364,494.639,172.398,451.935z"/>
<ellipse style="fill:#656566;" cx="174.962" cy="265.869" rx="23.349" ry="29.769"/>
<path style="fill:#4F4F51;" d="M192.822,283.325c-12.894,0-23.349-13.328-23.349-29.769c0-6.508,1.643-12.523,4.422-17.423
c-12.398,0.713-22.28,13.751-22.28,29.735c0,16.441,10.453,29.769,23.349,29.769c7.79,0,14.685-4.869,18.927-12.346
C193.536,283.311,193.18,283.325,192.822,283.325z"/>
<g>
<path style="fill:#656566;" d="M200.372,388.47c-3.885-1.765-5.604-6.346-3.839-10.231c23.367-51.42,96.137-50.383,118.936,0.011
c1.758,3.889,0.033,8.467-3.856,10.225c-3.887,1.76-8.466,0.033-10.225-3.855c-17.446-38.566-72.985-39.169-90.787,0.011
C209.309,387.48,204.253,390.233,200.372,388.47z"/>
<path style="fill:#656566;" d="M373.247,212.618c-13.18-12.604-29.799-19.351-46.816-19.008c-4.257,0.123-7.796-3.301-7.882-7.567
c-0.087-4.267,3.301-7.796,7.568-7.882c21.12-0.451,41.657,7.839,57.812,23.29c3.084,2.949,3.193,7.84,0.243,10.924
C381.216,215.464,376.327,215.564,373.247,212.618z"/>
<path style="fill:#656566;" d="M127.829,212.375c-2.95-3.084-2.841-7.976,0.243-10.924c16.155-15.45,36.687-23.72,57.812-23.29
c4.266,0.086,7.655,3.616,7.568,7.882c-0.087,4.266-3.613,7.694-7.882,7.567c-17.003-0.346-33.637,6.404-46.816,19.008
C135.672,215.565,130.78,215.462,127.829,212.375z"/>
</g>
<path style="fill:#9CD7F2;" d="M132.895,433.369L132.895,433.369c28.187,0,47.09-28.95,35.755-54.756l-28.703-55.081
c-2.636-5.059-9.876-5.054-12.505,0.008l-29.355,56.521C87.051,405.186,105.455,433.369,132.895,433.369z"/>
<path style="fill:#71C5DB;" d="M125.213,388.526l8.394-63.134c0.293-2.201,1.508-3.91,3.124-4.959
c-3.22-1.521-7.419-0.493-9.29,3.108l-29.355,56.521c-11.036,25.124,7.367,53.307,34.809,53.307l0,0
c7.538,0,14.4-2.085,20.209-5.612C136.59,423.188,123.934,407.592,125.213,388.526z"/>
<ellipse style="fill:#656566;" cx="337.038" cy="265.869" rx="23.349" ry="29.769"/>
<path style="fill:#4F4F51;" d="M354.893,283.325c-12.894,0-23.349-13.328-23.349-29.769c0-6.508,1.643-12.523,4.422-17.423
c-12.398,0.713-22.28,13.751-22.28,29.735c0,16.441,10.453,29.769,23.349,29.769c7.79,0,14.685-4.869,18.927-12.346
C355.608,283.311,355.252,283.325,354.893,283.325z"/></svg>
</div>
<h1>Problemi con la rete!</h1>
<p>Hey amico, sembra che tu sia offline. Perchè non controlli di avere la rete accesa?</p>
<button onclick = "window.location.reload()">Riprova!</button>
</body>
</html>