diff options
-rw-r--r-- | bskyweb/templates/base.html | 13 | ||||
-rw-r--r-- | src/App.web.tsx | 10 | ||||
-rw-r--r-- | web/index.html | 13 |
3 files changed, 34 insertions, 2 deletions
diff --git a/bskyweb/templates/base.html b/bskyweb/templates/base.html index cb0cea24b..311f2d3d9 100644 --- a/bskyweb/templates/base.html +++ b/bskyweb/templates/base.html @@ -47,6 +47,14 @@ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Liberation Sans", Helvetica, Arial, sans-serif; } + #preload { + width: 100px; + position: fixed; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + } + /* Buttons and inputs have a font set by UA, so we'll have to reset that */ button, input, textarea { font: inherit; @@ -262,6 +270,11 @@ </head> <body> {%- block body_all %} + <div id="preload"> + <!-- Bluesky SVG --> + <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 320"><path fill="#295ef6" d="M180 142c-16.3-31.7-60.7-90.8-102-120C38.5-5.9 23.4-1 13.5 3.4 2.1 8.6 0 26.2 0 36.5c0 10.4 5.7 84.8 9.4 97.2 12.2 41 55.7 55 95.7 50.5-58.7 8.6-110.8 30-42.4 106.1 75.1 77.9 103-16.7 117.3-64.6 14.3 48 30.8 139 116 64.6 64-64.6 17.6-97.5-41.1-106.1 40 4.4 83.5-9.5 95.7-50.5 3.7-12.4 9.4-86.8 9.4-97.2 0-10.3-2-27.9-13.5-33C336.5-1 321.5-6 282 22c-41.3 29.2-85.7 88.3-102 120Z"/></svg> + </div> + <div id="root"></div> <noscript> <h1 lang="en">JavaScript Required</h1> diff --git a/src/App.web.tsx b/src/App.web.tsx index 0fed089cb..39790a448 100644 --- a/src/App.web.tsx +++ b/src/App.web.tsx @@ -110,9 +110,15 @@ function InnerApp() { function App() { const [isReady, setReady] = useState(false) - + React.useEffect(() => { - initPersistedState().then(() => setReady(true)) + initPersistedState().then(() => { + setReady(true) + + const preloadElement = document.getElementById('preload'); + preloadElement.remove(); + }) + }, []) if (!isReady) { diff --git a/web/index.html b/web/index.html index b059e69e9..11d5b966e 100644 --- a/web/index.html +++ b/web/index.html @@ -51,6 +51,14 @@ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Liberation Sans", Helvetica, Arial, sans-serif; } + #preload { + width: 100px; + position: fixed; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + } + /* Buttons and inputs have a font set by UA, so we'll have to reset that */ button, input, textarea { font: inherit; @@ -301,6 +309,11 @@ </div> </form> </noscript> + <div id="preload"> + <!-- Bluesky SVG --> + <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 320"><path fill="#295ef6" d="M180 142c-16.3-31.7-60.7-90.8-102-120C38.5-5.9 23.4-1 13.5 3.4 2.1 8.6 0 26.2 0 36.5c0 10.4 5.7 84.8 9.4 97.2 12.2 41 55.7 55 95.7 50.5-58.7 8.6-110.8 30-42.4 106.1 75.1 77.9 103-16.7 117.3-64.6 14.3 48 30.8 139 116 64.6 64-64.6 17.6-97.5-41.1-106.1 40 4.4 83.5-9.5 95.7-50.5 3.7-12.4 9.4-86.8 9.4-97.2 0-10.3-2-27.9-13.5-33C336.5-1 321.5-6 282 22c-41.3 29.2-85.7 88.3-102 120Z"/></svg> + </div> + <!-- The root element for your Expo app. --> <div id="root"></div> </body> |