新闻英语大字阅读增强

Sets an extra large font size for readable content on daysinlevels.com, newsinlevels.com, and breakingnewsenglish.com for maximum mobile readability.
安装此脚本？
提问、发表评价或者举报此脚本。
换行
// ==UserScript==
// @name         新闻英语大字阅读增强
// @namespace    http://tampermonkey.net/
// @version      0.6
// @description  Sets an extra large font size for readable content on daysinlevels.com, newsinlevels.com, and breakingnewsenglish.com for maximum mobile readability.
// @author       You
// @match        https://www.daysinlevels.com/*
// @match        https://www.newsinlevels.com/*
// @match        https://breakingnewsenglish.com/*
// @grant        GM_addStyle
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // --- Font Sizing Logic for daysinlevels.com and newsinlevels.com ---
    function applyExtraLargeFontSizeChangesForLevelsSites() {
        // We are now targeting a very broad set of elements that typically contain text.
        // This is more aggressive and should catch almost all visible text.
        const targetSelectors = [
            'body', // Target the entire body as a fallback/base
            'p',    // All paragraphs
            'li',   // All list items
            'span', // All generic span elements (often used for text within other elements)
            'div',  // Many div elements contain text
            'section', // Common HTML5 semantic element for content
            'article', // Common HTML5 semantic element for article content
            'main',    // Common HTML5 semantic element for main content
            'a',       // Links (though be careful not to break navigation)
            '.content-area', // Common class for main content
            '.entry-content', // Specific content wrappers
            '.td-post-content',
            '.td-post-content p',
            '.td-post-content li',
            '.td-post-content span',
            '.td-post-content div',
            '.td_block_inner div', // Targeting specific news-in-levels classes
            '.td_block_inner p',
            '.td_block_inner span',
            '.td-post-title', // Post titles themselves
            '.td-post-sub-title' // Post subtitles
        ];

        // Define a significantly larger target font size in rem.
        // Let's aim for 1.75rem which is roughly 28px, or even 2rem for 32px.
        const targetFontSizeRem = 1.75; // Adjust this: 1.75rem = ~28px, 2rem = ~32px
        const targetLineHeight = 1.9;    // Even more generous line-height for readability

        // Apply font size and line height to the selected elements
        targetSelectors.forEach(selector => {
            document.querySelectorAll(selector).forEach(element => {
                // Ensure it's a visible element and not something that would break layout
                if (element.offsetWidth > 0 || element.offsetHeight > 0) { // Check if element is visible
                    element.style.setProperty('font-size', `${targetFontSizeRem}rem`, 'important');
                    element.style.setProperty('line-height', `${targetLineHeight}`, 'important');
                    // Add word-break to prevent very long words from breaking layout
                    element.style.setProperty('word-break', 'break-word', 'important');
                }
            });
        });

        // Specific adjustments for headings, making them proportionally larger but not absurdly so
        const headingSelectors = [
            'h1', 'h2', 'h3', 'h4', 'h5', 'h6'
        ];
        headingSelectors.forEach(selector => {
            document.querySelectorAll(selector).forEach(heading => {
                let currentFontSize = parseFloat(window.getComputedStyle(heading).fontSize);
                // Ensure headings are at least a certain size, and proportionally larger than body text
                if (currentFontSize < 36) { // If heading is smaller than 36px, scale it up
                    heading.style.setProperty('font-size', `${Math.max(currentFontSize * 1.25, 28)}px`, 'important'); // Increase by 25% or set to 28px min
                    heading.style.setProperty('line-height', '1.3', 'important');
                }
            });
        });
    }

    // --- Font Sizing Logic for breakingnewsenglish.com ---
    function applyBreakingNewsEnglishFontSize() {
        // Use GM_addStyle for a more static CSS injection, as per your original script.
        // Increased to 20px for better consistency with the other sites' larger fonts.
        GM_addStyle(`
            .article-body,
            .content-body,
            #content,
            .article-text {
                font-size: 20px !important;
                line-height: 1.8 !important; /* Added line-height for readability */
            }
            p, li {
                font-size: 20px !important;
                line-height: 1.8 !important; /* Added line-height for readability */
            }
            /* You might need to add more selectors here if other text elements are small */
            /* For example, if headings are small: */
            /* h1, h2, h3, h4, h5, h6 { font-size: 24px !important; line-height: 1.4 !important; } */
        `);
    }

    // --- Main Execution Logic ---
    // Check the current URL and apply the relevant font changes
    if (window.location.hostname.includes('daysinlevels.com') || window.location.hostname.includes('newsinlevels.com')) {
        applyExtraLargeFontSizeChangesForLevelsSites();

        // Observe for DOM changes for dynamic content on Levels sites
        const observer = new MutationObserver((mutations) => {
            let contentAdded = false;
            for (const mutation of mutations) {
                if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
                    for (const node of mutation.addedNodes) {
                        if (node.nodeType === 1 && (node.matches('p, li, span, div, section, article') || node.querySelector('p, li, span, div, section, article'))) {
                            contentAdded = true;
                            break;
                        }
                    }
                }
                if (contentAdded) break;
            }

            if (contentAdded) {
                applyExtraLargeFontSizeChangesForLevelsSites();
            }
        });
        observer.observe(document.body, { childList: true, subtree: true });
        window.addEventListener('resize', applyExtraLargeFontSizeChangesForLevelsSites);

    } else if (window.location.hostname.includes('breakingnewsenglish.com')) {
        applyBreakingNewsEnglishFontSize();
        // For breakingnewsenglish.com, GM_addStyle is usually sufficient and no observer needed
        // as content typically loads at once. If dynamic content appears, you'd need a similar
        // observer setup here, but it's less common for this site.
    }

})();
欢迎访问Greasy Fork镜像
