bbs stuff

complementary to noir

当前为 2025-02-08 提交的版本,查看 最新版本

  1. // ==UserScript==
  2. // @name bbs stuff
  3. // @version 2.7
  4. // @description complementary to noir
  5. // @author Jerry
  6. // @match *://www.1point3acres.com/*
  7. // @match *://newmitbbs.com/*
  8. // @namespace https://greasyfork.org/en/users/28298
  9. // @homepage https://greasyfork.org/en/scripts/456921
  10. // @license MIT
  11. // ==/UserScript==
  12.  
  13. // original author: Michael Wang https://greasyfork.org/en/scripts/472251-dark-mode/code
  14. // with help of claude ai
  15. // https://theabbie.github.io
  16.  
  17. (function () {
  18. // Function to create a button
  19. function createButton(text, url) {
  20. const button = document.createElement('button');
  21. button.innerText = text;
  22. button.style.padding = '0'; // Remove padding to control size explicitly
  23. button.style.fontSize = '18px'; // Font size
  24. button.style.backgroundColor = 'rgba(255, 255, 255, 0)'; // Transparent background
  25. button.style.color = '#ffffff'; // White text color
  26. button.style.border = 'none'; // Remove default border
  27. button.style.borderRadius = '5px'; // Rounded corners
  28. button.style.cursor = 'pointer'; // Pointer cursor on hover
  29. button.style.transition = 'background-color 0.2s'; // Smooth hover effect
  30. button.style.width = '40px'; // Fixed width
  31. button.style.height = '40px'; // Fixed height
  32. button.style.display = 'flex'; // Use flexbox to center content
  33. button.style.justifyContent = 'center'; // Center content horizontally
  34. button.style.alignItems = 'center'; // Center content vertically
  35. button.onclick = function() {
  36. window.location.href = url;
  37. };
  38.  
  39. // Add hover effect
  40. button.addEventListener('mouseenter', () => {
  41. button.style.backgroundColor = '#0056b3'; // Darker blue on hover
  42. });
  43. button.addEventListener('mouseleave', () => {
  44. button.style.backgroundColor = 'rgba(255, 255, 255, 0)'; // Restore original color
  45. });
  46.  
  47. return button;
  48. }
  49.  
  50. // Create a container for the buttons
  51. const buttonContainer = document.createElement('div');
  52. buttonContainer.style.position = 'fixed'; //'absolute'
  53. buttonContainer.style.top = '2px'; // Position at the top
  54. buttonContainer.style.left = '50%'; // Center horizontally
  55. buttonContainer.style.transform = 'translateX(-50%)'; // Adjust for exact horizontal centering
  56. buttonContainer.style.zIndex = '9999'; // Ensure it's on top of other elements
  57. buttonContainer.style.display = 'flex';
  58. buttonContainer.style.flexDirection = 'row'; // Arrange buttons in a row
  59. buttonContainer.style.gap = '10px'; // Equal spacing between buttons
  60. buttonContainer.style.flexWrap = 'wrap'; // Allow buttons to wrap on smaller screens
  61. buttonContainer.style.justifyContent = 'center'; // Center buttons horizontally
  62. buttonContainer.style.alignItems = 'center'; // Center buttons vertically
  63. buttonContainer.style.backgroundColor = 'rgba(255, 255, 255, 0)'; // Transparent background
  64. buttonContainer.style.padding = '5px'; // Smaller padding for the container
  65. buttonContainer.style.borderRadius = '20px'; // Rounded corners for the container
  66. buttonContainer.style.boxShadow = '0 2px 10px rgba(0, 0, 0, 0.05)'; // Add a subtle shadow
  67.  
  68. // Array of button configurations
  69. const buttons = [
  70. { text: '👾', url: 'https://newmitbbs.com' },
  71. { text: '💼', url: 'https://www.1point3acres.com/bbs/forum.php?mod=guide&view=hot&mobile=2' }
  72. ];
  73.  
  74. // Create and append buttons using the array
  75. buttons.forEach(buttonConfig => {
  76. const button = createButton(buttonConfig.text, buttonConfig.url);
  77. buttonContainer.appendChild(button);
  78. });
  79.  
  80. // Append the container to the body
  81. document.body.appendChild(buttonContainer);
  82.  
  83.  
  84.  
  85. // Create style element for dark mode
  86. const bbsDarkStyle = document.createElement('style');
  87. bbsDarkStyle.textContent = `
  88. html {
  89. filter: invert(1) hue-rotate(180deg) contrast(0.8);
  90. }
  91. /** reverse filter for media elements */
  92. img, video, picture, canvas, iframe, embed {
  93. filter: invert(1) hue-rotate(180deg);
  94. }
  95. `;
  96.  
  97. // Initialize based on system mode
  98. let darkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;
  99. if (darkMode) {
  100. document.head.appendChild(bbsDarkStyle);
  101. } else {
  102. document.head.removeChild(bbsDarkStyle);
  103. }
  104. })();