Spaces:
Running
Running
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>Loading RSS Feeds</title> | |
<style> | |
body { | |
font-family: 'Arial', sans-serif; | |
margin: 0; | |
padding: 20px; | |
background-color: #f5f5f5; | |
color: #333; | |
display: flex; | |
justify-content: center; | |
align-items: center; | |
height: 100vh; | |
} | |
.loading-message { | |
text-align: center; | |
font-size: 1.5em; | |
color: #2c3e50; | |
} | |
#loading { | |
display: block; | |
position: fixed; | |
top: 0; | |
left: 0; | |
width: 100%; | |
height: 100%; | |
background: rgba(0,0,0,0.5); | |
z-index: 1000; | |
} | |
.loader { | |
position: absolute; | |
top: 50%; | |
left: 50%; | |
transform: translate(-50%, -50%); | |
width: 50px; | |
height: 50px; | |
border: 5px solid #f3f3f3; | |
border-top: 5px solid #3498db; | |
border-radius: 50%; | |
animation: spin 1s linear infinite; | |
} | |
@keyframes spin { | |
0% { transform: translate(-50%, -50%) rotate(0deg); } | |
100% { transform: translate(-50%, -50%) rotate(360deg); } | |
} | |
</style> | |
</head> | |
<body> | |
<div id="loading"><div class="loader"></div></div> | |
<div class="loading-message">Loading RSS feeds...</div> | |
</body> | |
</html> |