templates/security/base.html.twig line 1

Open in your IDE?
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6. <title>Extranet Auto</title>
  7. <link rel="stylesheet" href="{{ asset('assets/app.css') }}" />
  8. <style>
  9. #loader {
  10. transition: all 0.3s ease-in-out;
  11. opacity: 1;
  12. visibility: visible;
  13. position: fixed;
  14. height: 100vh;
  15. width: 100%;
  16. background: #fff;
  17. z-index: 90000;
  18. }
  20. #loader.fadeOut {
  21. opacity: 0;
  22. visibility: hidden;
  23. }
  25. .spinner {
  26. width: 40px;
  27. height: 40px;
  28. position: absolute;
  29. top: calc(50% - 20px);
  30. left: calc(50% - 20px);
  31. background-color: #333;
  32. border-radius: 100%;
  33. -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
  34. animation: sk-scaleout 1.0s infinite ease-in-out;
  35. }
  37. @-webkit-keyframes sk-scaleout {
  38. 0% { -webkit-transform: scale(0) }
  39. 100% {
  40. -webkit-transform: scale(1.0);
  41. opacity: 0;
  42. }
  43. }
  45. @keyframes sk-scaleout {
  46. 0% {
  47. -webkit-transform: scale(0);
  48. transform: scale(0);
  49. } 100% {
  50. -webkit-transform: scale(1.0);
  51. transform: scale(1.0);
  52. opacity: 0;
  53. }
  54. }
  55. </style>
  56. </head>
  57. <body class="app">
  58. <div id='loader' style="display: none;">
  59. <div class="spinner"></div>
  60. </div>
  62. <script>
  63. window.addEventListener('load', () => {
  64. const loader = document.getElementById('loader');
  65. setTimeout(() => {
  66. loader.classList.add('fadeOut');
  67. }, 300);
  68. });
  69. </script>
  71. {% block body %}{% endblock body %}
  73. </body>
  74. <script src="{{ asset('assets/app.js') }}"></script>
  75. </html>