Skip to content
This repository was archived by the owner on Dec 24, 2022. It is now read-only.

Commit 9c42eef

Browse files
offline html file added
1 parent 71796eb commit 9c42eef

File tree

4 files changed

+59
-8
lines changed

4 files changed

+59
-8
lines changed

public/index.html

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,13 @@
77
<meta name="theme-color" content="#000000" />
88
<meta name="description" content="Todo App" />
99
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
10+
<!-- <link rel="apple-touch-icon" href="./logo192.png" /> -->
1011
<!--
1112
manifest.json provides metadata used when your web app is installed on a
1213
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
1314
-->
1415
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
16+
<!-- <link rel="manifest" href="./manifest.json" /> -->
1517
<!--
1618
Notice the use of %PUBLIC_URL% in the tags above.
1719
It will be replaced with the URL of the `public` folder during the build.
@@ -40,7 +42,9 @@
4042
if ('serviceWorker' in navigator) {
4143
window.addEventListener('load', () => {
4244
navigator.serviceWorker
43-
.register('./serviceworker.js')
45+
.register('./serviceworker.js', {
46+
// scope: '.', // <--- THIS BIT IS REQUIRED
47+
})
4448
.then((reg) => console.log('Success: ', reg.scope))
4549
.catch((err) => console.log('Failure: ', err));
4650
});

public/manifest.json

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,28 @@
11
{
2-
"short_name": "React App",
3-
"name": "Create React App Sample",
2+
"short_name": "Todo App",
3+
"name": "Todo App PWA",
44
"icons": [
55
{
66
"src": "favicon.ico",
77
"sizes": "64x64 32x32 24x24 16x16",
8-
"type": "image/x-icon"
8+
"type": "image/x-icon",
9+
"purpose": "any maskable"
910
},
1011
{
1112
"src": "logo192.png",
1213
"type": "image/png",
13-
"sizes": "192x192"
14+
"sizes": "192x192",
15+
"purpose": "any maskable"
1416
},
1517
{
1618
"src": "logo512.png",
1719
"type": "image/png",
18-
"sizes": "512x512"
20+
"sizes": "512x512",
21+
"purpose": "any maskable"
1922
}
2023
],
2124
"start_url": ".",
2225
"display": "standalone",
2326
"theme_color": "#000000",
2427
"background_color": "#ffffff"
25-
}
28+
}

public/offline.html

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>Weather App</title>
7+
<style type="text/css">
8+
html {
9+
height: 100%;
10+
}
11+
body {
12+
height: 100%;
13+
margin: 0;
14+
background: #0a1f44;
15+
display: flex;
16+
align-items: center;
17+
text-align: center;
18+
justify-content: center;
19+
}
20+
21+
.city {
22+
align-items: center;
23+
width: 80%;
24+
display: flex;
25+
justify-content: center;
26+
flex-direction: column;
27+
padding: 40px 8%;
28+
border-radius: 20px;
29+
background: #fff;
30+
}
31+
32+
.city-name {
33+
font-size: 2em;
34+
}
35+
</style>
36+
</head>
37+
<body>
38+
<div class="city">
39+
<h2 class="city-name">
40+
<span>Please go to online.</span>
41+
</h2>
42+
</div>
43+
</body>
44+
</html>

src/index.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,4 +21,4 @@ ReactDOM.render(
2121
// If you want your app to work offline and load faster, you can change
2222
// unregister() to register() below. Note this comes with some pitfalls.
2323
// Learn more about service workers: https://bit.ly/CRA-PWA
24-
serviceWorker.unregister();
24+
serviceWorker.register();

0 commit comments

Comments
 (0)