Greasy Fork

Greasy Fork is available in English.

Yahoo Mail Beautification

Removes the frost on top of your theme's background and expands the mail area to fill the space left by ad-blockers

目前为 2022-01-31 提交的版本。查看 最新版本

// ==UserScript==
// @name        Yahoo Mail Beautification
// @namespace   com.tipidpc.velc2009
// @description Removes the frost on top of your theme's background and expands the mail area to fill the space left by ad-blockers
// @icon        https://icons.duckduckgo.com/ip3/mail.yahoo.com.ico
// @include     https://mail.yahoo.com/*
// @grant       GM_addStyle
// @license     GNU LGPLv3
// @run-at      document-start
// @version     2.0.2
// ==/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 (!body) {
    setTimeout(removeAntiAdBlock, 20);
    return;
  }
  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();
}
setTimeout(removeAntiAdBlock, 0);
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 (!container) {
    setTimeout(shiftMailList, 20);
    return;
  }
  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;
            }
          }
        }
      }
    }
  }
}
setTimeout(shiftMailList, 0);
window.addEventListener('load', shiftMailList);
window.addEventListener('popstate', shiftMailList);


function collapseRightRail(entries, observer) {
  let rightRail = document.querySelector('[data-test-id="mail-right-rail"]')
  if (!rightRail) {
    setTimeout(collapseRightRail, 20);
    return;
  }
  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';
    }
  }
}
// setTimeout(collapseRightRail, 0);
// window.addEventListener('load', collapseRightRail);
// window.addEventListener('popstate', collapseRightRail);