Convert project to TypeScript; add workflow to build with Vite then publish to GH Pages.

2026-07-20 11:18:19 -03:00 · 2026-07-20 11:18:19 -03:00 · e615234325
commit e615234325
parent 932e63e299
30 changed files with 1932 additions and 443 deletions
--- a/web/loading.css
+++ b/web/loading.css
@ -0,0 +1,116 @@
+.loading-animation-wrapper {
+  width: 200px;
+  height: 40px;
+  margin: 10px auto 0 auto;
+  padding-top: 4px;
+}
+.loading-animation-wrapper .caption {
+  margin: 0;
+  padding: 0;
+  text-align: center;
+  color: #fff;
+  font: 12px/1.4em Arial;
+}
+.loading-animation-wrapper .dot {
+  position: relative;
+  display: inline-block;
+  width: 10px;
+  height: 10px;
+  background: #fff;
+  -moz-border-radius: 100%;
+  -webkit-border-radius: 100%;
+  border-radius: 100%;
+  -moz-animation: movingdot 4s infinite;
+  -webkit-animation: movingdot 4s infinite;
+  animation: movingdot 4s infinite;
+  -moz-animation-timing-function: cubic-bezier(0.03, 0.615, 0.995, 0.415);
+  -webkit-animation-timing-function: cubic-bezier(0.03, 0.615, 0.995, 0.415);
+  animation-timing-function: cubic-bezier(0.03, 0.615, 0.995, 0.415);
+  -moz-animation-fill-mode: both;
+  -webkit-animation-fill-mode: both;
+  animation-fill-mode: both;
+}
+.loading-animation-wrapper .dot:nth-child(1) {
+  -moz-animation-delay: 1s;
+  -webkit-animation-delay: 1s;
+  animation-delay: 1s;
+}
+.loading-animation-wrapper .dot:nth-child(2) {
+  -moz-animation-delay: 0.9s;
+  -webkit-animation-delay: 0.9s;
+  animation-delay: 0.9s;
+}
+.loading-animation-wrapper .dot:nth-child(3) {
+  -moz-animation-delay: 0.8s;
+  -webkit-animation-delay: 0.8s;
+  animation-delay: 0.8s;
+}
+.loading-animation-wrapper .dot:nth-child(4) {
+  -moz-animation-delay: 0.7s;
+  -webkit-animation-delay: 0.7s;
+  animation-delay: 0.7s;
+}
+.loading-animation-wrapper .dot:nth-child(5) {
+  -moz-animation-delay: 0.6s;
+  -webkit-animation-delay: 0.6s;
+  animation-delay: 0.6s;
+}
+
+@-moz-keyframes movingdot {
+  0% {
+    -moz-transform: translateX(-30px);
+    transform: translateX(-30px);
+    opacity: 0;
+  }
+  25% {
+    opacity: 1;
+  }
+  50% {
+    -moz-transform: translateX(200px);
+    transform: translateX(200px);
+    opacity: 0;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+@-webkit-keyframes movingdot {
+  0% {
+    -webkit-transform: translateX(-30px);
+    transform: translateX(-30px);
+    opacity: 0;
+  }
+  25% {
+    opacity: 1;
+  }
+  50% {
+    -webkit-transform: translateX(200px);
+    transform: translateX(200px);
+    opacity: 0;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+@keyframes movingdot {
+  0% {
+    -moz-transform: translateX(-30px);
+    -ms-transform: translateX(-30px);
+    -webkit-transform: translateX(-30px);
+    transform: translateX(-30px);
+    opacity: 0;
+  }
+  25% {
+    opacity: 1;
+  }
+  50% {
+    -moz-transform: translateX(200px);
+    -ms-transform: translateX(200px);
+    -webkit-transform: translateX(200px);
+    transform: translateX(200px);
+    opacity: 0;
+  }
+  100% {
+    opacity: 0;
+  }
+}