FB 新版面

隱藏右側欄/限時動態，並將動態牆寬度擴展到左側欄右邊的可用空間。
当前为 2025-10-23 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name        FB 新版面
// @namespace   https://greasyfork.org/zh-TW/scripts/553388
// @version     0.6
// @description 隱藏右側欄/限時動態，並將動態牆寬度擴展到左側欄右邊的可用空間。
// @author      czh
// @match       https://www.facebook.com/*
// @grant       GM_addStyle
// @run-at      document-start
// @license MIT
// ==/UserScript==

(function() {
    'use strict';

    // ------------------------------------------------------------------
    // 核心 CSS 樣式
    // ------------------------------------------------------------------
    let cssRules = `
        /* 1. 隱藏不必要的元素 (右側欄和限時動態) */

        /* A. 隱藏右側欄位 (聯絡人 / 廣告/建議區塊) */
        .x1daaz14.x1t2pt76, /* FB homepage chat(聯絡人) */
        div[data-pagelet*="RightCol"],
        footer /* 移除 footer 廣告 */
        {
            display: none !important;
        }

        /* B. 隱藏限時動態 (Stories) */
        div[aria-label="限時動態"],
        .xwib8y2.x1y1aw1k.xwya9rg /* homepage Story(限動) */
        {
            display: none !important;
        }

        /* C. 隱藏其他多餘區塊 */
        .xq1tmr.xvue9z>.x1yztbdb /* "你在想什麼?" 貼文區上方的多餘區塊 */
        {
            display: none !important;
        }
        
        /* 2. 佈局擴展 - 讓動態牆填滿寬度 */
        
        /* A. 針對頂級容器：移除可能限制整體寬度的 max-width */
        /* 必須針對 body/html 及其最外層容器，否則內層的擴展會被限制 */
        :is(body, html) > div,
        div[role="main"] > div /* main 的直接父層容器 */
        {
            max-width: none !important;
            width: 100% !important;
        }

        /* B. 針對中央內容區塊 (動態牆 feed 的父容器) 進行擴展 */
        /* 這通常是包含左側欄和中間動態牆的 Flex 容器 */
        .x1ceravr.xq1tmr.xvue9z.x193iq5w, /* 動態、首頁中央容器 */
        .x1xwk8fm.x193iq5w, /* 搜尋中央容器 */
        .xsfy40s.x1miatn0.x9f619 /* 搜尋中央容器 */
        {
            /* 讓這個容器充分佔據寬度 */
            width: 100% !important; 
            max-width: none !important;
            margin-right: 0 !important;
            flex-grow: 1 !important;
        }

        /* C. 動態牆主體 (role="feed") 最終調整：確保它佔滿中間的可用空間 */
        div[role="feed"] {
            width: 100% !important;
            max-width: none !important; /* 移除居中限制 */
            margin-left: 0 !important;
            margin-right: 0 !important;
            padding: 0 20px !important; /* 左右保留一些邊距 */
        }
        
        /* 3. 保留左側導覽欄 (確保其功能正常，不被 width: 100% 影響) */
        div[role="navigation"] {
            position: sticky !important; /* 確保保持原有的粘性位置 */
            flex-shrink: 0 !important; /* 防止它被壓縮 */
            /* 避免設定 max-width，讓 FB 自行控制其寬度 */
        }

        /* 4. 防止動態貼文內部捲動 (解決多欄腳本的副作用) */
        .x6o7n8i.x1unhpq9.x1hc1fzr > div > div>* , /* 首頁動態貼文 */
        .x1xwk8fm.x193iq5w>div /* 搜尋貼文 */
        {
            max-height: none !important; 
            overflow-y: visible !important;
        }
        div[aria-label="前一張卡片"],
        div[aria-label="下一張卡片"]
        {
            display: none !important;
        }
        div[aria-label="捷徑"]
        {
       max-width: 60px;
       min-width: 60px;
       position: absolute;
       z-index: 1;
       }
    `;

    // ------------------------------------------------------------------
    // 注入 CSS
    // ------------------------------------------------------------------

    if (typeof GM_addStyle !== "undefined") {
        GM_addStyle(cssRules);
    } else {
        const styleNode = document.createElement("style");
        styleNode.type = 'text/css';
        styleNode.id = 'fb-single-column-with-sidebar';
        styleNode.appendChild(document.createTextNode(cssRules));
        (document.head || document.documentElement).appendChild(styleNode);
    }

})();