☰

Patreon responsive + customizations

Patreon website is more suitable for wide screens.

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

  1. /* ==UserStyle==
  2. @name           Patreon responsive + customizations
  3. @version        1.0.0
  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.     if bigimages {
  34.         .kZrqiR,
  35.         .gFIRbI,
  36.         .ekfOSd,
  37.         .dlPwPr,
  38.         .kBqPDk {
  39.             height: 100%;
  40.             max-height: 100%;
  41.         }
  42.         .gFIRbI,
  43.         .ekfOSd,
  44.         .kZrqiR {
  45.             display: block;
  46.         }
  47.         .kZrqiR img {
  48.             margin-bottom: 2px;
  49.             object-fit: cover;
  50.         }
  51.         .image-carousel {
  52.             height: 112px;
  53.             object-fit: cover;
  54.             width: auto;
  55.         }
  56.     }
  57.     
  58.     if fontsize {
  59.         :root,
  60.         button,
  61.         div,
  62.         li,
  63.         p {
  64.             font-size: fontsize !important;
  65.         }
  66.     }
  67.     
  68.     
  69.     if nocomments {
  70.         [data-tag="content-card-comment-thread-container"],
  71.         .bmnjsr {
  72.             display: none !important;
  73.         }
  74.     }
  75.     
  76.     if nojump {
  77.         .sc-jrQzAO.bAzCwM,
  78.         .sc-o4u8m1-2 > div > div:nth-child(2),
  79.         [data-tag="upgrade-free-membership-button"],
  80.         [data-tag="free-membership-upgrade-cta"] {
  81.             display: none !important;
  82.             height: 0 !important;
  83.             max-height: 0 !important;
  84.         }
  85.     }
  86.     
  87.     if widemode {
  88.         .PSylB,
  89.         .bNdQpa,
  90.         .kYRjdn,
  91.         .idaEYe,
  92.         .lghRlU {
  93.             max-width: 100%;
  94.         }
  95.         .gwGwhu {
  96.             padding: 0;
  97.         }
  98.  
  99.         .bcGqVn {
  100.             grid-template-columns: 80% 20%;
  101.         }
  102.  
  103.         .jwWBqC {
  104.             grid-column-end: span 1;
  105.         }
  106.     }
  107. }