Skip to content

Commit a6aa0f1

Browse files
authored
Added loading splash screen (#888)
1 parent 2377959 commit a6aa0f1

File tree

12 files changed

+145
-12
lines changed

12 files changed

+145
-12
lines changed

portal-ui/build/asset-manifest.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
{
22
"files": {
33
"main.css": "/static/css/main.8cfac526.chunk.css",
4-
"main.js": "/static/js/main.a608e767.chunk.js",
5-
"main.js.map": "/static/js/main.a608e767.chunk.js.map",
4+
"main.js": "/static/js/main.439bfd00.chunk.js",
5+
"main.js.map": "/static/js/main.439bfd00.chunk.js.map",
66
"runtime-main.js": "/static/js/runtime-main.43a31377.js",
77
"runtime-main.js.map": "/static/js/runtime-main.43a31377.js.map",
88
"static/css/2.c5a51b70.chunk.css": "/static/css/2.c5a51b70.chunk.css",
@@ -20,6 +20,6 @@
2020
"static/css/2.c5a51b70.chunk.css",
2121
"static/js/2.55ef6ad7.chunk.js",
2222
"static/css/main.8cfac526.chunk.css",
23-
"static/js/main.a608e767.chunk.js"
23+
"static/js/main.439bfd00.chunk.js"
2424
]
2525
}

portal-ui/build/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
<!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="#000000"/><meta name="description" content="MinIO Console"/><link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;500;700;900&display=swap" rel="stylesheet"/><link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png"/><link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"/><link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png"/><link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"/><link rel="manifest" href="/manifest.json"/><link rel="mask-icon" href="/safari-pinned-tab.svg" color="#3a4e54"/><title>MinIO Console</title><link href="/static/css/2.c5a51b70.chunk.css" rel="stylesheet"><link href="/static/css/main.8cfac526.chunk.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script>!function(e){function r(r){for(var n,l,i=r[0],a=r[1],p=r[2],c=0,s=[];c<i.length;c++)l=i[c],Object.prototype.hasOwnProperty.call(o,l)&&o[l]&&s.push(o[l][0]),o[l]=0;for(n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n]);for(f&&f(r);s.length;)s.shift()();return u.push.apply(u,p||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,i=1;i<t.length;i++){var a=t[i];0!==o[a]&&(n=!1)}n&&(u.splice(r--,1),e=l(l.s=t[0]))}return e}var n={},o={1:0},u=[];function l(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,l),t.l=!0,t.exports}l.m=e,l.c=n,l.d=function(e,r,t){l.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},l.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.t=function(e,r){if(1&r&&(e=l(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(l.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)l.d(t,n,function(r){return e[r]}.bind(null,n));return t},l.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return l.d(r,"a",r),r},l.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},l.p="/";var i=this["webpackJsonpportal-ui"]=this["webpackJsonpportal-ui"]||[],a=i.push.bind(i);i.push=r,i=i.slice();for(var p=0;p<i.length;p++)r(i[p]);var f=a;t()}([])</script><script src="/static/js/2.55ef6ad7.chunk.js"></script><script src="/static/js/main.a608e767.chunk.js"></script></body></html>
1+
<!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="#000000"/><meta name="description" content="MinIO Console"/><link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;500;700;900&display=swap" rel="stylesheet"/><link href="/styles/root-styles.css" rel="stylesheet"/><link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png"/><link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"/><link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png"/><link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"/><link rel="manifest" href="/manifest.json"/><link rel="mask-icon" href="/safari-pinned-tab.svg" color="#3a4e54"/><title>MinIO Console</title><link href="/static/css/2.c5a51b70.chunk.css" rel="stylesheet"><link href="/static/css/main.8cfac526.chunk.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"><div id="loader-block"><svg class="loader-svg-container" viewBox="22 22 44 44"><circle class="loader-style MuiCircularProgress-circle MuiCircularProgress-circleIndeterminate" cx="44" cy="44" r="20.2" fill="none" stroke-width="3.6"></circle></svg></div></div><script>!function(e){function r(r){for(var n,l,i=r[0],a=r[1],p=r[2],c=0,s=[];c<i.length;c++)l=i[c],Object.prototype.hasOwnProperty.call(o,l)&&o[l]&&s.push(o[l][0]),o[l]=0;for(n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n]);for(f&&f(r);s.length;)s.shift()();return u.push.apply(u,p||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,i=1;i<t.length;i++){var a=t[i];0!==o[a]&&(n=!1)}n&&(u.splice(r--,1),e=l(l.s=t[0]))}return e}var n={},o={1:0},u=[];function l(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,l),t.l=!0,t.exports}l.m=e,l.c=n,l.d=function(e,r,t){l.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},l.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.t=function(e,r){if(1&r&&(e=l(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(l.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)l.d(t,n,function(r){return e[r]}.bind(null,n));return t},l.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return l.d(r,"a",r),r},l.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},l.p="/";var i=this["webpackJsonpportal-ui"]=this["webpackJsonpportal-ui"]||[],a=i.push.bind(i);i.push=r,i=i.slice();for(var p=0;p<i.length;p++)r(i[p]);var f=a;t()}([])</script><script src="/static/js/2.55ef6ad7.chunk.js"></script><script src="/static/js/main.439bfd00.chunk.js"></script></body></html>

portal-ui/build/static/js/main.439bfd00.chunk.js

Lines changed: 2 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

portal-ui/build/static/js/main.439bfd00.chunk.js.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

portal-ui/build/static/js/main.a608e767.chunk.js

Lines changed: 0 additions & 2 deletions
This file was deleted.

portal-ui/build/static/js/main.a608e767.chunk.js.map

Lines changed: 0 additions & 1 deletion
This file was deleted.
Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
body {
2+
margin: 0;
3+
font-family: "Lato", sans-serif;
4+
-webkit-font-smoothing: antialiased;
5+
-moz-osx-font-smoothing: grayscale;
6+
}
7+
8+
#loader-block {
9+
display: flex;
10+
flex-direction: column;
11+
width: 100%;
12+
height: 100vh;
13+
justify-content: center;
14+
align-items: center;
15+
}
16+
17+
#loader-block .loader-svg-container {
18+
display: block;
19+
width: 40px;
20+
height: 40px;
21+
margin-bottom: 15px;
22+
animation: loader-container-keyframes 1.4s linear infinite;
23+
}
24+
25+
#loader-block .loader-svg-container .loader-style {
26+
stroke: #073052;
27+
animation: animation-keyframes 1.4s ease-in-out infinite;
28+
stroke-dasharray: 80px, 200px;
29+
stroke-dashoffset: 0px;
30+
}
31+
32+
@keyframes animation-keyframes {
33+
0% {
34+
stroke-dasharray: 1px, 200px;
35+
stroke-dashoffset: 0px;
36+
}
37+
50% {
38+
stroke-dasharray: 100px, 200px;
39+
stroke-dashoffset: -15px;
40+
}
41+
100% {
42+
stroke-dasharray: 100px, 200px;
43+
stroke-dashoffset: -125px;
44+
}
45+
}
46+
47+
@keyframes loader-container-keyframes {
48+
0% {
49+
transform-origin: 50% 50%;
50+
}
51+
100% {
52+
transform: rotate(360deg);
53+
}
54+
}

