<!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.0" />
      <meta name="renderer" content="webkit" />
      <meta name="force-rendering" content="webkit" />
      <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
      <title><%= process.env.VUE_APP_TITLE %></title>
      <script>
         if (!!window.ActiveXObject || "ActiveXObject" in window) {
            window.location.href = "./ieIncompatible/index.html"
         }
      </script>
   </head>
   <body>
      <noscript>
         <strong>
            We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.
         </strong>
      </noscript>
      <div id="app">
         <style>
            .firstLoading {
               position: fixed;
               left: 50%;
               top: 50%;
               transform: translate(-50%, -50%);
               height: 58px;
               width: 58px;
            }
            .firstLoading .circular {
               display: inline;
               height: 100%;
               width: 100%;
               animation: loading-rotate 2s linear infinite;
            }
            .firstLoading .circular .path {
               animation: loading-dash 1.5s ease-in-out infinite;
               stroke-dasharray: 90, 150;
               stroke-dashoffset: 0;
               stroke-width: 4;
               stroke: #f5c42d;
               stroke-linecap: round;
            }
            @keyframes loading-rotate {
               to {
                  transform: rotate(360deg);
               }
            }
            @keyframes loading-dash {
               0% {
                  stroke-dasharray: 1, 200;
                  stroke-dashoffset: 0;
               }
               50% {
                  stroke-dasharray: 90, 150;
                  stroke-dashoffset: -40px;
               }
               to {
                  stroke-dasharray: 90, 150;
                  stroke-dashoffset: -120px;
               }
            }
         </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>
      <!-- built files will be auto injected -->
   </body>
</html>
