TF-2135 Add splash screen for web

(cherry picked from commit da3c6133d7ae9210dd7dcbe98470f1836cea8e33)
2023-09-13 18:27:12 +07:00
parent 5f053be2de
commit fa589fc81c
21 changed files with 105 additions and 1 deletions
@@ -0,0 +1,80 @@
+html {
+  height: 100%
+}
+
+body {
+  margin: 0;
+  min-height: 100%;
+  background-color: #000000;
+  background-size: 100% 100%;
+}
+
+.center {
+  margin: 0;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  -ms-transform: translate(-50%, -50%);
+  transform: translate(-50%, -50%);
+}
+
+.contain {
+  display:block;
+  width:100%;
+  height:100%;
+  object-fit: contain;
+}
+
+.stretch {
+  display:block;
+  width:100%;
+  height:100%;
+}
+
+.cover {
+  display:block;
+  width:100%;
+  height:100%;
+  object-fit: cover;
+}
+
+.bottom {
+  position: absolute;
+  bottom: 5%;
+  left: 50%;
+  -ms-transform: translate(-50%, 0);
+  transform: translate(-50%, 0);
+}
+
+.bottomLeft {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+}
+
+.bottomRight {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+}
+
+.loader {
+  margin: 16px;
+  border: 2px solid #f3f3f3;
+  border-radius: 50%;
+  border-top: 2px solid #007AFF;
+  width: 18px;
+  height: 18px;
+  -webkit-animation: spin 2s linear infinite;
+  animation: spin 2s linear infinite;
+}
+
+@-webkit-keyframes spin {
+  0% { -webkit-transform: rotate(0deg); }
+  100% { -webkit-transform: rotate(360deg); }
+}
+
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}