index.html 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. <!doctype html><html lang=""><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="renderer" content="webkit"/><meta name="force-rendering" content="webkit"/><link rel="icon" href="/favicon.ico"/><title>乐教通</title><script>if (!!window.ActiveXObject || "ActiveXObject" in window) {
  2. window.location.href = "./ieIncompatible/index.html"
  3. }</script><script defer="defer" src="/js/chunk-vendors.6027bb07.js"></script><script defer="defer" src="/js/app.9a079062.js"></script><link href="/css/app.57a02910.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but classroom doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"><style>.firstLoading {
  4. position: fixed;
  5. left: 50%;
  6. top: 50%;
  7. transform: translate(-50%, -50%);
  8. height: 58px;
  9. width: 58px;
  10. }
  11. .firstLoading .circular {
  12. display: inline;
  13. height: 100%;
  14. width: 100%;
  15. animation: loading-rotate 2s linear infinite;
  16. }
  17. .firstLoading .circular .path {
  18. animation: loading-dash 1.5s ease-in-out infinite;
  19. stroke-dasharray: 90, 150;
  20. stroke-dashoffset: 0;
  21. stroke-width: 4;
  22. stroke: #f5c42d;
  23. stroke-linecap: round;
  24. }
  25. @keyframes loading-rotate {
  26. to {
  27. transform: rotate(360deg);
  28. }
  29. }
  30. @keyframes loading-dash {
  31. 0% {
  32. stroke-dasharray: 1, 200;
  33. stroke-dashoffset: 0;
  34. }
  35. 50% {
  36. stroke-dasharray: 90, 150;
  37. stroke-dashoffset: -40px;
  38. }
  39. to {
  40. stroke-dasharray: 90, 150;
  41. stroke-dashoffset: -120px;
  42. }
  43. }</style><div class="firstLoading"><svg class="circular" viewBox="0 0 50 50"><circle class="path" cx="25" cy="25" r="20" fill="none"></circle></svg></div></div></body></html>