☰

必应搜索质感主题

以卡片形式展示结果，遵循Material Design。

当前为 2020-09-13 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name        Bing Search Material Theme
  3. // @name:zh-CN  必应搜索质感主题
  4. // @description Show results as cards, follow Material Design.
  5. // @description:zh-CN 以卡片形式展示结果，遵循Material Design。
  6. // @namespace   https://greasyfork.org/users/197529
  7. // @version     0.7.2
  8. // @author      kkocdko
  9. // @license     Unlicense
  10. // @match       *://*.bing.com/search
  11. // @run-at      document-start
  12. // ==/UserScript==
  13. "use strict";
  14.  
  15. document.head.appendChild(document.createElement("style")).textContent = `
  16.  
  17. #b_context,
  18. #b_footer,
  19. #b_header #id_h,
  20. #b_header .b_logoArea,
  21. #b_content #ev_talkbox_wrapper,
  22. #b_content #mfa_root,
  23. #b_results .sb_fav,
  24. #b_results .fbans,
  25. #fbpgbt,
  26. #b_notificationContainer_bop,
  27. #b_opalpers {
  28.   display: none;
  29. }
  30.  
  31. body {
  32.   --card-shadow: 0 1px 2px 0 rgba(60, 64, 67, 0.3),
  33.     0 1px 3px 1px rgba(60, 64, 67, 0.15);
  34.   min-width: 0;
  35.   background: rgb(248, 249, 250);
  36. }
  37.  
  38. #b_header,
  39. #b_header .b_searchboxForm,
  40. #b_content,
  41. #b_results {
  42.   width: 90vw;
  43.   min-width: 0;
  44.   max-width: 700px;
  45.   margin: 0 auto;
  46.   background: rgba(0, 0, 0, 0);
  47. }
  48.  
  49. #b_header > * {
  50.   z-index: 1;
  51.   margin: 0;
  52. }
  53.  
  54. #b_header #est_switch > *::after,
  55. #b_header .b_searchboxForm,
  56. #b_header #sa_ul {
  57.   border: 0;
  58.   box-shadow: var(--card-shadow);
  59. }
  60.  
  61. #b_header .b_searchboxForm {
  62.   text-align: right;
  63.   background: #fff;
  64. }
  65.  
  66. #b_header #sb_form_q {
  67.   float: left;
  68.   width: calc(100% - 150px);
  69.   margin: 0;
  70. }
  71.  
  72. #b_header .sa_as {
  73.   text-align: left;
  74. }
  75.  
  76. #b_header #sb_form,
  77. #b_content #b_tween {
  78.   margin-bottom: 10px;
  79. }
  80.  
  81. #b_content {
  82.   padding-left: 0;
  83. }
  84.  
  85. #b_results > * {
  86.   padding: 15px 20px;
  87.   margin-bottom: 15px;
  88.   overflow: hidden;
  89.   border-radius: 5px;
  90.   box-shadow: var(--card-shadow);
  91. }
  92.  
  93. #b_results > * > * {
  94.   padding-top: 0;
  95.   padding-bottom: 0;
  96.   margin: 0;
  97.   border: 0;
  98.   outline: 0;
  99. }
  100.  
  101. #b_results :not(.b_rs) > h2 {
  102.   padding-bottom: 5px;
  103. }
  104.  
  105. #b_results h2 a,
  106. #b_results .b_factrow a,
  107. #b_results .b_rs a {
  108.   color: rgb(13, 71, 161);
  109.   text-decoration: none;
  110. }
  111.  
  112. #b_results strong,
  113. #b_results .b_factrow strong,
  114. #b_results .b_rs strong {
  115.   color: rgb(183, 28, 28);
  116. }
  117.  
  118. #b_results .b_title .square_mi {
  119.   padding-left: 0;
  120. }
  121.  
  122. /* Media List Scroll Button */
  123. #b_results .b_overlay .btn {
  124.   margin: -16px 5px;
  125. }
  126.  
  127. /* View More Button */
  128. #b_results .salink,
  129. #b_results .b_expDesk {
  130.   margin-bottom: 30px;
  131. }
  132.  
  133. /* Sports Match Card */
  134. #b_results li > .sportsAns {
  135.   margin: 0 -1px -15px;
  136. }
  137.  
  138. /* Map Card */
  139. #b_results .mt_mop,
  140. #b_results .lgb_ans {
  141.   margin: -15px -20px;
  142. }
  143. #b_results .mt_mop table {
  144.   margin-left: 10px;
  145. }
  146. #b_results .dynMap {
  147.   width: 100%;
  148. }
  149.  
  150. /* Dict Card */
  151. #b_results .dict_oa {
  152.   padding: 0;
  153. }
  154.  
  155. /* Translate Card */
  156. #b_results #tt_perajx {
  157.   margin: -17px -2px;
  158. }
  159.  
  160. /* People Also Ask Card */
  161. #b_results #df_listaa {
  162.   margin: -15px -20px -20px;
  163. }
  164.  
  165. `.replace(/;/g, "!important;");