A script to use with the TamperMonkey browser extension to force all pages in Microsoft Loop to be 100% max width.
// ==UserScript==
// @name New Userscript
// @namespace http://tampermonkey.net/
// @version 2025-02-14
// @description A script to use with the TamperMonkey browser extension to force all pages in Microsoft Loop to be 100% max width.
// @author You
// @match https://loop.cloud.microsoft/*
// @icon data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @grant none
// @license MIT
// ==/UserScript==
(function() {
'use strict';
function replacePixelsWithPercentage() {
const searchRegex = /1024px/g;
const replacementString = "100%";
// Function to recursively process text nodes
function processNode(node) {
if (node.nodeType === Node.TEXT_NODE) {
// Replace in text nodes
node.nodeValue = node.nodeValue.replace(searchRegex, replacementString);
} else if (node.nodeType === Node.ELEMENT_NODE) {
// Don't process script or style tags
if (node.tagName !== 'SCRIPT' && node.tagName !== 'STYLE') {
// Recursively process child nodes
for (let i = 0; i < node.childNodes.length; i++) {
processNode(node.childNodes[i]);
}
}
// Check inline styles
if (node.hasAttribute('style')) {
let style = node.getAttribute('style');
let newStyle = style.replace(searchRegex, replacementString);
if (newStyle !== style) {
node.setAttribute('style', newStyle);
}
}
}
}
// Find and Replace within <style> tags.
const styleTags = document.querySelectorAll('style');
styleTags.forEach(styleTag => {
styleTag.textContent = styleTag.textContent.replace(searchRegex, replacementString)
});
// Start processing from the document body
processNode(document.body);
// --- MutationObserver (for dynamically loaded content) ---
const observer = new MutationObserver(mutations => {
mutations.forEach(mutation => {
mutation.addedNodes.forEach(addedNode => {
processNode(addedNode);
});
//Handle style attribute changes
if (mutation.type === 'attributes' && mutation.attributeName === 'style') {
let style = mutation.target.getAttribute('style');
let newStyle = style.replace(searchRegex, replacementString);
if(newStyle !== style){
mutation.target.setAttribute('style', newStyle);
}
}
});
});
// Start observing the document body for changes
observer.observe(document.body, {
childList: true, // Observe direct children
subtree: true, // Observe all descendants
attributes: true,
attributeFilter: ['style']
});
}
// Run the replacement
replacePixelsWithPercentage();
})();