Google Forms - Full Width Fix

Force la largeur à 100% de manière dynamique sur Google Forms

Чтобы установить этот скрипт, вы сначала должны установить расширение браузера, например Tampermonkey, Greasemonkey или Violentmonkey.

Для установки этого скрипта вам необходимо установить расширение, такое как Tampermonkey.

Чтобы установить этот скрипт, вы сначала должны установить расширение браузера, например Tampermonkey или Violentmonkey.

Чтобы установить этот скрипт, вы сначала должны установить расширение браузера, например Tampermonkey или Userscripts.

Чтобы установить этот скрипт, сначала вы должны установить расширение браузера, например Tampermonkey.

Чтобы установить этот скрипт, вы должны установить расширение — менеджер скриптов.

(у меня уже есть менеджер скриптов, дайте мне установить скрипт!)

Чтобы установить этот стиль, сначала вы должны установить расширение браузера, например Stylus.

Чтобы установить этот стиль, сначала вы должны установить расширение браузера, например Stylus.

Чтобы установить этот стиль, сначала вы должны установить расширение браузера, например Stylus.

Чтобы установить этот стиль, сначала вы должны установить расширение — менеджер стилей.

Чтобы установить этот стиль, сначала вы должны установить расширение — менеджер стилей.

Чтобы установить этот стиль, сначала вы должны установить расширение — менеджер стилей.

(у меня уже есть менеджер стилей, дайте мне установить скрипт!)

// ==UserScript==
// @name         Google Forms - Full Width Fix
// @namespace    http://tampermonkey.net/
// @version      1.1
// @description  Force la largeur à 100% de manière dynamique sur Google Forms
// @author       Kyorai
// @match        https://docs.google.com/forms/*
// @grant        none
// @run-at       document-start
// @license MIT 
// ==/UserScript==

(function() {
    'use strict';

    function forceFullWidth() {
        // 1. On cible le formulaire principal (vue utilisateur)
        const form = document.querySelector('form[action*="formResponse"]');
        if (form && form.parentElement) {
            form.parentElement.style.setProperty('width', '100%', 'important');
            form.parentElement.style.setProperty('max-width', '100%', 'important');
        }

        // 2. On cible l'éditeur / vue des réponses (vue créateur - tes captures d'écran)
        // On cherche le conteneur principal qui a une largeur max définie par Google (généralement 770px ou 90vw)
        const containers = document.querySelectorAll('div[jsname]');
        containers.forEach(el => {
            const style = window.getComputedStyle(el);
            // Si l'élément a une largeur max ou une largeur fixe définie par Google, on la fait sauter
            if (style.width.includes('px') && parseInt(style.width) > 600 && parseInt(style.width) < 800) {
                 el.style.setProperty('width', '100%', 'important');
                 el.style.setProperty('max-width', '100%', 'important');
            }
        });

        // 3. Ciblage direct des conteneurs de structure majeurs de Google Forms
        const structuralDivs = document.querySelectorAll('div[role="main"], div[jsname="scpA6d"], div[jsname="le6uub"]');
        structuralDivs.forEach(div => {
            div.style.setProperty('width', '100%', 'important');
            div.style.setProperty('max-width', '100%', 'important');
            // On applique aussi aux enfants directs si nécessaire
            if (div.firstElementChild) {
                div.firstElementChild.style.setProperty('width', '100%', 'important');
                div.firstElementChild.style.setProperty('max-width', '100%', 'important');
            }
        });
    }

    // On lance une observation du DOM pour appliquer le style dès que les éléments s'affichent
    const observer = new MutationObserver((mutations) => {
        forceFullWidth();
    });

    // On commence à observer dès que le document est prêt
    document.addEventListener('DOMContentLoaded', () => {
        forceFullWidth();
        observer.observe(document.body, {
            childList: true,
            subtree: true
        });
    });

})();