☰

UI changes

Test resizing AH/DLP/SB/SV/QQ ui for mobile and remove a few buttons

  1. // ==UserScript==
  2. // @name        UI changes
  3. // @description Test resizing AH/DLP/SB/SV/QQ ui for mobile and remove a few buttons
  4. // @author      C89sd
  5. // @version     1.9
  6. // @namespace   https://greasyfork.org/users/1376767
  7. // @match       https://www.alternatehistory.com/*
  8. // @match       https://forums.spacebattles.com/*
  9. // @match       https://forums.darklordpotter.net/*
  10. // @match       https://questionablequesting.com/*
  11. // @match       https://forum.questionablequesting.com/*
  12. // @match       https://forums.sufficientvelocity.com/*
  13. // @grant       GM_addStyle
  14. // @run-at      document-start
  15. // @noframes
  16. // ==/UserScript==
  17. 'use strict';
  18.  
  19. document.addEventListener('DOMContentLoaded', () => {
  20.   document.querySelectorAll('.link--external[target="_blank"]').forEach(link => {
  21.     link.removeAttribute('target');
  22.   });
  23. });
  24.  
  25. const IS_AH = window.location.hostname === 'www.alternatehistory.com'
  26.  
  27. const css = `
  28. #XF, #XenForo { font-size: 0.9375em !important;  }
  29.  
  30. html, body { font-size: 15px !important;  line-height: 1.3 !important; }
  31.  
  32. h1.p-title-value { font-size: 18px !important; }
  33. .threadmarkListingHeader-content.threadmarkListingHeader-content--info.with-icon { display: none !important; } /* QQ: hide title below img */
  34.  
  35.  
  36. .structItem-title, .node-title {    font-size: ${ IS_AH ? '15px' : '14px' } !important; }
  37. .structItem-minor, .node-meta, .node-extra  {    font-size: 12px !important; line-height: 1.3 !important; }
  38. .structItem-pageJump { font-size: 10px !important; }
  39. .tagItem {             font-size: 10px !important; }
  40. .structItem-cell {     font-size: 12px !important; }
  41. .pageNavSimple-el {    font-size: 12px !important; }
  42. .p-breadcrumbs { font-size: 12px !important; }
  43.  
  44. .button--link { font-size: 12px !important;}
  45. .threadmarkListingHeader-contentLink { font-size: 12px !important; }
  46. #top, .inputGroup, .input--inline { font-size: 12px !important; }
  47.  
  48. .structItem-tagBlock {
  49.   padding-top: 4px !important;
  50.   display: block !important;
  51. }
  52.  
  53. :root {
  54.   --padTOP: 1px;
  55.   --padBOTTOM: 2px;
  56. }
  57. .structItem-cell--icon {
  58.   width: 54px !important;
  59.   padding: calc(10px + var(--padTOP)) 9px 10px 9px !important;       /* ADD TOP PADDING */
  60. }
  61.  
  62. .structItem-cell--main, .node-main {
  63.   padding-top: calc(5px + var(--padTOP)) !important;        /* ADD TOP PADDING */
  64.   padding-bottom: 2px !important;
  65.  
  66. }
  67. .structItem-cell--latest, .structItem-cell--meta {
  68.   padding-right: 8px !important;
  69.   padding-bottom: calc(8px + var(--padBOTTOM)) !important;    /* ADD BOTTOM PADDING */
  70. }
  71.  
  72.  
  73.  
  74. /* Remove ignore button */
  75. .structItem-ignore  { display: none !important; }
  76. `;
  77. GM_addStyle(css);
  78.  
  79.  
  80.  
  81. window.addEventListener('DOMContentLoaded', () => {
  82.   // Replace 'Thread Tools' with 'Mark threadmarks read'
  83.   const A = Array.from(document.querySelectorAll('.menuTrigger')).find(e => e.textContent === 'Thread Tools');
  84.   const B = Array.from(document.querySelectorAll('.menu-linkRow')).find(e => e.textContent === 'Mark threadmarks read');
  85.   if (A && B) {
  86.     A.classList.remove('menuTrigger');
  87.     A.style.display = 'flex';
  88.     A.textContent = B.textContent;
  89.     A.addEventListener('click', function(e) {
  90.       e.stopPropagation();
  91.       e.preventDefault();
  92.       B.click();
  93.     });
  94.   }
  95.  
  96.   // Remove thread ignore button.
  97.   const btn = document.querySelector('.button--link[data-sk-ignore="Ignore"]');
  98.   if (btn) btn.remove();
  99. });