Notion Full-Width Pages in Narrow Viewport Edited

Greasy Fork is available in English.

Notion Full-Width Pages in Narrow Viewport Edited

Allows pages to fill the viewport width when the viewport is narrow.

目前为 2022-01-14 提交的版本。查看最新版本。

换行

// ==UserScript==
// @name        Notion Full-Width Pages in Narrow Viewport Edited
// @namespace   Notion Custom Scripts
// @match       *://www.notion.so/*
// @grant       GM_addStyle
// @version     1.0
// @author      Jacob Zimmerman (jczimm) <[email protected]> modified by symant233
// @description Allows pages to fill the viewport width when the viewport is narrow.
// ==/UserScript==

GM_addStyle(`
@media (max-width: 850px) {
    .notion-overlay-container > div > div > div[style*="relative"] { /* don't select the gray background overlay, which has position: absolute */
        max-height: unset !important;
        max-width: unset !important;
        width: 100% !important;
        height: 100% !important;
        top: 0 !important;
    }
    .notion-overlay-container .notion-quick-find-menu,
    .notion-overlay-container .notion-quick-find-menu > div {
        max-height: unset !important;
        max-width: unset !important;
    }

    .notion-frame > .notion-scroller > div:not(.notion-page-content) 
    > div:not([contenteditable="false"]), .notion-page-content {
        padding-left: 1em !important;
        padding-right: 1em !important;
    }

    .notion-page-content .notion-focusable {
        padding: unset !important;
    }

    .notion-frame > .notion-scroller > div:not(.notion-page-content)[style*="padding"] {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    div[data-block-id] {
        max-width: unset !important;
    }
}`);