☰

Microsoft Copilot responsive + customizations

Microsoft Copilot website is more suitable for wide screens.

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

  1. /* ==UserStyle==
  2. @name           Microsoft Copilot responsive + customizations
  3. @version        1.0.1
  4. @description    Microsoft Copilot website is more suitable for wide screens.
  5. @author         BreatFR (https://breat.fr)
  6. @namespace      https://gitlab.com/breatfr
  7. @homepageURL    https://gitlab.com/breatfr/microsoft-copilot
  8. @supportURL     https://discord.gg/Q8KSHzdBxs
  9. @license        AGPL-3.0-or-later; https://www.gnu.org/licenses/agpl-3.0.txt
  10. @preprocessor   stylus
  11.  
  12. @var    checkbox    chatmode            "Chat mode"                 1
  13. @var    text        fontsize            "Font size"                 1.2rem
  14. @var    checkbox    hidecopilotpro      "Hide Copilot Pro"          1
  15. @var    checkbox    hidedownloadapp     "Hide Download Application" 1
  16. @var    checkbox    widemode            "Wide mode"                 1
  17. ==/UserStyle== */
  18.  
  19. /* === Credits ===
  20. Website         https://breat.fr
  21. facebook        https://www.facebook.com/breatfroff
  22. mastodon        https://mastodon.social/@breat_fr
  23. telegram        https://t.me/breatfr
  24. vk              https://vk.com/breatfroff
  25. X (twitter)     https://x.com/breatfroff
  26. === Credits === */
  27.  
  28. @-moz-document domain("copilot.microsoft.com") {
  29. /* =============================================
  30.     Whole website
  31. ============================================= */
  32.     /* Font size */
  33.     .text-3xs,
  34.     .text-base,
  35.     .text-sm,
  36.     p,
  37.     span {
  38.         font-size: fontsize !important;
  39.         line-height: 1.5 !important;
  40.     }
  41.     /* Fix background for source number with bigger font size */
  42.     .dark\\:bg-slate-750:is([data-theme=dark] *),
  43.     .light\\:bg-slate-750:is([data-theme=light] *) {
  44.         height: auto;
  45.         padding: 0 .5em;
  46.     }
  47.     
  48.     if hidecopilotpro {
  49.         [data-testid="settings-menu"] > div > div:nth-of-type(1) {
  50.             display: none;
  51.         }
  52.     }
  53.     
  54.     if hidedownloadapp {
  55.         [data-testid="settings-menu"] > div > button[data-testid="promotion-button"],
  56.         [data-testid="settings-menu"] > div > div:nth-of-type(4) {
  57.             display: none;
  58.         }
  59.     }
  60.  
  61.     if widemode {
  62.         [data-testid="composer"] > div:nth-of-type(2) > div,
  63.         [data-testid="composer"] > div:nth-of-type(2) > div > div:nth-of-type(2) > div > div {
  64.             max-width: 100%;
  65.             width: 100%
  66.         }
  67.         [data-testid="settings-menu"] > div > div:last-child {
  68.             flex-wrap: nowrap;
  69.             white-space: nowrap;
  70.         }
  71.         [data-testid="settings-menu"] > div > div:last-child > a:first-child {
  72.             order: 3;
  73.         }
  74.     }
  75. }
  76.  
  77. @-moz-document url("https://copilot.microsoft.com/") {
  78. /* ===================================================
  79.     Discover page
  80. =================================================== */
  81.     if widemode {
  82.         [data-testid="discover-page"] > div {
  83.             max-width: 100%;
  84.             width: 100%
  85.         }
  86.         [data-testid="discover-page"] > div > section > div {
  87.             display: flex;
  88.             flex-wrap: wrap;
  89.             gap: 2em;
  90.             justify-content: center;
  91.         }
  92.         [data-testid="discover-page"] > div > section > div > button,
  93.         [data-testid="discover-page"] > div > section > div > div {
  94.             width: 30%;
  95.         }
  96.         [data-testid="discover-page"] > div > section > div > button > div,
  97.         [data-testid="discover-page"] > div > section > div > div > div {
  98.             flex-direction: column;
  99.         }
  100.         [data-testid="discover-page"] > div > section > div > button > div > div,
  101.         [data-testid="discover-page"] > div > section > div > div > div > div {
  102.             font-size: 1.5rem;
  103.             font-variation-settings: "opsz" 40, "wght" 440;
  104.             justify-content: center;
  105.             line-height: 1.9375rem;
  106.             letter-spacing: -.01em;
  107.             padding-inline-end: 1rem;
  108.             padding-bottom: 1.25rem;
  109.         }
  110.         [data-testid="discover-page"] > div > section > div > button > div > div > h2,
  111.         [data-testid="discover-page"] > div > section > div > div > div > div > h2 {
  112.             text-align: center;
  113.         }
  114.         [data-testid="discover-page"] > div > section > div > button > div > img,
  115.         [data-testid="discover-page"] > div > section > div > div > div > img {
  116.             flex-shrink: 1;
  117.             object-fit: cover;
  118.             width: 100%
  119.         }
  120.     }
  121. }
  122.  
  123. @-moz-document url-prefix("https://copilot.microsoft.com/chats/") {
  124. /* ================================================================
  125.     Chats
  126. ================================================================ */
  127.     if chatmode {
  128.         [data-content="ai-message"] {
  129.             max-width: 80%;
  130.         }
  131.     }
  132.     
  133.     if widemode {
  134.         [data-content="conversation"]{
  135.             max-width: 100%;
  136.             width: 100%
  137.         }
  138.     }
  139. }