[POC] use serviceWorker from create-react-app (#1286)

* Service worker with toast notifications

* Update CSP to allow fetches from now.sh

* Fixed clearing timers

* rounded icon for pwa (#1301)

* rounded icon for pwa

* cirle pwa app icon

* fix fonts caching

* fix app

* fix css import

* Updated csp tp inlcude worker-src: self

* add worker CSP rule

* use square icon

Co-authored-by: Timur Khazamov <t1mmaas@skbkontur.ru>
Co-authored-by: Faustino Kialungila <Faustino.kialungila@gmail.com>
Co-authored-by: kbariotis <konmpar@gmail.com>

public/fonts.css

@@ -1,13 +0,0 @@
-/* http://www.eaglefonts.com/fg-virgil-ttf-131249.htm */
-@font-face {
-  font-family: "Virgil";
-  src: url("FG_Virgil.woff2");
-  font-display: swap;
-}
-
-/* https://github.com/microsoft/cascadia-code */
-@font-face {
-  font-family: "Cascadia";
-  src: url("Cascadia.woff2");
-  font-display: swap;
-}

public/index.html

@@ -9,6 +9,8 @@
     />
     <meta name="referrer" content="origin" />
     <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="mobile-web-app-capable" content="yes" />
+    <meta name="apple-touch-fullscreen" content="yes" />
 
     <meta name="theme-color" content="#000000" />
 
@@ -64,24 +66,9 @@
     <meta name="twitter:image" content="https://excalidraw.com/og-image.png" />
     <meta
       http-equiv="Content-Security-Policy"
-      content="block-all-mixed-content; child-src 'self' https://codesandbox.io https://*.csb.app; connect-src 'self' https: wss: http: ws:; default-src 'self'; font-src 'self' data: https: filesystem:; img-src 'self' data: https:; script-src 'self' 'unsafe-inline' 'unsafe-eval' https://www.googletagmanager.com https://www.google-analytics.com https://codesandbox.io https://*.csb.app https://cdnjs.cloudflare.com; style-src 'self' 'unsafe-inline' https:;"
+      content="block-all-mixed-content; child-src 'self' https://codesandbox.io https://*.csb.app; worker-src 'self'; connect-src 'self' https: wss: http: ws:; default-src 'self'; font-src 'self' data: https: filesystem:; img-src 'self' data: https:; script-src 'self' 'unsafe-inline' 'unsafe-eval' https://www.googletagmanager.com https://www.google-analytics.com https://codesandbox.io https://*.csb.app https://cdnjs.cloudflare.com; style-src 'self' 'unsafe-inline' https:;"
     />
     <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
-    <link rel="stylesheet" href="fonts.css" />
-    <link
-      rel="preload"
-      href="FG_Virgil.woff2"
-      as="font"
-      type="font/woff2"
-      crossorigin="anonymous"
-    />
-    <link
-      rel="preload"
-      href="Cascadia.woff2"
-      as="font"
-      type="font/woff2"
-      crossorigin="anonymous"
-    />
     <link
       href="https://excalidraw-socket.herokuapp.com/socket.io"
       rel="preconnect"