portal-ui/public/index.html

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@
1313
href="https://fonts.googleapis.com/css2?family=Lato:wght@400;500;700;900&display=swap"
1414
rel="stylesheet"
1515
/>
16+
<link href="%PUBLIC_URL%/styles/root-styles.css" rel="stylesheet" />
1617
<link
1718
rel="apple-touch-icon"
1819
sizes="180x180"
@@ -55,7 +56,23 @@
5556
</head>
5657
<body>
5758
<noscript>You need to enable JavaScript to run this app.</noscript>
58-
<div id="root"></div>
59+
<div id="root">
60+
<div id="loader-block">
61+
<svg class="loader-svg-container" viewBox="22 22 44 44">
62+
<circle
63+
class="
64+
loader-style
65+
MuiCircularProgress-circle MuiCircularProgress-circleIndeterminate
66+
"
67+
cx="44"
68+
cy="44"
69+
r="20.2"
70+
fill="none"
71+
stroke-width="3.6"
72+
></circle>
73+
</svg>
74+
</div>
75+
</div>
5976
<!--
6077
This HTML file is a template.
6178
If you open it directly in the browser, you will see an empty page.
Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
body {
2+
margin: 0;
3+
font-family: "Lato", sans-serif;
4+
-webkit-font-smoothing: antialiased;
5+
-moz-osx-font-smoothing: grayscale;
6+
}
7+
8+
#loader-block {
9+
display: flex;
10+
flex-direction: column;
11+
width: 100%;
12+
height: 100vh;
13+
justify-content: center;
14+
align-items: center;
15+
}
16+
17+
#loader-block .loader-svg-container {
18+
display: block;
19+
width: 40px;
20+
height: 40px;
21+
margin-bottom: 15px;
22+
animation: loader-container-keyframes 1.4s linear infinite;
23+
}
24+
25+
#loader-block .loader-svg-container .loader-style {
26+
stroke: #073052;
27+
animation: animation-keyframes 1.4s ease-in-out infinite;
28+
stroke-dasharray: 80px, 200px;
29+
stroke-dashoffset: 0px;
30+
}
31+
32+
@keyframes animation-keyframes {
33+
0% {
34+
stroke-dasharray: 1px, 200px;
35+
stroke-dashoffset: 0px;
36+
}
37+
50% {
38+
stroke-dasharray: 100px, 200px;
39+
stroke-dashoffset: -15px;
40+
}
41+
100% {
42+
stroke-dasharray: 100px, 200px;
43+
stroke-dashoffset: -125px;
44+
}
45+
}
46+
47+
@keyframes loader-container-keyframes {
48+
0% {
49+
transform-origin: 50% 50%;
50+
}
51+
100% {
52+
transform: rotate(360deg);
53+
}
54+
}

portal-ui/src/index.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,6 @@ ReactDOM.render(
6464
<Provider store={configureStore()}>
6565
<GlobalCss />
6666
<ThemeProvider theme={theme}>
67-
{/*<ThemeProvider theme={newTheme}>*/}
6867
<Routes />
6968
</ThemeProvider>
7069
</Provider>,

0 commit comments

Comments
 (0)