☰

Làm đẹp các biểu mẫu web với độ dốc tuyệt đẹp

Tự động áp dụng độ chuyển màu cho tất cả các cột của bảng để làm đẹp nó

Tính đến 14-10-2024. Xem phiên bản mới nhất.

// ==UserScript==
// @name:zh-CN        绚丽渐变美化网页表格
// @description:zh-CN 自动为表格所有列应用颜色渐变来美化
// @name              Beautify web forms with gorgeous gradients
// @description       Automatically apply color gradients to all columns of the table to beautify it
// @name:ar           تجميل نماذج الويب بتدرجات رائعة
// @description:ar    تطبيق التدرجات اللونية تلقائيًا على كافة أعمدة الجدول لتجميله
// @name:bg           Разкрасете уеб формуляри с великолепни градиенти
// @description:bg    Автоматично прилагайте цветови градиенти към всички колони на таблицата, за да я разкрасите
// @name:cs           Zkrášlete webové formuláře nádhernými přechody
// @description:cs    Automaticky aplikujte barevné přechody na všechny sloupce tabulky, abyste ji zkrášlili
// @name:da           Forskønne webformularer med smukke gradienter
// @description:da    Anvend automatisk farvegradienter til alle kolonner i tabellen for at forskønne den
// @name:de           Verschönern Sie Webformulare mit wunderschönen Farbverläufen
// @description:de    Wenden Sie automatisch Farbverläufe auf alle Spalten der Tabelle an, um diese zu verschönern
// @name:el           Ομορφύνετε φόρμες ιστού με υπέροχες διαβαθμίσεις
// @description:el    Εφαρμόστε αυτόματα διαβαθμίσεις χρώματος σε όλες τις στήλες του πίνακα για να τον ομορφύνετε
// @name:en           Beautify web forms with gorgeous gradients
// @description:en    Automatically apply color gradients to all columns of the table to beautify it
// @name:eo           Beligu TTT-formojn per belegaj gradientoj
// @description:eo    Aŭtomate apliku kolorgradientojn al ĉiuj kolumnoj de la tabelo por plibeligi ĝin
// @name:es           Embellezca los formularios web con magníficos degradados
// @description:es    Aplique automáticamente degradados de color a todas las columnas de la tabla para embellecerla
// @name:fi           Kaunista verkkolomakkeita upeilla liukuväreillä
// @description:fi    Käytä värigradientteja automaattisesti kaikkiin taulukon sarakkeisiin kaunistaaksesi sitä
// @name:fr           Embellissez les formulaires Web avec de superbes dégradés
// @description:fr    Appliquez automatiquement des dégradés de couleurs à toutes les colonnes du tableau pour l’embellir
// @name:he           יפות טפסי אינטרנט עם מעברי צבע מדהימים
// @description:he    החל באופן אוטומטי מעברי צבע על כל העמודות של הטבלה כדי לייפות אותה
// @name:hr           Uljepšajte web obrasce prekrasnim gradijentima
// @description:hr    Automatski primijenite prijelaze boja na sve stupce tablice kako biste je uljepšali
// @name:hu           Szépítse a webes űrlapokat gyönyörű színátmenetekkel
// @description:hu    Automatikusan alkalmazza a színátmeneteket a táblázat összes oszlopára a szebbé tétel érdekében
// @name:id           Percantik formulir web dengan gradien menawan
// @description:id    Terapkan gradien warna secara otomatis ke semua kolom tabel untuk mempercantiknya
// @name:it           Abbellisci i moduli web con splendidi gradienti
// @description:it    Applica automaticamente sfumature di colore a tutte le colonne della tabella per abbellirla
// @name:ja           ゴージャスなグラデーションで Web フォームを美しくする
// @description:ja    表のすべての列に色のグラデーションを自動的に適用して、表を美しくします。
// @name:ka           გაალამაზეთ ვებ ფორმები მშვენიერი გრადიენტებით
// @description:ka    ავტომატურად გამოიყენეთ ფერის გრადიენტები ცხრილის ყველა სვეტზე მის გასალამაზებლად
// @name:ko           화려한 그라데이션으로 웹 양식을 아름답게 꾸미세요
// @description:ko    테이블의 모든 열에 색상 그라디언트를 자동으로 적용하여 아름답게 만듭니다.
// @name:nl           Verfraai webformulieren met prachtige verlopen
// @description:nl    Pas automatisch kleurovergangen toe op alle kolommen van de tabel om deze te verfraaien
// @name:nb           Forskjønn nettskjemaer med nydelige gradienter
// @description:nb    Bruk fargegradienter automatisk på alle kolonnene i tabellen for å forskjønne den
// @name:pl           Upiększ formularze internetowe wspaniałymi gradientami
// @description:pl    Automatycznie zastosuj gradienty kolorów do wszystkich kolumn tabeli, aby ją upiększyć
// @name:pt-BR        Embeleze formulários da web com lindos gradientes
// @description:pt-BR Aplique automaticamente gradientes de cores a todas as colunas da tabela para embelezá-la
// @name:ro           Înfrumusețați formularele web cu degrade superbe
// @description:ro    Aplicați automat degrade de culoare tuturor coloanelor tabelului pentru a-l înfrumuseța
// @name:ru           Украсьте веб-формы великолепными градиентами
// @description:ru    Автоматически применяйте цветовые градиенты ко всем столбцам таблицы, чтобы украсить ее.
// @name:sk           Skrášlite webové formuláre nádhernými prechodmi
// @description:sk    Automaticky aplikujte farebné prechody na všetky stĺpce tabuľky, aby ste ju skrášlili
// @name:sr           Улепшајте веб форме прекрасним градијентима
// @description:sr    Аутоматски примените градијенте боја на све колоне табеле да бисте је улепшали
// @name:sv           Försköna webbformulär med underbara gradienter
// @description:sv    Använd automatiskt färggradienter på alla kolumner i tabellen för att försköna den
// @name:th           ตกแต่งเว็บฟอร์มด้วยการไล่ระดับสีที่งดงาม
// @description:th    ใช้การไล่ระดับสีกับคอลัมน์ทั้งหมดของตารางโดยอัตโนมัติเพื่อตกแต่งให้สวยงาม
// @name:tr           Web formlarını muhteşem degradelerle güzelleştirin
// @description:tr    Tabloyu güzelleştirmek için tablonun tüm sütunlarına otomatik olarak renk geçişleri uygulayın
// @name:ug           ئېسىل رېشاتكىلار بىلەن تور شەكىللىرىنى گۈزەللەشتۈرۈڭ
// @description:ug    ئۇنى گۈزەللەشتۈرۈش ئۈچۈن جەدۋەلنىڭ بارلىق ئىستونلىرىغا ئاپتوماتىك گىرىم بويۇملىرىنى ئاپتوماتىك ئىشلىتىڭ
// @name:uk           Прикрашайте веб-форми чудовими градієнтами
// @description:uk    Автоматично застосовуйте градієнти кольорів до всіх стовпців таблиці, щоб прикрасити її
// @name:vi           Làm đẹp các biểu mẫu web với độ dốc tuyệt đẹp
// @description:vi    Tự động áp dụng độ chuyển màu cho tất cả các cột của bảng để làm đẹp nó
// @name:zh-TW        絢麗漸層美化網頁表格
// @description:zh-TW 自動為表格所有欄位套用色彩漸層來美化
// @name:zh-HK        絢麗漸層美化網頁表格
// @description:zh-HK 自動為表格所有欄位套用色彩漸層來美化
// @name:fr-CA        Embellissez les formulaires Web avec de superbes dégradés
// @description:fr-CA Appliquez automatiquement des dégradés de couleurs à toutes les colonnes du tableau pour l’embellir
// @grant             none
// @match             *://*/*
// @author            Yearly,人民的勤务员 <[email protected]>
// @namespace         https://github.com/ChinaGodMan/UserScripts
// @supportURL        https://github.com/ChinaGodMan/UserScripts/issues
// @homepageURL       https://github.com/ChinaGodMan/UserScripts
// @license           MIT
// @icon              data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAwIiBoZWlnaHQ9IjgwMCIgdmlld0JveD0iMCAwIDExIDExIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGZpbGw9IiM0NEMiIGQ9Ik0wIDBoNHYzSDB6Ii8+PHBhdGggZmlsbD0iIzRDNCIgZD0iTTAgNGg0djNIMHoiLz48cGF0aCBmaWxsPSIjQzQ0IiBkPSJNMCA4aDR2M0gweiIvPjxwYXRoIGZpbGw9IiM0Q0MiIGQ9Ik01IDBoMTF2M0g1eiIvPjxwYXRoIGZpbGw9IiNDQzQiIGQ9Ik01IDRoMTF2M0g1eiIvPjxwYXRoIGZpbGw9IiNDNEMiIGQ9Ik01IDhoMTF2M0g1eiIvPjwvc3ZnPg==
// @compatible        chrome
// @compatible        firefox
// @compatible        edge
// @compatible        opera
// @compatible        safari
// @version           1.0.0.9
// @Created           2024-09-06 05:02:49
// @modified          2024-09-06 05:02:49
// ==/UserScript==
(function () {
    'use strict'
    const POLL_INTERVAL = 1000
    const HUE_RANGE = 120 // Hue range for the gradient (green to red or red to green)
    const SATURATION = '80%'
    const LIGHTNESS = '88%'
    function applyGradientToColumn(table, column) {
        const rowCount = table.rows.length
        Array.from(table.rows).forEach((row, index) => {
            const cell = row.cells[column]
            if (!cell) return
            // Calculate a hue based on the row index (no need to rely on cell content)
            const hue = (index / (rowCount - 1)) * HUE_RANGE
            // Apply the gradient color to the cell
            cell.style.backgroundColor = `hsl(${HUE_RANGE - hue}, ${SATURATION}, ${LIGHTNESS})`
        })
    }
    function initializeTable(table) {
        if (table.hasAttribute('data-gradient-initialized')) return
        table.setAttribute('data-gradient-initialized', 'true')
        const columnCount = table.rows[0]?.cells.length || 0
        for (let col = 0; col < columnCount; col++) {
            applyGradientToColumn(table, col)
        }
    }
    function initializeTables() {
        document.querySelectorAll('table:not([data-gradient-initialized])').forEach(initializeTable)
    }
    // Initial call and setup interval to handle dynamically loaded tables
    initializeTables()
    setInterval(initializeTables, POLL_INTERVAL)
})()