2025-02-06 19:17:53 +00:00
|
|
|
{% load i18n %}
|
|
|
|
{% get_current_language as LANGUAGE_CODE %}
|
2023-05-20 11:01:18 -04:00
|
|
|
<!DOCTYPE html>
|
2025-02-06 19:17:53 +00:00
|
|
|
<html lang="{{ LANGUAGE_CODE }}">
|
2023-05-20 11:01:18 -04:00
|
|
|
<head>
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
2024-05-19 16:32:59 -04:00
|
|
|
<title>☃ NeoDB is being renovated...</title>
|
2023-05-20 11:01:18 -04:00
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div class="pl">
|
|
|
|
<div class="pl__outer-ring"></div>
|
|
|
|
<div class="pl__inner-ring">
|
2024-05-19 16:32:59 -04:00
|
|
|
<center>NeoDB is being renovated...</center>
|
2023-05-20 11:01:18 -04:00
|
|
|
</div>
|
|
|
|
<div class="pl__track-cover"></div>
|
|
|
|
<div class="pl__ball">
|
|
|
|
<div class="pl__ball-texture"></div>
|
|
|
|
<div class="pl__ball-outer-shadow"></div>
|
|
|
|
<div class="pl__ball-inner-shadow"></div>
|
|
|
|
<div class="pl__ball-side-shadows"></div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<style>
|
2023-01-07 12:00:09 -05:00
|
|
|
* {
|
|
|
|
border: 0;
|
|
|
|
box-sizing: border-box;
|
|
|
|
margin: 0;
|
|
|
|
padding: 0;
|
|
|
|
}
|
|
|
|
:root {
|
|
|
|
font-size: calc(16px + (20 - 16) * (100vw - 320px) / (1280 - 320));
|
|
|
|
}
|
|
|
|
body {
|
|
|
|
background-color: hsl(223, 90%, 95%);
|
|
|
|
font: 1em/1.5 sans-serif;
|
|
|
|
height: 100vh;
|
|
|
|
display: grid;
|
|
|
|
place-items: center;
|
|
|
|
}
|
|
|
|
center {
|
|
|
|
text-shadow: 0 25px 13px #fff, 0 2px 8px #eee, 0 2px 20px #ddd;
|
|
|
|
color: #666;
|
|
|
|
font-size: 1.2em;
|
|
|
|
font-family: sans-serif;
|
|
|
|
|
|
|
|
}
|
|
|
|
.pl,
|
|
|
|
.pl__ball,
|
|
|
|
.pl__ball-inner-shadow,
|
|
|
|
.pl__ball-side-shadows,
|
|
|
|
.pl__ball-texture,
|
|
|
|
.pl__inner-ring,
|
|
|
|
.pl__outer-ring,
|
|
|
|
.pl__track-cover {
|
|
|
|
border-radius: 50%;
|
|
|
|
}
|
|
|
|
.pl {
|
|
|
|
position: relative;
|
|
|
|
width: 16em;
|
|
|
|
height: 16em;
|
|
|
|
}
|
|
|
|
.pl__ball,
|
|
|
|
.pl__ball-inner-shadow,
|
|
|
|
.pl__ball-outer-shadow,
|
|
|
|
.pl__ball-side-shadows,
|
|
|
|
.pl__ball-texture,
|
|
|
|
.pl__ball-texture:before,
|
|
|
|
.pl__inner-ring,
|
|
|
|
.pl__outer-ring,
|
|
|
|
.pl__track-cover {
|
|
|
|
position: absolute;
|
|
|
|
}
|
|
|
|
.pl__ball,
|
|
|
|
.pl__ball-inner-shadow,
|
|
|
|
.pl__ball-outer-shadow,
|
|
|
|
.pl__ball-texture:before,
|
|
|
|
.pl__track-cover {
|
|
|
|
animation: ball 12s linear infinite;
|
|
|
|
}
|
|
|
|
.pl__ball {
|
|
|
|
top: calc(50% - 1.25em);
|
|
|
|
left: calc(50% - 1.25em);
|
|
|
|
transform: rotate(0) translateY(-6.5em);
|
|
|
|
width: 2.5em;
|
|
|
|
height: 2.5em;
|
|
|
|
}
|
|
|
|
.pl__ball-inner-shadow {
|
|
|
|
animation-name: ballInnerShadow;
|
|
|
|
box-shadow:
|
|
|
|
0 0.1em 0.2em hsla(0, 0%, 0%, 0.3),
|
|
|
|
0 0 0.2em hsla(0, 0%, 0%, 0.1) inset,
|
|
|
|
0 -1em 0.5em hsla(0, 0%, 0%, 0.15) inset;
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
}
|
|
|
|
.pl__ball-outer-shadow {
|
|
|
|
animation-name: ballOuterShadow;
|
|
|
|
background-image: linear-gradient(hsla(0, 0%, 0%, 0.15),hsla(0, 0%, 0%, 0));
|
|
|
|
border-radius: 0 0 50% 50% / 0 0 100% 100%;
|
|
|
|
filter: blur(2px);
|
|
|
|
top: 50%;
|
|
|
|
left: 0;
|
|
|
|
width: 100%;
|
|
|
|
height: 250%;
|
|
|
|
transform: rotate(20deg);
|
|
|
|
transform-origin: 50% 0;
|
|
|
|
z-index: -2;
|
|
|
|
}
|
|
|
|
.pl__ball-side-shadows {
|
|
|
|
background-color: hsla(0, 0%, 0%, 0.1);
|
|
|
|
filter: blur(2px);
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
transform: scale(0.75,1.1);
|
|
|
|
z-index: -1;
|
|
|
|
}
|
|
|
|
.pl__ball-texture {
|
|
|
|
overflow: hidden;
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
transform: translate3d(0,0,0);
|
|
|
|
}
|
|
|
|
.pl__ball-texture:before {
|
|
|
|
animation-name: ballTexture;
|
|
|
|
animation-duration: 1.5s;
|
|
|
|
background: url(data:image/jpeg;base64,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
|
|
|
|
content: "";
|
|
|
|
display: block;
|
|
|
|
filter: brightness(1.05);
|
|
|
|
top: 0;
|
|
|
|
right: 0;
|
|
|
|
width: 200%;
|
|
|
|
height: 100%;
|
|
|
|
}
|
|
|
|
.pl__inner-ring {
|
|
|
|
box-shadow:
|
|
|
|
0 -0.25em 0.5em hsla(0, 0%, 100%, 0.4),
|
|
|
|
0 0.5em 0.75em hsla(0, 0%, 100%, 0.4) inset,
|
|
|
|
0 0.5em 0.375em hsla(0, 0%, 0%, 0.15),
|
|
|
|
0 -0.5em 0.75em hsla(0, 0%, 0%, 0.15) inset;
|
|
|
|
top: 2.375em;
|
|
|
|
left: 2.375em;
|
|
|
|
width: calc(100% - 4.75em);
|
|
|
|
height: calc(100% - 4.75em);
|
|
|
|
}
|
|
|
|
.pl__outer-ring {
|
|
|
|
box-shadow:
|
|
|
|
0 -0.45em 0.375em hsla(0, 0%, 0%, 0.15),
|
|
|
|
0 0.5em 0.75em hsla(0, 0%, 0%, 0.15) inset,
|
|
|
|
0 0.25em 0.5em hsla(0, 0%, 100%, 0.4),
|
|
|
|
0 -0.5em 0.75em hsla(0, 0%, 100%, 0.4) inset;
|
|
|
|
top: 0.75em;
|
|
|
|
left: 0.75em;
|
|
|
|
width: calc(100% - 1.5em);
|
|
|
|
height: calc(100% - 1.5em);
|
|
|
|
}
|
|
|
|
.pl__track-cover {
|
|
|
|
animation-name: trackCover;
|
|
|
|
background-image: conic-gradient(hsla(223, 90%, 95%, 1) 210deg, hsla(223, 90%, 95%, 0) 270deg);
|
|
|
|
top: 0;
|
|
|
|
left: 0;
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
backdrop-filter: blur(1px);
|
|
|
|
-webkit-backdrop-filter: blur(1px);
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Animations */
|
|
|
|
@keyframes ball {
|
|
|
|
from {
|
|
|
|
transform: rotate(0) translateY(-6.5em);
|
|
|
|
}
|
|
|
|
50% {
|
|
|
|
transform: rotate(180deg) translateY(-6em);
|
|
|
|
}
|
|
|
|
to {
|
|
|
|
transform: rotate(360deg) translateY(-6.5em);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
@keyframes ballInnerShadow {
|
|
|
|
from {
|
|
|
|
transform: rotate(0);
|
|
|
|
}
|
|
|
|
to {
|
|
|
|
transform: rotate(-360deg);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
@keyframes ballOuterShadow {
|
|
|
|
from {
|
|
|
|
transform: rotate(20deg);
|
|
|
|
}
|
|
|
|
to {
|
|
|
|
transform: rotate(-340deg);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
@keyframes ballTexture {
|
|
|
|
from {
|
|
|
|
transform: translateX(0);
|
|
|
|
}
|
|
|
|
to {
|
|
|
|
transform: translateX(50%);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
@keyframes trackCover {
|
|
|
|
from {
|
|
|
|
transform: rotate(0);
|
|
|
|
}
|
|
|
|
to {
|
|
|
|
transform: rotate(360deg);
|
|
|
|
}
|
|
|
|
}
|
2023-05-20 11:01:18 -04:00
|
|
|
</style>
|
|
|
|
<!-- CSS from https://jonkantner.com -->
|
|
|
|
</body>
|
|
|
|
</html>
|