diff --git a/components/layout.js b/components/layout.js index fa7028b..126d98c 100644 --- a/components/layout.js +++ b/components/layout.js @@ -4,6 +4,7 @@ import Head from 'next/head' export default ({ title = 'Ardent Industry – Trade & Exploration', loading = false, + loadingText, children }) => <> @@ -14,6 +15,6 @@ export default ({ - + {children} diff --git a/components/loader.js b/components/loader.js index b80f885..0668df3 100644 --- a/components/loader.js +++ b/components/loader.js @@ -1,7 +1,7 @@ -export default function Loader ({ visible }) { +export default function Loader ({ visible, text}) { return ( <> - {/*
*/} +
@@ -36,6 +36,7 @@ export default function Loader ({ visible }) {
+ {text &&
{text}
} ) } diff --git a/css/components/loader.css b/css/components/loader.css index 053a2e4..520bf4f 100644 --- a/css/components/loader.css +++ b/css/components/loader.css @@ -1,7 +1,7 @@ /* CSS specific to the loader animation */ .loader__spinner { - position: absolute; + position: fixed; top: 50%; left: 0; width: 100%; @@ -17,7 +17,7 @@ } .loader__spinner::before { - position: absolute; + position: fixed; top: -1.8rem; height: 9rem; width: 9rem; @@ -28,14 +28,36 @@ filter: blur(3rem); } +.loader__text { + position: fixed; + top: 50%; + left: 0; + width: 100%; + margin-top: 4rem; + display: flex; + flex-direction: column; + align-items: center; + zoom: 1.5; + transition: .25s ease-in-out; + z-index: 3000; + pointer-events: none; + text-align: center; + text-shadow: 0 0 .5rem #000; + font-family: 'Jura'; + font-synthesis: weight; + font-weight: bold; + text-transform: uppercase; + font-size: .8rem; +} + .loader__background { z-index: 2999; - position: absolute; + position: fixed; top: 0; bottom: 0; left: 0; right: 0; - background: rgba(0,0,0,.05); + background: rgba(0,0,0,.5); backdrop-filter: blur(.05rem); box-shadow: inset 0 0 10rem rgba(0,0,0,.5); border-radius: .2rem; diff --git a/package.json b/package.json index 4073eb7..7a4f100 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ardent-www", - "version": "0.45.3", + "version": "0.45.4", "description": "Ardent Industry", "main": "index.js", "scripts": { diff --git a/pages/commodities.js b/pages/commodities.js index 852679f..018dce9 100644 --- a/pages/commodities.js +++ b/pages/commodities.js @@ -27,7 +27,7 @@ export default () => { }, []) return ( - + diff --git a/pages/commodity/[commodity-name]/index.js b/pages/commodity/[commodity-name]/index.js index f5eed0e..bc10b7a 100644 --- a/pages/commodity/[commodity-name]/index.js +++ b/pages/commodity/[commodity-name]/index.js @@ -109,7 +109,7 @@ export default () => { }, []) return ( - + diff --git a/pages/system/[system-name]/index.js b/pages/system/[system-name]/index.js index 7be1ef3..ae9dd8c 100644 --- a/pages/system/[system-name]/index.js +++ b/pages/system/[system-name]/index.js @@ -154,7 +154,7 @@ export default () => { }, [router.query['system-name']]) return ( - +