Fancy Maillist

fancy_kernel_mlist.js

// ==UserScript==
// @name         Fancy Maillist
// @namespace    http://shiwx.org/
// @version      0.1
// @description  make linux maillist easy-to-read.
// @author       SHI Wenxuan
// @match        https://lore.kernel.org/*
// @resource     tailwindCSS https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css
// @require      https://code.jquery.com/jquery-3.6.0.min.js
// @icon         https://www.google.com/s2/favicons?domain=kernel.org
// @grant        GM_addStyle
// @grant        GM_getResourceText
// ==/UserScript==

(function () {
    "use strict";
    // 移除默认样式
    $("link[rel=stylesheet]").remove();
    // 添加视口
    $("title").after('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">')
    // 加载新样式
    GM_addStyle(GM_getResourceText("tailwindCSS"));

    $("body").attr("class", "mx-10");
    let links = $("body > pre > a");
    links.each(function () {
        $(this).attr("class", "font-bold text-blue-600");
    });

    $("pre").wrap('<div class="my-5 py-10 border rounded-lg w-full lg:w-5/6 mx-auto flex justify-center items-center  overflow-x-auto hover:bg-gray-100"> </div>')
    $("pre").attr("class", "px-10 w-min text-sm md:text-base")
    $("hr").remove();

    $("form > div").attr("class", 'bg-yellow-100 my-5 py-10 border rounded-lg w-5/6 mx-auto flex justify-center items-center')
    $("span").wrap("<div class='text-sm bg-purple-100 whitespace-pre-line'></div>")
})();