☰

Calm Quora's annoying red notification dots

The red notifications on Quora are too glaring, appear too frequently, and do not go away easily enough. Let's make them grey so they aren't such a bother. Also the popups and the adverts can take a hike.

当前为 2018-05-27 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         Calm Quora's annoying red notification dots
  3. // @namespace    joeytwiddle
  4. // @version      1.0.7
  5. // @license      MIT
  6. // @description  The red notifications on Quora are too glaring, appear too frequently, and do not go away easily enough.  Let's make them grey so they aren't such a bother.  Also the popups and the adverts can take a hike.
  7. // @author       joeytwiddle
  8. // @match        https://www.quora.com/*
  9. // @grant        GM_addStyle
  10. // @run-at       document-start
  11. // ==/UserScript==
  12.  
  13. var makeRedNotificationsGrey = true;
  14. var makeTheHeaderGray = false;
  15. var showPopups = false;
  16.  
  17. var deemphasiseAds = true;
  18.  
  19. var openLinksInThisWindow = true;
  20.  
  21. // I find the answers on Quora sort of blur into each other
  22. // To address that, this increases the spacing between them
  23. var increaseSeparationOfAnswers1 = true;
  24.  
  25. // And this indents each answer, but leaves the user's profile picture sticking out
  26. var increaseSeparationOfAnswers2 = true;
  27.  
  28. function afterPageLoad (callback) {
  29.     setTimeout(callback, 4000);
  30. }
  31.  
  32. if (makeRedNotificationsGrey) {
  33.     // Make the red notification dots grey instead
  34.     GM_addStyle('.SiteHeaderBadge, .WriteNavbadge, .red_badge { background: #ddd !important; background-color: #ddd !important; color: #444 !important; transform: scale(0.8); opacity: 0.5; }');
  35. }
  36.  
  37. if (!showPopups) {
  38.     GM_addStyle('.Growl { display: none !important; }');
  39. }
  40.  
  41. // Just make the whole damn header grey!
  42. // As requested by Keeni: https://greasyfork.org/en/forum/discussion/37380/x
  43. if (makeTheHeaderGray) {
  44.     GM_addStyle('.SiteHeader, .questions_to_answer_icon { filter: saturate(0%); }');
  45. }
  46.  
  47. if (deemphasiseAds) {
  48.     afterPageLoad(function () {
  49.         // Quora's advertisements appear visually a lot like the answers, so it is easy to read an advert and get confused because it's talking about a completely tangential topic.
  50.         // For some reason, I decided not to remove the adverts completely, but to de-emphasise them and differentiate them.
  51.         // The padding is needed so that the text doesn't appear to close to the edge of the red box.
  52.         // A hint of Quora red:
  53.         //var cssForAdverts = { backgroundColor: 'hsl(3, 25%, 90%)', opacity: 0.3, padding: '1em' };
  54.         // Just a light grey
  55.         var cssForAdverts = { backgroundColor: '#f2f2f2', opacity: 0.5, padding: '1em', border: '1px solid #bbb' };
  56.         // No background, just de-emphasise.  The padding is not strictly necessary but it can help to differentiate.
  57.         //var cssForAdverts = { opacity: 0.3, padding: '1em' };
  58.         //var cssForAdverts = { opacity: 0.1, padding: '0em' };
  59.         //jQuery('.advertiser_endpoint').closest('.outer_content_box').css(cssForAdverts)
  60.         // jQuery isn't always loaded at this point of time, so let's use DOM instead.
  61.         Array.from(document.querySelectorAll('.advertiser_endpoint')).map(ad => ad.closest('.outer_content_box')).forEach(elem => Object.assign(elem.style, cssForAdverts));
  62.         // On the "Home" feed page
  63.         Array.from(document.querySelectorAll('.AdStory')).forEach(elem => Object.assign(elem.style, cssForAdverts));
  64.     });
  65. }
  66.  
  67. // Beautify avatars
  68. GM_addStyle('.feed_item_answer_user .user { font-weight: 600; }');
  69. GM_addStyle('.NameCredential, .IdentityCredential, .UserCredential { font-style: italic; font-size: 85%; }');
  70.  
  71. if (increaseSeparationOfAnswers1) {
  72.     // Instead of answers cramped together with horizontal rules separating them, put some nice big whitespace between each answer
  73.     //GM_addStyle('.NewGridQuestionPage .AnswerBase { border-top: none; padding: 50px 0px 50px; }');
  74.  
  75.     // Or keep the lines close to the top of each answer
  76.     GM_addStyle('.NewGridQuestionPage .AnswerBase { margin: 40px 0px; }');
  77.     // This gives the same spacing to the adverts
  78.     GM_addStyle('.content_area { margin: 40px 0px; }');
  79. }
  80.  
  81. if (increaseSeparationOfAnswers2) {
  82.     GM_addStyle('.Answer { padding-left: 45px; }');
  83.     GM_addStyle('.ContentHeader { margin-left: -47px; }');
  84. }
  85.  
  86. if (openLinksInThisWindow) {
  87.     afterPageLoad(function () {
  88.         document.body.addEventListener('click', function (evt) {
  89.             var link = evt.target.closest('a');
  90.             if (link && link.getAttribute('target') === '_blank') {
  91.                 link.setAttribute('target', '');
  92.             }
  93.         });
  94.     });
  95. }