Yandex双列显示(修复版)

将Yandex搜索结果改为双列显示布局(修复版)

目前为 2025-04-25 提交的版本。查看 最新版本

// ==UserScript==
// @name         Yandex双列显示(修复版)
// @namespace    http://tampermonkey.net/
// @version      0.2
// @description  将Yandex搜索结果改为双列显示布局(修复版)
// @author       您的名字
// @match        *://yandex.com/search*
// @match        *://yandex.ru/search*
// @match        *://*.yandex.com/search*
// @match        *://*.yandex.ru/search*
// @grant        GM_addStyle
// ==/UserScript==

(function() {
    'use strict';
    
    // 添加CSS样式使搜索结果变为双列
    GM_addStyle(`
        /* 调整主容器宽度 */
        .main {
            width: 95% !important;
            max-width: 1600px !important;
            margin: 0 auto !important;
        }
        
        /* 搜索结果容器 */
        .serp-list, .content__left .organic, ul.serp-list {
            display: grid !important;
            grid-template-columns: repeat(2, 1fr) !important;
            grid-gap: 16px !important;
            width: 100% !important;
            padding: 0 !important;
        }
        
        /* 搜索结果项目样式 */
        .serp-item, .organic .serp-item, .serp-item.organic, li.serp-item, .organic__item {
            width: 100% !important;
            margin: 0 0 15px 0 !important;
            border: 1px solid #e0e0e0 !important;
            border-radius: 8px !important;
            padding: 12px !important;
            box-sizing: border-box !important;
            box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
            transition: box-shadow 0.3s ease !important;
            display: block !important;
        }
        
        .serp-item:hover, .organic .serp-item:hover, li.serp-item:hover, .organic__item:hover {
            box-shadow: 0 3px 8px rgba(0,0,0,0.15) !important;
        }
        
        /* 确保搜索结果区域宽度充足 */
        .content__left {
            width: 100% !important;
            max-width: none !important;
            float: none !important;
        }
        
        /* 重新调整右侧栏位置,使其在结果下方 */
        .content__right, .serp-list + .content__right {
            width: 100% !important;
            margin-top: 20px !important;
            float: none !important;
            clear: both !important;
            position: static !important;
        }
        
        /* 响应式设计 - 在小屏幕上恢复单列 */
        @media (max-width: 1024px) {
            .serp-list, .content__left .organic, ul.serp-list {
                grid-template-columns: 1fr !important;
            }
        }
    `);
    
    // 监听DOM变化以处理动态加载的内容
    function setupObserver() {
        const targetNode = document.body;
        const config = { childList: true, subtree: true };
        
        const callback = function(mutationsList, observer) {
            // 检查是否有新的搜索结果加载
            const updateLayout = () => {
                // 确保即使在动态加载后也应用双列布局
                const allListContainers = document.querySelectorAll('.serp-list, .content__left .organic');
                allListContainers.forEach(container => {
                    if (!container.classList.contains('dual-column-processed')) {
                        container.classList.add('dual-column-processed');
                    }
                });
            };
            
            // 延迟执行以确保DOM元素完全加载
            setTimeout(updateLayout, 100);
        };
        
        const observer = new MutationObserver(callback);
        observer.observe(targetNode, config);
    }
    
    // 主函数:在页面加载后应用样式
    function initDualColumn() {
        setupObserver();
        
        // 标记初始结果列表
        const initialLists = document.querySelectorAll('.serp-list, .content__left .organic, ul.serp-list');
        initialLists.forEach(list => {
            list.classList.add('dual-column-processed');
        });
        
        // 如果DOM还没有完全加载,设置额外的监听器
        if (initialLists.length === 0) {
            window.addEventListener('DOMContentLoaded', function() {
                setupObserver();
                
                const loadedLists = document.querySelectorAll('.serp-list, .content__left .organic, ul.serp-list');
                loadedLists.forEach(list => {
                    list.classList.add('dual-column-processed');
                });
            });
        }
    }
    
    // 执行初始化
    initDualColumn();
    
    // 在页面完全加载后再次检查
    window.addEventListener('load', function() {
        setTimeout(initDualColumn, 500);
    });
})();