Facebook多欄化

修正高度限制與滾動問題,強化多欄穩定性

目前為 2025-05-11 提交的版本,檢視 最新版本

/* ==UserStyle==
@name         Facebook多欄化
@version      20250511.11
@namespace    http://tampermonkey.net/
@description  修正高度限制與滾動問題,強化多欄穩定性
@license      MIT
==/UserStyle== */

@-moz-document url("https://www.facebook.com/"), url("https://www.facebook.com/?filter=all&sk=h_chr"), url("https://www.facebook.com/?filter=favorites&sk=h_chr"), url("https://www.facebook.com/?filter=friends&sk=h_chr"), url("https://www.facebook.com/?filter=groups&sk=h_chr"), url("https://www.facebook.com/?filter=pages&sk=h_chr"),
regexp("https://www.facebook.com/.*/posts/.*"),
regexp("https://www.facebook.com/groups/.*"), regexp("https://www.facebook.com/reel/.*"), regexp("https://www.facebook.com/search/.*"){

  /* === 核心修正區 === */
  :root {
    --column-count: 4; /* 所需欄數 */
    --column-gap: 20px; /* 彼此間隔 */
    --max-post-height: 80vh;  /* 所佔視窗高度 */
  }

    /* 主容器設定 */
 .x1ceravr.xq1tmr.xvue9z.x193iq5w, /* 首頁與動態寬度 */
 .x1xwk8fm.x193iq5w  /* 搜尋寬度 */
  {
    max-width: 100%;
    width: 97%;
    margin: 0 auto;
    padding: 0 !important;
  }

  /* 側邊欄設定保持不變 */
  .x9f619.x1ja2u2z.xnp8db0.x112wk31.xnjgh8c.xxc7z9f.x1t2pt76.x1u2d2a2.x6ikm8r.x10wlt62.x1xzczws.x7wzq59.xxzkxad.x9e5oc1,
  .xojf56a.xh78kpn.xxzkxad.xcoz2nd.x1cvmir6.x1n2onr6.x1t2pt76.xdt5ytf.x78zum5.x1afcbsf.x2bj2ny,
  .x1vjfegm.x1cvmir6.x1xzczws.x1t2pt76.x2lah0s.xeuugli.x193iq5w.xdt5ytf.x78zum5.x1n2onr6.x9f619
  {
    max-width: 60px;
    min-width: 60px;
    background-color: transparent;
    position: absolute;
    z-index: 1;
  }
  
  /* 右側欄位設定 */
  .x1daaz14.xxzkxad.x7wzq59.x10wlt62.x6ikm8r.x1u2d2a2.x1t2pt76.xxc7z9f.xnjgh8c.x112wk31.xnp8db0.x1ja2u2z.x9f619
  {
    width: 0%;/* 首頁右側通訊人 */
    min-width: 0%;
    background-color: transparent;
    position: absolute;
    right: 0;
  }

  /* 網格容器設定 */
 .x1hc1fzr.x1unhpq9.x6o7n8i > div > div, /* 一般 */
 .x1xwk8fm.x193iq5w  /* 搜尋 */
    {
    display: flex;
    flex-wrap: wrap;
    gap: var(--column-gap);
    justify-content: flex-start;
    align-content: flex-start;
  }

  /* 帖子容器修正 */
 .x1hc1fzr.x1unhpq9.x6o7n8i > div > div > .x1lliihq, /* 一般 */
 .x1xwk8fm.x193iq5w > div  /* 搜尋 */
    {
    width: calc((100% - (var(--column-gap) * (var(--column-count) - 1))) / var(--column-count));
    min-width: 100px;
    max-height: var(--max-post-height);
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    box-sizing: border-box;
    flex-grow: 0;
    flex-shrink: 0;
    position: relative;
    border-radius: 8px;
    margin-bottom: var(--column-gap);
  }

  /* 滾動條美化 */
 .x1lliihq::-webkit-scrollbar
  {
    width: 6px;
  }
 .x1lliihq::-webkit-scrollbar-thumb
  {
    background: #bcc0c4;
    border-radius: 3px;
  }

  /* 隱藏元素規則 */
 .x1ceravr.xq1tmr.xvue9z.x193iq5w > .x1yztbdb,
 .xwib8y2.x1y1aw1k.xwya9rg.x1n2onr6,
 .x1swvt13.x1l90r2v.x1pi30zi.xyamay9.x2lah0s
  {
    display: none;
  }
}