Reddit Full Width

Apply custom CSS to Reddit layout containers

이 스크립트를 설치하려면 Tampermonkey, Greasemonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램을 설치해야 합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Userscripts와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 유저 스크립트 관리자 확장 프로그램이 필요합니다.

(이미 유저 스크립트 관리자가 설치되어 있습니다. 설치를 진행합니다!)

Advertisement:

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

(이미 유저 스타일 관리자가 설치되어 있습니다. 설치를 진행합니다!)

Advertisement:

// ==UserScript==
// @name         Reddit Full Width
// @namespace    http://tampermonkey.net/
// @version      1.3
// @description  Apply custom CSS to Reddit layout containers
// @license      CC-BY-NC-SA-4.0
// @match        *://*.reddit.com/*
// @grant        none
// ==/UserScript==

function InjectRedditStyles()
{
    const CustomCssCode =
    `
        @media (min-width: 960px)
        {
            .s\\:\\[\\&\\.fixed-sidebar\\]\\:grid-cols-\\[minmax\\(0\\2c 756px\\)_minmax\\(0\\2c 316px\\)\\].fixed-sidebar
            {
                grid-template-columns: minmax(0, 100%) minmax(0, 321px) !important;
            }
        }

        @media (min-width: 768px)
        {
            .xs\\:\\[\\&\\.fixed-sidebar\\]\\:grid-cols-\\[minmax\\(0\\2c 756px\\)_minmax\\(0\\2c 316px\\)\\].fixed-sidebar
            {
                grid-template-columns: minmax(0, 100%) minmax(0, 316px) !important;
            }
        }

        #subgrid-container,
        .subgrid-container
        {
            width: 100% !important;
        }

        #sticky-comment-composer-wrapper,
        #sticky-comment-composer-wrapper.max-w-\\[756px\\]
        {
            max-width: 100% !important;
            width: 100% !important;
        }

        #sticky-comment-composer-wrapper.fixed.bottom-0
        {
            max-width: 81% !important;
        }

        comment-body-header
        {
            width: 100% !important;
        }

        .label-container.interior-label.without-label
        {
            max-width: 96% !important;
        }
    `;

    const StyleElement = document.createElement('style');
    StyleElement.type = 'text/css';
    StyleElement.appendChild(document.createTextNode(CustomCssCode));

    document.head.appendChild(StyleElement);
}

InjectRedditStyles();