Файловый менеджер

Файловый менеджер - Редактировать - /home/gqdcvggs/forchange.me/2025/index.html

Назад
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Time Progress - Retro Style</title> <link href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.css" rel="stylesheet"> <style> @import url('https://fonts.cdnjs.com/css2?family=Space+Mono:wght@400;700&display=swap'); body { font-family: 'Space Mono', monospace; background: #fdf5e6; background-image: linear-gradient(rgba(255, 255, 255, .2) 2px, transparent 2px), linear-gradient(90deg, rgba(255, 255, 255, .2) 2px, transparent 2px); background-size: 50px 50px; } .retro-window { border: 2px solid #000; box-shadow: 4px 4px 0 #000; background: #fff; } .retro-header { border-bottom: 2px solid #000; padding: 5px; background: linear-gradient(90deg, #000080, #4169e1); color: white; } .retro-button { background: #d3d3d3; border: 2px solid #000; box-shadow: 2px 2px 0 #000; } .progress-container { border: 2px solid #000; padding: 2px; background: #fff; } .progress-bar { background: linear-gradient(90deg, #4169e1 0%, #9400d3 50%, #ff1493 100% ); transition: width 0.3s ease; } .retro-text { color: #000080; text-shadow: 1px 1px 0 rgba(0,0,0,0.2); } .pixel-corners { clip-path: polygon( 0 4px, 4px 0, calc(100% - 4px) 0, 100% 4px, 100% calc(100% - 4px), calc(100% - 4px) 100%, 4px 100%, 0 calc(100% - 4px) ); } </style> </head> <body class="min-h-screen p-4 md:p-8"> <div class="max-w-4xl mx-auto space-y-6"> <!-- Title --> <div class="text-center mb-8"> <h1 class="text-4xl md:text-6xl font-bold retro-text mb-2">TIME MACHINE</h1> <div class="text-sm md:text-base opacity-75">[ R E T R O - F U T U R E ]</div> </div> <!-- Progress Window --> <div class="retro-window pixel-corners"> <div class="retro-header flex items-center"> <div class="w-3 h-3 bg-red-500 rounded-full mr-2"></div> <div class="w-3 h-3 bg-yellow-500 rounded-full mr-2"></div> <div class="w-3 h-3 bg-green-500 rounded-full"></div> <span class="ml-4 font-bold">PROGRESS.EXE</span> </div> <div class="p-6"> <h2 class="text-xl font-bold mb-4 retro-text">Loading July 1st, 2025...</h2> <div class="progress-container"> <div id="progressBar" class="progress-bar h-6" style="width: 0%"></div> </div> <p class="mt-2 text-center font-bold"> <span id="progressText">0</span>% COMPLETE </p> </div> </div> <!-- Countdown Window --> <div class="retro-window pixel-corners"> <div class="retro-header flex items-center"> <div class="w-3 h-3 bg-red-500 rounded-full mr-2"></div> <div class="w-3 h-3 bg-yellow-500 rounded-full mr-2"></div> <div class="w-3 h-3 bg-green-500 rounded-full"></div> <span class="ml-4 font-bold">COUNTDOWN.EXE</span> </div> <div class="p-6"> <h2 class="text-xl font-bold mb-4 retro-text">Time Left in 2025</h2> <div class="grid grid-cols-2 gap-6"> <div class="space-y-3"> <div class="retro-button p-2 text-center"> <div class="text-sm opacity-75">DAYS</div> <div id="days" class="text-2xl font-bold">00</div> </div> <div class="retro-button p-2 text-center"> <div class="text-sm opacity-75">HOURS</div> <div id="hours" class="text-2xl font-bold">00</div> </div> <div class="retro-button p-2 text-center"> <div class="text-sm opacity-75">MINUTES</div> <div id="minutes" class="text-2xl font-bold">00</div> </div> </div> <div class="space-y-3"> <div class="retro-button p-2 text-center"> <div class="text-sm opacity-75">SECONDS</div> <div id="seconds" class="text-2xl font-bold">00</div> </div> <div class="retro-button p-2 text-center"> <div class="text-sm opacity-75">MILLISECONDS</div> <div id="milliseconds" class="text-2xl font-bold">000</div> </div> <div class="retro-button p-2 text-center"> <div class="text-sm opacity-75">SUBMILLI</div> <div id="submilliseconds" class="text-2xl font-bold">000</div> </div> </div> </div> </div> </div> </div> <script> function updateTime() { const now = new Date(); const startOfYear = new Date(2025, 0, 1); const july1st = new Date(2025, 6, 1); const endOfYear = new Date(2025, 11, 31, 23, 59, 59, 999); // Calculate progress to July 1st const totalDaysToJuly = (july1st - startOfYear) / (1000 * 60 * 60 * 24); const daysPassed = (now - startOfYear) / (1000 * 60 * 60 * 24); const progressPercentage = (daysPassed / totalDaysToJuly) * 100; // Update progress bar const progress = Math.min(Math.max(progressPercentage, 0), 100); document.getElementById('progressBar').style.width = `${progress}%`; document.getElementById('progressText').textContent = progress.toFixed(6); // Calculate time until end of year const timeLeft = endOfYear - now; // Update countdown document.getElementById('days').textContent = String(Math.floor(timeLeft / (1000 * 60 * 60 * 24))).padStart(2, '0'); document.getElementById('hours').textContent = String(Math.floor((timeLeft % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60))).padStart(2, '0'); document.getElementById('minutes').textContent = String(Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60))).padStart(2, '0'); document.getElementById('seconds').textContent = String(Math.floor((timeLeft % (1000 * 60)) / 1000)).padStart(2, '0'); document.getElementById('milliseconds').textContent = String(Math.floor(timeLeft % 1000)).padStart(3, '0'); document.getElementById('submilliseconds').textContent = String(Math.floor((timeLeft % 1) * 1000)).padStart(3, '0'); } // Update every millisecond setInterval(updateTime, 1); updateTime(); // Initial update </script> </body> </html>

| ver. 1.6 | Github | . | PHP 8.1.33 | Генерация страницы: 0 | proxy | phpinfo | Настройка