☰

Wide Github

Change all Github repository and gist pages to be full width and dynamically sized.

目前为 2018-05-07 提交的版本。查看 最新版本。

  1. "use strict";
  2.  
  3. // ==UserScript==
  4. // @name        Wide Github
  5. // @namespace   https://github.com/xthexder/wide-github
  6. // @description Change all Github repository and gist pages to be full width and dynamically sized.
  7. // @author      xthexder
  8. // @copyright   2013+, xthexder (https://github.com/xthexder)
  9. // @contributor Jason Frey (https://github.com/Fryguy)
  10. // @contributor Marti Martz (https://github.com/Martii)
  11. // @contributor Paul "Joey" Clark (https://github.com/joeytwiddle)
  12. // @license     MIT; https://raw.githubusercontent.com/xthexder/wide-github/master/LICENSE
  13. // @version     1.2.0-joey4
  14. // @icon        https://raw.githubusercontent.com/xthexder/wide-github/master/icon.png
  15. // @homepageURL https://github.com/xthexder/wide-github
  16. // @supportURL  https://github.com/xthexder/wide-github/issues
  17. // @include     *github.com*
  18. // @grant       none
  19. //// Added by Joey:
  20. // @run-at      document-start
  21. // ==/UserScript==
  22.  
  23. // @todo I like the 1500px limit for normal usage, but I want to go much wider when doing side-by-side diffs.
  24. // Options for detection: Guess from the URL, or look for telltale elements in the HTML.
  25. // Options for live updates: Apply new CSS when a change is detected (slow memory leak), or add a toggling class to the root of the page.
  26.  
  27. var styleSheet = "" +
  28. "header .container," +
  29. "header .container-lg {" +
  30.   "width: auto !important;" +
  31.   "margin-left: 20px !important;" +
  32.   "margin-right: 20px !important;" +
  33.   "min-width: 980px;" +
  34.   "max-width: initial;" +
  35. "}" +
  36. "#js-repo-pjax-container .container {" +
  37.   "width: auto !important;" +
  38.   //"margin-left: 20px !important;" +
  39.   //"margin-right: 20px !important;" +
  40.   "min-width: 980px;" +
  41.   // I use zoom 90% in Chrome.  But that causes the left border of the file list to disappear, if I use an even max-width.  So I have to use an odd max-width.
  42.   "max-width: 1499px;" +
  43.   "margin-left: auto !important;" +
  44.   "margin-right: auto !important;" +
  45.   "padding-left: 20px;" +
  46.   "padding-right: 20px;" +
  47. "}" +
  48. ".full-width .container {" +
  49.   "padding-left: auto !important;" +
  50.   "padding-right: auto !important;" +
  51. "}" +
  52.  
  53. // New PR split diff
  54. ".full-width .new-pr-form {" +
  55.   "max-width: none !important;" +
  56. "}" +
  57.  
  58. // Repository Issues
  59. "#js-repo-pjax-container .repository-content .discussion-timeline {" +  // Issue body
  60.   "margin-left: -220px;" +
  61.   "padding-left: 220px;" +
  62.   "width: 100% !important;" +
  63. "}" +
  64. ".repository-content .discussion-sidebar {" +
  65.   "width: 200px !important;" +
  66. "}" +
  67. ".repository-content .timeline-new-comment {" + // New Issue / issue comment form
  68.   "max-width: 100% !important;" +
  69. "}" +
  70. ".repository-content .inline-comments .comment-holder {" + // Diff / code comments
  71.   "max-width: 960px !important;" +
  72. "}" +
  73. ".repository-content .inline-comments .inline-comment-form-container {" +
  74.   "max-width: 960px !important;" +
  75. "}" +
  76. ".repository-content .inline-comments .inline-comment-form {" +
  77.   "max-width: 960px !important;" +
  78. "}" +
  79.  
  80. // Repository pulse page
  81. ".repository-content .authors-and-code .section {" + // Contributors bar graph
  82.   "width: 50%;" +
  83.   "height: 180px;" +
  84. "}" +
  85. ".repository-content .authors-and-code .section svg {" +
  86.   "height: 180px;" +
  87. "}" +
  88.  
  89. // Repository graph page
  90. ".repository-content .capped-card {" + // Graph cards on contributors / graph list
  91.   "margin:10px 10px 0 0 !important;" +
  92. "}" +
  93.  
  94. // Gists
  95. ".gist-content-wrapper .container {" +
  96.   "width: auto !important;" +
  97.   "margin-left: 20px !important;" +
  98.   "margin-right: 20px !important;" +
  99.   "min-width: 980px;" +
  100. "}" +
  101.  
  102. "";
  103.  
  104. (function () {
  105.   var s = document.createElement('style');
  106.   s.type = "text/css";
  107.   s.innerHTML = styleSheet;
  108.   (document.head || document.documentElement).appendChild(s);
  109. })();