125论坛手机版优化

优化125论坛(bbs.125.la)在手机端的显示效果
目前为 2024-12-25 提交的版本。查看最新版本。
换行
// ==UserScript==
// @name         125论坛手机版优化
// @namespace    http://tampermonkey.net/
// @version      1.6
// @description  优化125论坛(bbs.125.la)在手机端的显示效果
// @author       Your name
// @match        https://bbs.125.la/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // 检查是否为移动端访问
    if(!/mobile/i.test(navigator.userAgent)) return;

    // 修复视口设置
    function fixViewport() {
        document.querySelectorAll('meta[name="viewport"]').forEach(el => el.remove());
        const viewport = document.createElement('meta');
        viewport.name = 'viewport';
        viewport.content = 'width=device-width, initial-scale=1, maximum-scale=2, user-scalable=yes';
        document.head.appendChild(viewport);
    }

    // 重置基础布局单位 - 调整基础字体大小计算方式
    function setRootFontSize() {
        // 使用更大的基础字体大小，最小20px
        const baseFontSize = Math.max(screen.width * 0.045, 20);
        document.documentElement.style.fontSize = baseFontSize + 'px';
    }

    // 移除可能影响布局的样式
    function cleanupStyles() {
        const stylesToRemove = [
            'position: fixed',
            'position: absolute',
            'float',
            'transform',
            'zoom'
        ];

        const styleSheets = Array.from(document.styleSheets);
        styleSheets.forEach(sheet => {
            try {
                const rules = Array.from(sheet.cssRules || sheet.rules);
                rules.forEach(rule => {
                    if(rule.style) {
                        stylesToRemove.forEach(style => {
                            if(rule.style.cssText.includes(style)) {
                                rule.style.cssText = rule.style.cssText.replace(new RegExp(style + '[^;]+;', 'g'), '');
                            }
                        });
                    }
                });
            } catch(e) {
                // 跨域样式表会抛出错误，忽略即可
            }
        });
    }

    // 初始化
    function init() {
        fixViewport();
        setRootFontSize();
        cleanupStyles();

        // 监听屏幕旋转
        window.addEventListener('orientationchange', setRootFontSize);
    }

    // 修改自定义样式
    const customCSS = `
        /* 重置基础样式 */
        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
            font-size: 16px; /* 设置默认字体大小 */
        }

        /* 使用rem作为基础单位 */
        html {
            -webkit-text-size-adjust: 100%;
            text-size-adjust: 100%;
            font-size: 16px !important;
        }

        /* 基础布局容器 */
        body {
            width: 100%;
            max-width: 100vw;
            overflow-x: hidden;
            line-height: 1.5;
            font-size: 1.1rem !important;
        }

        /* 使用Grid布局重构页面结构 */
        .container {
            display: grid;
            grid-template-columns: 1fr;
            gap: 1rem;
            width: 100%;
            padding: 1rem;
            font-size: 1.1rem;
        }

        /* 列表项使用Flexbox布局 */
        .sub_forum li {
            display: flex;
            flex-direction: column;
            gap: 0.5rem;
            padding: 1rem;
            border-bottom: 1px solid rgba(0,0,0,0.1);
            font-size: 1.1rem;
        }

        /* 标题和信息使用Grid布局 */
        .forum_a {
            display: grid;
            grid-template-columns: 1fr auto;
            gap: 1rem;
            align-items: start;
            text-decoration: none;
            color: inherit;
            font-size: 1.1rem;
        }

        /* 文字溢出处理 */
        .thread_tit, h3 {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            grid-column: 1 / -1;
            font-size: 1.2rem !important;
            font-weight: bold;
            color: #333;
        }

        /* 统计信息使用Flexbox布局 */
        .f_count {
            display: flex;
            gap: 0.5rem;
            justify-content: flex-end;
            align-items: center;
            font-size: 1rem;
            color: #666;
        }

        /* 帖子标题 */
        h3 {
            font-size: 1.2rem !important;
            margin-bottom: 0.5rem;
        }

        /* 用户名和其他文字 */
        p, span, div {
            font-size: 1.1rem;
        }

        /* 链接文字 */
        a {
            font-size: 1.1rem;
            color: #333;
            text-decoration: none;
        }

        /* 确保所有文字都有合适的大小 */
        .sub_forum *, .container * {
            font-size: inherit;
        }
    `;

    // 插入样式
    const style = document.createElement('style');
    style.textContent = customCSS;
    document.head.appendChild(style);

    // 在DOM加载完成后初始化
    if(document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', init);
    } else {
        init();
    }

})();