Sets style="max-width: 100%;" on dynamically loaded elements matching specific classes to fix overflow issues.
当前为
// ==UserScript==
// @name Google Ai Studio Full/Max Width Fix
// @namespace http://tampermonkey.net/
// @version 1.0
// @description Sets style="max-width: 100%;" on dynamically loaded elements matching specific classes to fix overflow issues.
// @author Ȼaptain Jøhn “Søap” MacTavish
// @match https://aistudio.google.com/*
// @grant none
// @run-at document-idle
// @license MIT
// ==/UserScript==
(
function()
{
'use strict';
// The combined CSS selector for the target elements.
// Note: The second class is a compound selector using two classes on the same element.
const targetSelector = '.ng-star-inserted, .mat-mdc-tooltip-trigger.prompt-input-wrapper';
/**
* Applies the desired style (max-width: 100%) to all matching elements
* within a specified root element.
*
* @param {Node} rootElement The element to start searching from (usually document or a mutation node).
*/
const applyStyles =
(
rootElement = document
) =>
{
// Find all elements matching the selector
const elements = rootElement.querySelectorAll(targetSelector);
elements.forEach
(
(element) =>
{
// Only apply if it doesn't already have the correct inline style
if (element.style.maxWidth !== '100%')
{
element.style.maxWidth = '100%';
// console.log("Applied max-width: 100% to element:", element);
}
}
);
};
/**
* The callback function for the MutationObserver.
* It runs applyStyles on all newly added nodes.
*
* @param {Array<MutationRecord>} mutationsList The list of detected mutations.
*/
const observerCallback =
(
mutationsList,
observer
) =>
{
for (const mutation of mutationsList)
{
if (mutation.type === 'childList')
{
// Iterate over all newly added nodes
mutation.addedNodes.forEach
(
(node) =>
{
// Ensure the node is an Element node (type 1)
if (node.nodeType === 1)
{
// Apply styles to the added node itself and its descendants
applyStyles(node);
// If the node itself matches the selector, apply style
if (node.matches(targetSelector))
{
node.style.maxWidth = '100%';
}
}
}
);
}
}
};
// --- Initialization ---
// 1. Apply styles on initial load for elements already in the DOM
applyStyles();
// 2. Set up the MutationObserver to handle dynamic content
const observer = new MutationObserver(observerCallback);
// Configuration for the observer: watch for new children anywhere in the body
const observerConfig =
{
childList: true,
subtree: true
};
// Start observing the document body for configured mutations
observer.observe(document.body, observerConfig);
}
)();
QingJ © 2025
镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址