Yahoo Mail Beautification

Removes the top navigation bar, the frost on top of your theme's background, and spaces left by ad-blockers

当前为 2022-02-28 提交的版本,查看 最新版本

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name        Yahoo Mail Beautification
// @namespace   https://greasyfork.org/en/users/34131-velc-gf
// @version     2.0.6
// @description Removes the top navigation bar, the frost on top of your theme's background, and spaces left by ad-blockers
// @author      Velarde, Louie C.
// @match       https://mail.yahoo.com/*
// @icon        https://icons.duckduckgo.com/ip3/mail.yahoo.com.ico
// @license     LGPL-3.0
// @grant       GM_addStyle
// @run-at      document-end
// ==/UserScript==

GM_addStyle('[role="banner"] {height:60px !important}');
GM_addStyle('[role="navigation"] {display:none}');
GM_addStyle('[data-test-id="content-area"] {background-color: transparent !important}');
GM_addStyle('[data-test-id="mail-app-component"] {background-color: transparent !important}');
GM_addStyle('[data-test-id="comms-properties-bar"] {background-color: transparent !important}');


GM_addStyle('[data-test-id="left-rail-scrolling-container"]::-webkit-scrollbar {height: 8px; width: 8px}');
GM_addStyle('[data-test-id="left-rail-scrolling-container"]::-webkit-scrollbar-thumb {background-color: rgba(255,255,255,0.4)}');
GM_addStyle('[data-test-id="left-rail-scrolling-container"]::-webkit-scrollbar-thumb:hover {background-color: rgba(255,255,255,0.8)}');
GM_addStyle('[data-test-id="left-rail-scrolling-container"]::-webkit-scrollbar-thumb:active {background-color: rgb(255,255,255)}');

GM_addStyle('[data-test-id="virtual-list"]::-webkit-scrollbar {height: 8px; width: 8px}');
GM_addStyle('[data-test-id="virtual-list"]::-webkit-scrollbar-thumb {background-color: rgba(255,255,255,0.4)}');
GM_addStyle('[data-test-id="virtual-list"]::-webkit-scrollbar-thumb:hover {background-color: rgba(255,255,255,0.8)}');
GM_addStyle('[data-test-id="virtual-list"]::-webkit-scrollbar-thumb:active {background-color: rgb(255,255,255)}');


// GM_addStyle('[data-test-id="right-rail-ad"] {display: none}');
GM_addStyle('[data-test-id="right-rail-hidead-btn"] {display: none !important}');
// GM_addStyle('[data-test-id="settings-link-label"] {display: none !important}');



let map = new WeakMap();


function removeAntiAdBlock(mutationList, observer) {
  let body = document.getElementById('app');
  if (!observer && !map.has(body)) {
    observer = new MutationObserver(removeAntiAdBlock);
    observer.observe(body, {childList: true});
    map.set(body, observer);
  }
  let modalContainer = body.querySelector('div > [aria-labelledby="adblock-whitelist-cue"]');
  if (modalContainer) modalContainer.parentNode.remove();
}
window.addEventListener('load', removeAntiAdBlock);
window.addEventListener('popstate', removeAntiAdBlock);


function hasLeftoverSpace(list, ad) {
  return list.childElementCount > 3 && list.children[1].childElementCount == 0 || ad;
}

function isIterable(object) {
  return object && typeof object[Symbol.iterator] === 'function';
}

function shiftMailList(mutationList, observer) {
  let container = document.querySelector('[data-test-id="virtual-list-container"]');
  if (!observer && !map.has(container)) {
    observer = new MutationObserver(shiftMailList);
    observer.observe(container, {childList: true, subtree: true});
    map.set(container, observer);
  }
  let list = container.querySelector('[data-test-id="virtual-list"] > ul');
  if (!list) return;

  let ad = list.querySelector('[data-test-id="pencil-ad-messageList"]');
  if (hasLeftoverSpace(list, ad)) {
    let items = list.children;
    let adItem = ad ? ad.parentNode.parentNode : null;

    let top = 0;
    for (let i = 1, count = items.length; i < count; ++i) {
      let item = items[i];
      if (item === adItem) continue;
      item.style.top = top + 'px';
      top += item.offsetHeight;
    }
  } else if (isIterable(mutationList)) {
    for (let mutation of mutationList) {
      for (let node of mutation.removedNodes) {
        if (node.tagName !== 'LI') continue;
        if (node.firstElementChild.getAttribute('data-test-id')) continue;
        if (node.querySelector('[data-test-id="loading_indicator"]')) {
          let items = list.children;
          let lastItem = mutation.previousSibling;
          let nextIndex = Array.prototype.indexOf.call(items, lastItem) + 1;
          let nextTop = lastItem.offsetTop + lastItem.offsetHeight;
          if (items[nextIndex].offsetTop > nextTop) {
            for (let i = nextIndex, count = items.length; i < count; ++i) {
              let item = items[i];
              item.style.top = nextTop + 'px';
              nextTop += item.offsetHeight;
            }
          }
        }
      }
    }
  }
}
window.addEventListener('load', shiftMailList);
window.addEventListener('popstate', shiftMailList);


function collapseRightRail(entries, observer) {
  let rightRail = document.querySelector('[data-test-id="mail-right-rail"]')
  if (!observer && !map.has(rightRail)) {
    let rightRailObserver = new MutationObserver(collapseRightRail);
    rightRailObserver.observe(rightRail, {childList: true, subtree: true});
    map.set(rightRail, rightRailObserver);
  }

  let apps = rightRail.querySelector('[data-test-id="comms-properties"]');
  let appsBar = apps.parentNode;

  /*if (!observer && !map.has(appsBar)) {
    observer = new IntersectionObserver(collapseRightRail, {root: appsBar});
    observer.observe(apps);
    map.set(appsBar, observer);
  }*/

  if (rightRail.querySelector('[data-test-id="right-rail-ad"]')) {
    if (appsBar.lastChild != apps) {
      appsBar.appendChild(apps);
    }
    appsBar.style.flexDirection = 'column';
    apps.style.flexDirection = 'column';
    apps.style.marginTop = '14px';

    for (let app of apps.children) {
      app.style.margin = '14px 0 0 0';
    }
  } else {
    if (appsBar.firstChild != apps) {
      appsBar.insertBefore(apps, appsBar.firstChild);
    }
    appsBar.style.flexDirection = 'row';
    apps.style.flexDirection = 'row';
    apps.style.marginTop = '0';

    for (let app of apps.children) {
      app.style.margin = '0 14px 0 0';
    }
  }
}
// window.addEventListener('load', collapseRightRail);
// window.addEventListener('popstate', collapseRightRail);