☰

Google Card-Style UI

Greatly Beautify Google UI!

目前為 2016-04-05 提交的版本，檢視 最新版本。

  1. // ==UserScript==
  2. // @name        Google Card-Style UI
  3. // @description Greatly Beautify Google UI!
  4. // @author      Fei Sun
  5. // @version     1.0.0
  6. // @include     http://*google.com/*
  7. // @include     https://*google.com/*
  8. // @grant       GM_getValue
  9. // @grant       GM_setValue
  10. // @grant       GM_deleteValue
  11. // @grant       GM_xmlhttpRequest
  12. // @namespace https://greasyfork.org/users/35010
  13. // ==/UserScript==
  14. var cssblock=document.createElement("div");
  15. /*jshint multistr: true */
  16. var csstext="<style>body {\
  17.   background:whitesmoke;\
  18. }\
  19. * {\
  20.   font-family:'Segoe UI','Microsoft YaHei'!important;\
  21.   box-sizing:border-box;\
  22. }\
  23. .g {\
  24.   background:white;\
  25.   padding:20px;\
  26.   box-shadow:0px 0px 2px gray;\
  27.   margin-bottom:10px!important;\
  28.   transition:all 0.1s;\
  29.   position:relative;\
  30. }\
  31. .g:hover {\
  32.   box-shadow:0px 0px 100px gray;\
  33.   z-index:900;\
  34. }\
  35. .sfbg.nojsv .sfbgg {\
  36.   background:white!important;\
  37. }\
  38. #searchform {\
  39.   position:fixed!important;\
  40. }\
  41. #top_nav,.appbar {\
  42.   box-shadow:0px 0px 1px gray;\
  43. }\
  44. .appbar {\
  45.   margin-top:59px;\
  46.   border-bottom:none;\
  47. }\
  48. #top_nav {\
  49.   position:fixed;\
  50.   top:59px;\
  51.   width:100%;\
  52.   z-index:100;\
  53. }\
  54. #cnt {\
  55.   width:100%;\
  56. }\
  57. .mw {\
  58.   width:100%;\
  59.   max-width:100%!important;\
  60. }\
  61. #rcnt {\
  62.   width:100%!important;\
  63.   padding-left:6%;\
  64. }\
  65. #rcnt .col:nth-child(3) {\
  66.   width:65%!important;\
  67.   min-width:507px;\
  68. }\
  69. #rcnt .col:nth-child(4) {\
  70.   width:25%!important;\
  71.   float:left;\
  72.   padding-top:6px;\
  73. }\
  74. #center_col {\
  75.   width:100%!important;\
  76.   min-width:0px!important;\
  77.   margin-left:0px!important;\
  78.   padding-top:0px!important;\
  79. }\
  80. #rhscol {\
  81.   width:20%!important;\
  82.   min-width:200px;\
  83.   float:right;\
  84. }\
  85. #rhs {\
  86.   margin-left:0px!important;\
  87. }\
  88. .kp-blk._Jw._Rqb._RJe {\
  89.   margin:0px!important;\
  90. }\
  91. .s {\
  92.   max-width:100%;\
  93. }\
  94. h3.r:after {\
  95.   content:'';\
  96.   display:block;\
  97.   border-bottom:1px solid #bbb;\
  98.   height:5px;\
  99.   margin-bottom:5px;\
  100. }\
  101. #center_col .kp-blk {\
  102.   margin-left:0px;\
  103.   margin-right:0px;\
  104. }\
  105. .kno-ftr {\
  106.     margin: 0 -35px 0 -8px;\
  107.     padding: 4px 40px 0;\
  108. }\
  109. .related-question-pair>div>div>div>div {\
  110.   padding-top:10px!important;\
  111. }\
  112. ._U7g._grf {\
  113.   padding-top:10px;\
  114.   padding-bottom:10px;\
  115. }\
  116. #extrares {\
  117.   background:transparent;\
  118.   padding:8px!important;\
  119. }\
  120. #botstuff {\
  121.   background:white;\
  122.   padding:20px;\
  123.   box-shadow:0px 0px 2px gray;\
  124.   transition:all 0.1s;\
  125.   position:relative;\
  126. }\
  127. #botstuff:hover {\
  128.   box-shadow:0px 0px 100px gray;\
  129.   z-index:900;\
  130. }\
  131. ._Ugf {\
  132.   overflow:hidden;\
  133. }\
  134. a._Eu._H2 {\
  135.   display:block;\
  136.   width:100%!important;\
  137.   background:white;\
  138.   padding:20px;\
  139.   box-shadow:0px 0px 2px gray;\
  140.   transition:all 0.1s;\
  141.   position:relative;\
  142. }\
  143. a._Eu._H2:hover {\
  144.   box-shadow:0px 0px 100px gray;\
  145.   z-index:900;\
  146. }\
  147. </style>";
  148. cssblock.innerHTML=csstext;
  149. document.body.appendChild(cssblock);