WhatsApp like it should be: official dark mode + no whitespace!

Enables the official dark mode on WhatsApp Web (by adding the class `dark` to the body) and also removed the dumb space-wasting layout used on displays wider than 1440px.

目前為 2020-07-11 提交的版本，檢視最新版本。

安裝腳本 ?

發表問題、評論、或檢舉該腳本。

Wrap lines

// ==UserScript==
// @name         WhatsApp like it should be: official dark mode + no whitespace!
// @namespace    https://itsad.am
// @version      1.2.0
// @description  Enables the official dark mode on WhatsApp Web (by adding the class `dark` to the body) and also removed the dumb space-wasting layout used on displays wider than 1440px.
// @author       Adam W
// @match        https://web.whatsapp.com/
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    let styles = `
        div.app-wrapper-web:after{
            display: none;
        }

        @media screen and (min-width: 1441px) {
            .app-wrapper-web > div:first-of-type {
                height: 100% !important;
                top: 0 !important;
                width: 100% !important;
            }

            html[dir] .app-wrapper-web > div:first-of-type {
                box-shadow: 0 1px 1px 0 rgba(var(--shadow-rgb),.06),0 2px 5px 0 rgba(var(--shadow-rgb),.2) !important;
                margin: 0 auto !important;
            }

            html[dir] .app-wrapper-web.safari-fix .h70RQ {
                border-radius: 0 !important;
            }
        }
    `
    let styleSheet = document.createElement("style")
    styleSheet.type = "text/css"
    styleSheet.innerText = styles
    document.head.appendChild(styleSheet)

    // Make dark mode online when media query matches

    function makeDark(x) {
        let body = document.querySelector('body');
        if (x.matches) { // If media query matches
            body.classList.add('dark');
            localStorage.setItem('theme', '"dark"');
        } else {
            body.classList.remove('dark');
            localStorage.setItem('theme', '"light"');
        }
    }

    var x = window.matchMedia("(prefers-color-scheme: dark)")
    makeDark(x) // Call listener function at run time
    x.addListener(makeDark) // Attach listener function on state changes
    window.setTimeout(function () {
        makeDark(x);
    }, 1000);
})();

欢迎访问Greasy Fork镜像