Apply custom CSS to Reddit layout containers
// ==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();