diff --git a/Website/styles.css b/Website/styles.css index 66259d73b..ff4c6ddda 100644 --- a/Website/styles.css +++ b/Website/styles.css @@ -658,6 +658,35 @@ button#toggle-languages:hover { opacity: 0.9; } + +/* Loading Animation CSS */ +.loading-container { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + background-color: rgba(255, 255, 255, 0.8); /* Slightly transparent background */ + z-index: 1000; +} + +.loader { + border: 16px solid #f3f3f3; /* Light grey */ + border-top: 16px solid #3498db; /* Blue */ + border-radius: 50%; + width: 120px; + height: 120px; + animation: spin 2s linear infinite; +} + +@keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} + /* Dark Mode Styles */ body.dark-mode { background-color: #121245; @@ -727,3 +756,4 @@ body.dark-mode { } +