🏠 Home 

Narrow HDBits

Help HDBits fit on narrower screens


Install this script?
  1. // ==UserScript==
  2. // @name Narrow HDBits
  3. // @namespace club.porcupine.gm_scripts.narrow_hdbits
  4. // @version 1
  5. // @description Help HDBits fit on narrower screens
  6. // @author Sam Birch
  7. // @license MIT
  8. // @icon https://icons.duckduckgo.com/ip2/hdbits.org.ico
  9. // @match https://hdbits.org/*
  10. // @grant none
  11. // ==/UserScript==
  12. (function() {
  13. 'use strict'
  14. let sidebar_container = document.querySelector('#sidebar-container')
  15. let headers = sidebar_container.querySelectorAll('TABLE > TBODY > TR > TD > H2')
  16. let bodies = sidebar_container.querySelectorAll('TABLE > TBODY > TR > TD > TABLE')
  17. sidebar_container.remove()
  18. let new_tr = document.createElement('TR')
  19. for (let i = 0; i < headers.length; i++) {
  20. let new_td = document.createElement('TD')
  21. new_td.className = 'embedded'
  22. new_td.append(headers[i])
  23. new_td.append(bodies[i])
  24. new_tr.append(new_td)
  25. }
  26. let new_tbody = document.createElement('TBODY')
  27. new_tbody.append(new_tr)
  28. let new_table = document.createElement('TABLE')
  29. new_table.className = 'main'
  30. new_table.append(new_tbody)
  31. let new_div = document.createElement('DIV')
  32. new_div.id = 'horizontal-sidebar-container'
  33. new_div.append(new_table)
  34. document.querySelector('.footer').before(new_div)
  35. const stylesheet = document.createElement('style')
  36. stylesheet.innerHTML = `
  37. #horizontal-sidebar-container { min-width: 800px; max-width: 1060px; margin: auto }
  38. #horizontal-sidebar-container > table { width: 100%; table-layout: fixed }
  39. #horizontal-sidebar-container > table > tbody > tr > td { vertical-align: top }
  40. `
  41. document.head.append(stylesheet)
  42. }())