| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172 |
- <!DOCTYPE html>
- <html>
- <head>
- <base href="./">
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <title>Preserver</title>
- <link href="css/bootstrap.min.css" rel="stylesheet">
- <link href="css/material.min.css" rel="stylesheet">
- <link href="css/font-awesome.min.css" rel="stylesheet">
- <link href="css/animate.css" rel="stylesheet">
- <link href="css/styles.css" rel="stylesheet">
- </head>
- <body>
- <my-app>
- <div class="loaders-container">
- <div class="spinner">
- <div class="circle"></div>
- </div>
- </div>
- <style>
- body {
- background: #009688;
- }
- .loaders-container {
- width: 100%;
- height: 100%;
- }
- .loaders-container .spinner {
- box-sizing: border-box;
- width: 80px;
- height: 80px;
- position: absolute;
- left: 50%;
- top: 50%;
- z-index: 1;
- margin-top: -35px;
- margin-left: -35px;
- }
- .circle {
- box-sizing: border-box;
- width: 80px;
- height: 80px;
- border-radius: 100%;
- border: 5px solid rgba(255, 255, 255, 0.2);
- border-top-color: #FFF;
- -webkit-animation: spin 1s infinite linear;
- animation: spin 1s infinite linear;
- }
- @-webkit-keyframes spin {
- 100% {
- -webkit-transform: rotate(360deg);
- transform: rotate(360deg);
- }
- }
- @keyframes spin {
- 100% {
- -webkit-transform: rotate(360deg);
- transform: rotate(360deg);
- }
- }
- </style>
- </my-app>
- <script src="js/jquery.min.js"></script>
- <script src="js/bootstrap.min.js"></script>
- <script src="js/material.js"></script>
- <script src="js/index.js"></script>
- <script src="js/polyfills.js"></script>
- <script src="js/vendor.js"></script>
- <script src="js/app.js"></script>
- </body>
- </html>
|