Tampermonkey: Gmail: hide/move left Mail/Meet navbar

gmail-meet-navbar.tamper.js

// ==UserScript==
// @name         Gmail: hide/move left Mail/Meet navbar
// @namespace    https://gist.github.com/vogler
// @downloadURL  https://gist.github.com/vogler/f0e4df4a6fcf5a874f726c45f7440fb0/raw/gmail-meet-navbar.tamper.js
// @version      0.1
// @description  Gmail: the navbar only contains two buttons (of which I never use the Meet button) and wastes 68px width -> hide it or move buttons to the bottom.
// @author       Ralf Vogler
// @match        https://mail.google.com/mail/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=google.com
// @grant        none
// ==/UserScript==

const waitFor = (selector, node = document) => new Promise(resolve => {
    const r = node.querySelector(selector);
    if (r) return resolve(r);
    const observer = new MutationObserver(mutations => {
        const r = node.querySelector(selector);
        if (r) {
            resolve(r);
            observer.disconnect();
        }
    });
    observer.observe(node, {
        childList: true,
        subtree: true
    });
});

const mode = 'bottom'; // hide, bottom

(async function() {
    'use strict';

    const navbar = await waitFor('[role=navigation]');
    if (mode == 'hide') {
      navbar.style.display = 'none';
    } else if (mode == 'bottom') {
      navbar.style.position = 'absolute';
      navbar.style.height = 'auto';
      navbar.style.bottom = '0px';
      navbar.style.background = 'none';
      navbar.classList.remove('a6o'); // this may break? removes the semi-transparent white background above the Mail button which is set via .a6o::before (which can't be accessed in via the DOM...)
    }
})();