Новогодний таймер на Форуме

таймер до нового года

// ==UserScript==
// @name         Новогодний таймер на Форуме
// @description  таймер до нового года
// @author       stealyourbrain
// @license      MIT
// @match        https://zelenka.guru/*
// @version      0.2
// @namespace    https://greasyfork.org/users/1220529
// ==/UserScript==

(function () {
    'use strict';

    const countdownTimer = document.createElement('div');
    countdownTimer.id = 'ny-timer';
    document.body.appendChild(countdownTimer);

    const newYearDate = new Date('January 1, 2024 00:00:00 GMT+03:00');

    function updateTimer() {
        const currentDate = new Date();
        const timeDiff = newYearDate - currentDate;

        const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24));
        const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / (1000 * 60));
        const seconds = Math.floor((timeDiff % (1000 * 60)) / 1000);

        countdownTimer.innerHTML = `
            <span class="ny-timer-numbers">Осталось до нового года:</span>
            <div class="ny-timer-blocks">
                <div class="ny-timer-block">
                    <span class="ny-timer-number">${days}</span>
                    <span class="ny-timer-label">дней</span>
                </div>
                <div class="ny-timer-block">
                    <span class="ny-timer-number">${hours}</span>
                    <span class="ny-timer-label">часов</span>
                </div>
                <div class="ny-timer-block">
                    <span class="ny-timer-number">${minutes}</span>
                    <span class="ny-timer-label">минут</span>
                </div>
                <div class="ny-timer-block">
                    <span class="ny-timer-number">${seconds}</span>
                    <span class="ny-timer-label">секунд</span>
                </div>
            </div>
        `;
    }

    const styles = `
        .ny-timer-blocks {
            display: flex;
        }

        #ny-timer {
            position: fixed;
            bottom: 100px;
            right: 15px;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            display: flex;
            background-color: #272727;
            padding: 12px;
            border-radius: 8px;
            flex-direction: column;
        }

        .ny-timer-block {
            margin-right: 5px;
            text-align: center;
            color: #fff;
        }

        .ny-timer-number {
            font-size: 10px;
            font-weight: bold;
        }

        .ny-timer-numbers {
            font-size: 9px;
            font-weight: 400;
            margin-bottom: 2px;
        }

        .ny-timer-label {
            font-size: 8px;
        }
    `;

    const styleSheet = document.createElement('style');
    styleSheet.type = 'text/css';
    styleSheet.innerText = styles;
    document.head.appendChild(styleSheet);

    setInterval(updateTimer, 1000);

    updateTimer();
})();