FIS Outlook Enhancer

gistfile1.txt

// ==UserScript==
// @name         FIS Outlook App Enhancer
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Change default contrast in FIS theme for OWA
// @author       Andrei Zharov
// @match        https://outlook.office.com/mail/*
// @grant        GM_addStyle
// ==/UserScript==

(function() {
    const root = document.documentElement;
    console.log("@@@LOADED");
    console.log(root);

    const fisTheme = {
        black: "#000000",
        blackTranslucent40: "rgba(0,0,0,.4)",
        blackTranslucent10: "rgba(0,0,0,.1)",
        white: "#ffffff",
        whiteTranslucent40: "rgba(255,255,255,.4)",
        whiteTranslucent90: "rgba(255,255,255,.9)",
        neutralDark: "#201f1e",
        neutralPrimary: "#323130",
        neutralPrimaryAlt: "#3b3a39",
        neutralSecondary: "#605e5c",
        neutralTertiary: "#a19f9d",
        neutralTertiaryAlt: "#c8c6c4",
        neutralQuaternary: "#d2d0ce",
        neutralQuaternaryAlt: "#e1dfdd",
        neutralLight: "#edebe9",
        neutralLighter: "#f3f2f1",
        neutralLighterAlt: "#faf9f8",
        redDark: "#a4262c",
        green20: "#0b6a0b",
        purple: "#5c2d91",
        flaggedMessage: "#fffdd9",
        richUserContentBackground: "#fff",
        composeNeutralBackground: "#fff",
        composeNeutralLighterBackground: "#f4f4f4",
        readingPaneCardBorder: "#edebe9",
        readingPaneCardFocusBorder: "#d0d0d0",
        themePrimary: "#202124",
        themeSecondary: "#1EB2C1",
        themeTertiary: "#86D5DD",
        themeDark: "#006670",
        themeDarkAlt: "#006670",
        themeDarker: "#005058",
        themeLight: "#D2F4F8",
        themeLighterAlt: "#F1FBFC",
        themeLighter: "#F1FBFC",
        headerBackground: "#f67762",
        headerBackgroundSearch: "#f67762",
        headerBrandText: "#464646",
        headerTextIcons: "#464646",
        headerSearchBoxBackground: "rgba(255,255,255,.7)",
        headerSearchBoxIcon: "#005058",
        headerSearchPlaceholderText: "#005058",
        headerSearchButtonBackground: "#007D8A",
        headerSearchButtonBackgroundHover: "#005058",
        headerSearchButtonIcon: "#464646",
        headerSearchFilters: "#007D8A",
        headerSearchFiltersHover: "#005058",
        headerButtonsBackground: "#ffffff",
        headerButtonsBackgroundHover: "rgba(60,64,67,0.078)",
        headerButtonsBackgroundSearch: "#f67762",
        headerButtonsBackgroundSearchHover: "#006670",
        headerBadgeBackground: "#005058",
        headerBadgeText: "#464646",
        headerSearchIcon: "#464646",
        searchBoxBackground: "rgba(255,255,255,.7)"
    };

    const generalTheme = {
        "text-variant-caption-fontSize": "12px",
        "text-variant-caption-fontWeight": "400",
        "text-variant-caption-lineHeight": "14px",
        "text-variant-body-fontSize": "14px",
        "text-variant-body-fontWeight": "400",
        "text-variant-body-lineHeight": "20px",
        "text-variant-subHeadline-fontSize": "16px",
        "text-variant-subHeadline-fontWeight": "700",
        "text-variant-subHeadline-lineHeight": "22px",
        "text-variant-headline-fontSize": "20px",
        "text-variant-headline-fontWeight": "700",
        "text-variant-headline-lineHeight": "28px",
        "text-variant-title3-fontSize": "24px",
        "text-variant-title3-fontWeight": "700",
        "text-variant-title3-lineHeight": "32px",
        "text-variant-title2-fontSize": "28px",
        "text-variant-title2-fontWeight": "700",
        "text-variant-title2-lineHeight": "36px",
        "text-variant-title1-fontSize": "32px",
        "text-variant-title1-fontWeight": "700",
        "text-variant-title1-lineHeight": "40px",
        "text-variant-largeTitle-fontSize": "40px",
        "text-variant-largeTitle-fontWeight": "700",
        "text-variant-largeTitle-lineHeight": "52px",
        "text-variant-display-fontSize": "68px",
        "text-variant-display-fontWeight": "700",
        "text-variant-display-lineHeight": "92px;",
        "body-fontFamily": "Roboto,RobotoDraft,Helvetica,Arial,sans-serif"
    };

    setTimeout(() => {
        Object.keys(fisTheme).forEach((prop) => {
            document.documentElement.style.setProperty(`--${prop}`, fisTheme[prop]);
        });
        Array.from(document.querySelectorAll(".root-40")).forEach((el) => {
            Object.keys(generalTheme).forEach((prop) => {
                el.style.setProperty(`--${prop}`, generalTheme[prop]);
            });
        });
    }, 4000);

    GM_addStyle(`
        .body-41 {
            font-family: Roboto, RobotoDraft, Helvetica, Arial, sans-serif !important
        }

        .o365cs-base .o365sx-button, .o365sx-navbar, .o365cs-base .o365sx-appName, .o365cs-base .o365sx-appName:visited {
            background-color: #fff !important;
        }

        .o365cs-base .o365sx-button:hover {
            color: #464646 !important;
            background-color: rgba(60,64,67,0.078) !important;
        }

        #tenantLogo_container {
            display: none !important;
        }
    `);
}());