Webogram Full-Width Userscript

fix-webogram.js

// ==UserScript==
// @name        Fix Webogram width
// @namespace   webogram.fixes
// @match       https://web.telegram.org/*
// @version     2
// @grant       none
// ==/UserScript==

function addGlobalStyle(css) {
    var head, style;
    head = document.getElementsByTagName('head')[0];
    if (!head) { return; }
    style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML = css;
    head.appendChild(style);
}

// Upper Box, blue bar
addGlobalStyle('div.tg_head_split { max-width: calc(100% - 50px) !important; }');
// The contacts bar
addGlobalStyle('div.im_page_wrap { max-width: calc(100% - 50px) !important; }');
// Chat messages
addGlobalStyle('div.im_message_wrap { max-width: calc(100% - 100px) !important; }');
// The "<friend> is typing..." line
addGlobalStyle('div.im_history_typing { max-width: 100% !important; }');
// The box below the messages, the "send panel"
addGlobalStyle('div.im_send_panel_wrap { max-width: calc(100% - 115px) !important; }');
// The contents of the send panel between the avatars
addGlobalStyle('form.im_send_form { max-width: 100% !important; }');