☰

Patreon responsive + customizations

Patreon website is more suitable for wide screens.

当前为 2024-06-10 提交的版本，查看 最新版本。

  1. /* ==UserStyle==
  2. @name           Patreon responsive + customizations
  3. @version        1.0.1
  4. @description    Patreon 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/patreon-responsive-customizations
  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    bigimages   "Big images"            1
  13. @var    text        fontsize    "Custom font size"      1.2rem
  14. @var    checkbox    nojump      "No Jump to level up"   1
  15. @var    checkbox    nocomments  "No comments"           0
  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. @-moz-document domain("patreon.com") {
  28.     /* Loved */
  29.     [data-tag="like-button"][aria-checked="true"] > div > svg path {
  30.         fill: #c6374d;
  31.     }
  32.     
  33.     .dzWUmz {
  34.         max-width: max-content;
  35.     }
  36.     
  37.     if bigimages {
  38.         .kZrqiR,
  39.         .gFIRbI,
  40.         .ekfOSd,
  41.         .dlPwPr,
  42.         .kBqPDk {
  43.             height: 100%;
  44.             max-height: 100%;
  45.         }
  46.         .gFIRbI,
  47.         .ekfOSd,
  48.         .kZrqiR {
  49.             display: block;
  50.         }
  51.         .kZrqiR img {
  52.             margin-bottom: 2px;
  53.             object-fit: cover;
  54.         }
  55.         .image-carousel {
  56.             height: 112px;
  57.             object-fit: cover;
  58.             width: auto;
  59.         }
  60.     }
  61.     
  62.     if fontsize {
  63.         :root,
  64.         button,
  65.         div,
  66.         li,
  67.         p {
  68.             font-size: fontsize !important;
  69.         }
  70.     }
  71.     
  72.     
  73.     if nocomments {
  74.         [data-tag="content-card-comment-thread-container"],
  75.         .bmnjsr {
  76.             display: none !important;
  77.         }
  78.     }
  79.     
  80.     if nojump {
  81.         .sc-jrQzAO.bAzCwM,
  82.         .sc-o4u8m1-2 > div > div:nth-child(2),
  83.         [data-tag="upgrade-free-membership-button"],
  84.         [data-tag="free-membership-upgrade-cta"] {
  85.             display: none !important;
  86.             height: 0 !important;
  87.             max-height: 0 !important;
  88.         }
  89.     }
  90.     
  91.     if widemode {
  92.         .PSylB,
  93.         .bNdQpa,
  94.         .kYRjdn,
  95.         .idaEYe,
  96.         .lghRlU {
  97.             max-width: 100%;
  98.         }
  99.         .gwGwhu {
  100.             padding: 0;
  101.         }
  102.  
  103.         .bcGqVn {
  104.             grid-template-columns: 80% 20%;
  105.         }
  106.  
  107.         .jwWBqC {
  108.             grid-column-end: span 1;
  109.         }
  110.     }
  111. }