1
0
mirror of https://github.com/lana-k/sqliteviz.git synced 2025-12-07 02:28:54 +08:00
Files
sqliteviz/index.html
2021-05-05 19:58:24 +00:00

60 lines
2.5 KiB
HTML

<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=favicon.png><link rel=manifest href=manifest.webmanifest><title>sqliteviz</title><style>#sqliteviz-loading-wrapper {
position: fixed;
width: 100%;
height: 100%;
left: 0;
top: 0;
background-color: white;
}
#sqliteviz-loading-text {
display: block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #506784;
font-family: sans-serif;
font-size: 20px;
}
#sqliteviz-loading-wrapper svg {
display: block;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
#sqliteviz-loading-wrapper circle {
position: absolute;
left: 0; right: 0; top: 0; bottom: 0;
fill: none;
stroke-width: 5px;
stroke-linecap: round;
stroke: #119DFF;
}
#sqliteviz-loading-wrapper circle.bg {
stroke: #C8D4E3;
}
#sqliteviz-loading-wrapper circle.front {
stroke-dasharray: 402px;
animation: sqliteviz-loading 2s linear 0s infinite;
}
@keyframes sqliteviz-loading {
0% {
stroke-dasharray: 100px 402px;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 251px;
stroke-dashoffset: -251px;
}
100% {
stroke-dasharray: 100px 402px;
stroke-dashoffset: -502px;
}
}</style><link href=js/chunk-60cbf026.37d9df6c.js rel=prefetch><link href=css/app.1fe595c1.css rel=preload as=style><link href=css/chunk-vendors.2ea47787.css rel=preload as=style><link href=js/app.ca3fc277.js rel=preload as=script><link href=js/chunk-vendors.977d71ff.js rel=preload as=script><link href=css/chunk-vendors.2ea47787.css rel=stylesheet><link href=css/app.1fe595c1.css rel=stylesheet></head><body><noscript><strong>We're sorry but sqliteviz doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app><div id=sqliteviz-loading-wrapper><div id=sqliteviz-loading-text>LOADING</div><svg height=170 width=170 viewBox="0 0 170 170"><circle class=bg cx=85 cy=85 r=80 /><circle class=front cx=85 cy=85 r=80 /></svg></div></div><script src=js/chunk-vendors.977d71ff.js></script><script src=js/app.ca3fc277.js></script></body></html>