Как программно стилизовать контейнер Google Sheets с скриптом приложений ⇐ CSS

[Anonymous]

Я пытаюсь изменить цвет фона и цвет шрифта основного контейнера по боковой панели Google Sheets-кадр, который содержит заголовок и кнопку закрытия-используя скрипт приложений на стороне сервера. Тем не менее, моя цель состоит в том, чтобы стилизовать элемент пользовательского интерфейса, который содержит мой HTML -контент. Когда я открываю боковую панель, откройте консоль, установите контекст выполнения

Код: Выделить всё

top

[/b], и запустите следующий код, стили контейнера применяются идеально.

Код: Выделить всё

// --- These are the desired colors ---
const containerColor = '#FDC9D1'; // The new sidebar background
const titleFontColor = '#AD1457'; // The new title font color

// --- This script works perfectly when run from the console ---
const styleId = 'custom-sidebar-styler-v2';

const customCss = `
/* Target the main sidebar container */
.appsElementsSideSheetRoot {
background-color: ${containerColor} !important;
}

/* Target the title's font color */
.appsElementsSideSheetTitle {
color: ${titleFontColor} !important;
}
`;

// Clean up any old style element
const oldStyleElement = document.getElementById(styleId);
if (oldStyleElement) {
oldStyleElement.remove();
}

// Create a new  element
const styleElement = document.createElement('style');
styleElement.id = styleId;

// Use createTextNode which is required for the document's TrustedHTML policy
styleElement.appendChild(document.createTextNode(customCss));

// Attach the new  element to the page's head
document.head.appendChild(styleElement);
< /code>
 Что я хочу сделать: Использование сценария приложений < /h3>
Я хочу автоматически запустить этот же стиль, когда моя боковая панель открыта из кода сценария моего приложения. Вот функция code.gs 

, которую я использую, чтобы показать боковую панель:

Код: Выделить всё

function openSidebarByIndex(index) {
const configs = getConfigurations();
const sheetId = Object.keys(configs)[index];

if (sheetId && configs[sheetId]) {
const sheet = getSheetById(sheetId);
if (sheet) {
SpreadsheetApp.getActiveSpreadsheet().setActiveSheet(sheet);

const sheetName = configs[sheetId].sheetName;
const template = HtmlService.createTemplateFromFile('sidebar');
template.sheetId = sheetId;
const html = template.evaluate().setTitle(`${sheetName}`);
SpreadsheetApp.getUi().showSidebar(html);
} else {
SpreadsheetApp.getUi().alert(`The target sheet could not be found. It may have been deleted.`);
}
} else {
SpreadsheetApp.getUi().alert("Could not find the selected form configuration. Please check your settings.");
}
}

Основной вопрос
Почему код Javascript работает при запуска вручную из консоли разработчика, но, похоже, нет возможности заставить его запустить из моего Code.gs файл? документ Однако, поскольку явно возможно, чтобы изменить родительский документ (как доказано консолью), есть ли API, обходной путь или конкретный метод в сценарии приложений, который позволяет сценарию вводить стили в голову родительского документа? Или это фундаментальное ограничение безопасности без программного решения? src = "https://i.sstatic.net/7rdlmvek.png"/>


Подробнее здесь: https://stackoverflow.com/questions/797 ... -apps-scri